Hi Daniil,
For disabling the text field I have used listeners render property. Below is the runnable test case. Using render I will be disabling each and every column.
I could not use Component columns Beforebind event. And also deselect event for enabling the the text field. Can you update my existing code with those properties. I want the 'Company' and 'Change' columns also to be enabled and disabled as per the check box selection.
<%@ Page Language="C#" AutoEventWireup="true" %>
<%@ Import Namespace="System.Collections.Generic" %>
<%@ 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 = new List<Company>
{
new Company(0, "3m Co", 71.72, 0.02, 0.03),
new Company(1, "Alcoa Inc", 29.01, 0.42, 1.47),
new Company(2, "Altria Group Inc", 83.81, 0.28, 0.34),
new Company(3, "American Express Company", 52.55, 0.01, 0.02),
new Company(4, "American International Group, Inc.", 64.13, 0.31, 0.49),
new Company(5, "AT&T Inc.", 31.61, -0.48, -1.54),
new Company(6, "Boeing Co.", 75.43, 0.53, 0.71),
new Company(7, "Caterpillar Inc.", 67.27, 0.92, 1.39),
new Company(8, "Citigroup, Inc.", 49.37, 0.02, 0.04),
new Company(9, "E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28),
new Company(10, "Exxon Mobil Corp", 68.1, -0.43, -0.64),
new Company(11, "General Electric Company", 34.14, -0.08, -0.23),
new Company(12, "General Motors Corporation", 30.27, 1.09, 3.74),
new Company(13, "Hewlett-Packard Co.", 36.53, -0.03, -0.08)
};
if (!this.IsPostBack)
{
RowSelectionModel sm = this.GridPanel1.GetSelectionModel() as RowSelectionModel;
sm.SelectedRows.Add(new SelectedRow(1));
sm.SelectedRows.Add(new SelectedRow(3));
sm.SelectedRows.Add(new SelectedRow(5));
sm.SelectedRows.Add(new SelectedRow(7));
sm.SelectedRows.Add(new SelectedRow(9));
sm.SelectedRows.Add(new SelectedRow(11));
sm.SelectedRows.Add(new SelectedRow(13));
}
}
}
public class Company
{
public Company(int id, string name, double price, double change, double pctChange)
{
this.ID = id;
this.Name = name;
this.Price = price;
this.Change = change;
this.PctChange = pctChange;
}
public int ID { get; set; }
public string Name { get; set; }
public double Price { get; set; }
public double Change { get; set; }
public double PctChange { get; set; }
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>GridPanel with Checkbox Selection Model - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" />
<script>
var template = '<span style="color:{0};">{1}</span>';
var change = function (value) {
return Ext.String.format(template, (value > 0) ? "green" : "red", value);
};
var pctChange = function (value) {
return Ext.String.format(template, (value > 0) ? "green" : "red", value + "%");
};
function disablePrice(field, columnValueCSS) {
var abc = this;
if ((field.record.data.ID % 2) == 0) {
abc.disable();
}
}
</script>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<h1>GridPanel with Checkbox Selection Model</h1>
<ext:GridPanel
ID="GridPanel1"
runat="server"
Title="Company List"
Collapsible="true"
Width="600">
<Store>
<ext:Store ID="Store1" runat="server" PageSize="10">
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="ID">
<Fields>
<ext:ModelField Name="ID" />
<ext:ModelField Name="Name" />
<ext:ModelField Name="Price" />
<ext:ModelField Name="Change" />
<ext:ModelField Name="PctChange" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column ID="Column1"
runat="server"
Text="Company"
Width="160"
DataIndex="Name"
Resizable="false"
MenuDisabled="true"
Flex="1" />
<%-- <ext:Column ID="Column2" runat="server" Text="Price" Width="75" DataIndex="Price">
<Renderer Format="UsMoney" />
</ext:Column>--%>
<ext:Column ID="Column3" runat="server" Text="Change" Width="75" DataIndex="Change">
<Renderer Fn="change" />
</ext:Column>
<ext:ComponentColumn ID="ComponentColumn2" runat="server" Editor="true" DataIndex="Price" Width="295" Text="Price">
<Component>
<ext:TextField ID="TextField2" runat="server">
<Listeners>
<Render Fn="disablePrice"></Render>
</Listeners>
</ext:TextField>
</Component>
</ext:ComponentColumn>
</Columns>
</ColumnModel>
<SelectionModel>
<ext:CheckboxSelectionModel ID="CheckboxSelectionModel1" runat="server" Mode="Multi" />
</SelectionModel>
</ext:GridPanel>
<div style="width: 590px; border: 1px solid gray; padding: 5px;">
<ext:Label ID="Label1" runat="server" />
</div>
</form>
</body>
</html>