Hello Daniil,
Below is a simplified (as I could) sample code. I removed the server logic just calling commitChanges. After save, record is not dirty and save button is disabled. However the red dirty icon still appears in the edited cell.
Note-1: Edit "Value" column and click Save button to test.
Note-2: MyStore AutoLoad is false for render purposes.
Note-3: I need to use UseNull=true for ValueField if it makes sense.
Thanks for quick response.
<%@ 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.MyStore.DataSource = new List<object>
{
new {
ID = 1,
NameID = 1,
Value = 3
},
new {
ID = 2,
NameID = 1,
Value = 5
},
new {
ID = 3,
NameID = 2,
Value = 7
},
new {
ID = 4,
NameID = 2,
Value = 6
},
new {
ID = 5,
NameID = 3,
Value = 9
}
};
this.MyStore.DataBind();
this.NameStore.DataSource = new List<object>
{
new {
ID = 1,
Name = "Bond"
},
new {
ID = 2,
Name = "James Bond"
},
new {
ID = 3,
Name = "Bond Jr."
}
};
}
}
</script>
<script type="text/javascript">
function MyCellEditingHandler(item, e) {
if (App.MyStore.isDirty()) {
App.MyButton.enable();
}
else {
App.MyButton.disable();
}
}
function MyRenderer(value) {
return App.NameStore.getById(value).data.Name;
}
function SaveGrid() {
App.MyStore.commitChanges();
if (!App.MyStore.isDirty()) {
App.MyButton.disable();
}
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Ext.NET Examples</title>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" SourceFormatting="True" />
<ext:Store ID="MyStore" runat="server" AutoLoad="false">
<Model>
<ext:Model ID="MyStoreModel" runat="server" IDProperty="ID">
<Fields>
<ext:ModelField Name="ID" Type="Int"></ext:ModelField>
<ext:ModelField Name="NameID" Type="Int"></ext:ModelField>
<ext:ModelField Name="Value" Type="Int" UseNull="true"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
</ext:Store>
<ext:Store ID="NameStore" runat="server">
<Model>
<ext:Model ID="NameStoreModel" runat="server" IDProperty="ID">
<Fields>
<ext:ModelField Name="ID" Type="Int"></ext:ModelField>
<ext:ModelField Name="Name" Type="String"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
<Listeners>
<Load Handler="App.MyGrid.store.load();"></Load>
</Listeners>
</ext:Store>
<ext:GridPanel ID="MyGrid" runat="server" StoreID="MyStore" MinHeight="200" Collapsible="false" Flex="1" Title="My Form" SelectionMemory="false">
<TopBar>
<ext:Toolbar ID="Toolbar1" runat="server" EnableOverflow="true">
<Items>
<ext:ToolbarFill />
<ext:Button ID="MyButton" runat="server" Icon="Disk" Disabled="true">
<Listeners>
<Click Handler="SaveGrid()"></Click>
</Listeners>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<ColumnModel runat="server" ID="MyColumnModel">
<Columns>
<ext:Column ID="Name" runat="server" Text="Name" DataIndex="NameID" Align="Left" Flex="1">
<Renderer Fn="MyRenderer"></Renderer>
</ext:Column>
<ext:Column ID="Value" runat="server" Text="Value" DataIndex="Value" Align="Left" Flex="1">
<Editor>
<ext:NumberField runat="server" ID="RankEditor" AllowDecimals="false" AllowBlank=true></ext:NumberField>
</Editor>
</ext:Column>
</Columns>
</ColumnModel>
<SelectionModel>
<ext:CellSelectionModel ID="MyCellSelectionModel" runat="server" Mode="Single">
</ext:CellSelectionModel>
</SelectionModel>
<Plugins>
<ext:CellEditing ID="MyCellEditing" runat="server">
<Listeners>
<Edit Handler="MyCellEditingHandler(item,e);"></Edit>
</Listeners>
</ext:CellEditing>
</Plugins>
</ext:GridPanel>
</form>
</body>
</html>
