PDA

View Full Version : [CLOSED] How to make the Editable cell Empty if the cell contain a Zero '0' value when editing??



Fahd
Jul 09, 2012, 9:10 PM
<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
public class Company
{
public int ID { get; set; }
public string Name { get; set; }
public double Order { get; set; }
public double Amount { get; set; }
}

protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.BindData();
}
}

private void BindData()
{
this.GridPanel1.Store.Primary.DataSource = this.GetData();
this.GridPanel1.Store.Primary.DataBind();
}

private List<Company> GetData()
{
return new List<Company>
{
new Company { ID = 1, Name = "3m Co", Order = 0, Amount = 2 },
new Company { ID = 2, Name = "Alcoa Inc", Order = 0, Amount = 0 },
new Company { ID = 3, Name = "Altria Group Inc", Order = 0, Amount = 0},
new Company { ID = 4, Name = "American Express Company", Order = 0, Amount = 0},
new Company { ID = 5, Name = "American International Group, Inc.", Order = 0, Amount = 0},
new Company { ID = 6, Name = "Wal-Mart Stores, Inc.", Order = 0, Amount = 0 }
};
}

</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Simple Array Grid - Ext.NET Examples</title>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<br />
<ext:GridPanel ID="GridPanel1" runat="server" Title="Editable GridPanel" Width="350"
Height="200">
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="ID">
<Fields>
<ext:ModelField Name="ID" Type="Int" />
<ext:ModelField Name="Name" />
<ext:ModelField Name="Order" Type="Int" />
<ext:ModelField Name="Amount" Type="Int" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column ID="Column1" runat="server" Text="ID" DataIndex="ID" Width="35" />
<ext:Column ID="Column3" runat="server" Text="Order" DataIndex="Order">
<Editor>
<ext:NumberField ID="NumberField1" HideTrigger="true" runat="server" />
</Editor>
</ext:Column>
<ext:Column ID="Column4" runat="server" Text="Amount" DataIndex="Amount">
<Editor>
<ext:NumberField ID="NumberField2" HideTrigger="true" runat="server" />
</Editor>
</ext:Column>
</Columns>
</ColumnModel>
<Plugins>
<ext:CellEditing ID="CellEditing1" runat="server" ClicksToEdit="1" />
</Plugins>
<View>
<ext:GridView ID="GridView1" runat="server" />
</View>
<SelectionModel>
<ext:CellSelectionModel ID="CellSelectionModel1" runat="server" />
</SelectionModel>
</ext:GridPanel>
</form>
</body>
</html>

Daniil
Jul 10, 2012, 11:06 AM
Hi,

I would set up the Renderer for the Columns.

Example

<Renderer Handler="if (value === 0) {
value = '';
}

return value;" />

Fahd
Jul 10, 2012, 12:54 PM
This is the opposite of what i wanted, when I add this, its display 'Empty' when the Grid first shows and when I click in the cell it show ZERO.

I wanted where is shows ZERO and when the user clicks the cell to Edit, its 'Empty'


Hi,

I would set up the Renderer for the Columns.

Example

<Renderer Handler="if (value === 0) {
value = '';
}

return value;" />

Daniil
Jul 10, 2012, 2:33 PM
Got it, thanks for the details.

Please try this:

Example

<ext:Column unat="server" Text="Order" DataIndex="Order">
<Editor>
<ext:NumberField HideTrigger="true" runat="server" />
</Editor>
<EditorOptions>
<Listeners>
<StartEdit Handler="this.field.clear();" Delay="1" />
</Listeners>
</EditorOptions>
</ext:Column>

Fahd
Jul 10, 2012, 5:35 PM
This works great, thanks !!!

.
Got it, thanks for the details.

Please try this:

Example

<ext:Column unat="server" Text="Order" DataIndex="Order">
<Editor>
<ext:NumberField HideTrigger="true" runat="server" />
</Editor>
<EditorOptions>
<Listeners>
<StartEdit Handler="this.field.clear();" Delay="1" />
</Listeners>
</EditorOptions>
</ext:Column>