Sep 19, 2012, 3:12 PM
[CLOSED] How to highlight entire row in this grid control when value= valueXYZ?
Hi,
In this online sample code, how do you highlight the entire row in the Grid instead of just changing the value to different color?
Thank you in advance for your help!
https://examples2.ext.net/#/GridPanel/ArrayGrid/Simple/
In this online sample code, how do you highlight the entire row in the Grid instead of just changing the value to different color?
Thank you in advance for your help!
https://examples2.ext.net/#/GridPanel/ArrayGrid/Simple/
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.Store1.DataSource = this.Data;
this.Store1.DataBind();
}
}
private object[] Data
{
get
{
return new object[]
{
new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
};
}
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Simple Array Grid - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" type="text/css" />
<style type="text/css">
.x-grid-row-over .x-grid-cell-inner {
font-weight : bold;
}
</style>
<script type="text/javascript">
var template = '<span style="color:{0};">{1}</span>';
var change = function (value) {
return Ext.String.format(template, (value > 0) ? "green" : "red", value);
};
</script>
</head>
<body>
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<h1>Simple Array Grid</h1>
<ext:GridPanel
ID="GridPanel1"
runat="server"
Title="Array Grid"
Width="600"
Height="350">
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="company" />
<ext:ModelField Name="price" Type="Float" />
<ext:ModelField Name="change" Type="Float" />
<ext:ModelField Name="pctChange" Type="Float" />
<ext:ModelField Name="lastChange" Type="Date" DateFormat="M/d hh:mmtt" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:Column ID="Column1" runat="server" Text="Company" DataIndex="company" Flex="1" />
<ext:Column ID="Column2" runat="server" Text="Price" DataIndex="price">
</ext:Column>
<ext:Column ID="Column3" runat="server" Text="Change" DataIndex="change">
</ext:Column>
<ext:Column ID="Column4" runat="server" Text="Change" DataIndex="pctChange">
</ext:Column>
<ext:DateColumn ID="DateColumn1" runat="server" Text="Last Updated" DataIndex="lastChange" >
<Renderer Fn="change" />
</ext:DateColumn>
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" />
</SelectionModel>
</ext:GridPanel>
</body>
</html>
Last edited by Daniil; Sep 19, 2012 at 6:21 PM.
Reason: [CLOSED]