Apr 02, 2012, 11:31 AM
[CLOSED] DropDown as Grid editor with null values in Store (possibly a bug)
Hello
I have a grid editor which is a drop down field and the problem is whenever this field's data is null in the store, there is a javascript error generated. this error comes from automatic validation from triggerfield's blur event and from editing done of the editor.
please run the example when you select see the error in row number 6 and 7.
I have a grid editor which is a drop down field and the problem is whenever this field's data is null in the store, there is a javascript error generated. this error comes from automatic validation from triggerfield's blur event and from editing done of the editor.
please run the example when you select see the error in row number 6 and 7.
<%@ 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.BindData();
}
}
protected void MyData_Refresh(object sender, StoreRefreshDataEventArgs e)
{
this.BindData();
}
private void BindData()
{
var store = this.GridPanel1.GetStore();
store.DataSource = this.Data;
store.DataBind();
Store_DD.DataSource = this.DataDD;
Store_DD.DataBind();
}
private object[] DataDD
{
get
{
DateTime now = DateTime.Now;
return new object[]
{
new {Id=1, Text="First"},
new {Id=2, Text="Second"},
new {Id=3, Text="Third"}
};
}
}
private object[] Data
{
get
{
DateTime now = DateTime.Now;
return new object[]
{
new object[] { "3m Co", 71.72, 0.02, 0.03, now },
new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, now },
new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, now },
new object[] { "American Express Company", 52.55, 0.01, 0.02, now },
new object[] { "American International Group, Inc.", 64.13, 0.31, 0.49, now },
new object[] { null, 71.72, 0.02, 0.03, now },//js error
new object[] { null, 71.72, 0.02, 0.03, now },//js error
new object[] { "", 45.45, 0.73, 1.63, now } //Works
};
}
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Simple Array Grid With Paging and Remote Reloading - Ext.NET Examples</title>
<link href="../../../../resources/css/examples.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
var template = '<span style="color:{0};">{1}</span>';
var change = function (value) {
return String.format(template, (value > 0) ? "green" : "red", value);
};
var pctChange = function (value) {
return String.format(template, (value > 0) ? "green" : "red", value + "%");
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:Store ID="Store_DD" runat="server">
<Reader>
<ext:JsonReader IDProperty="Id">
<Fields>
<ext:RecordField Name="Id" />
<ext:RecordField Name="Text"/>
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:GridPanel
ID="GridPanel1"
runat="server"
StripeRows="true"
Title="Array Grid"
Width="600"
Height="290"
AutoExpandColumn="Company"
ClicksToEdit="1">
<Store>
<ext:Store runat="server" OnRefreshData="MyData_Refresh">
<Reader>
<ext:ArrayReader>
<Fields>
<ext:RecordField Name="company"/>
<ext:RecordField Name="price" Type="Float" />
<ext:RecordField Name="change" Type="Float" />
<ext:RecordField Name="pctChange" Type="Float" />
<ext:RecordField Name="lastChange" Type="Date" />
</Fields>
</ext:ArrayReader>
</Reader>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:RowNumbererColumn />
<ext:Column ColumnID="Company" Header="Company" Width="160" DataIndex="company" >
<Editor>
<ext:DropDownField ID="DropDownField1" runat="server" TriggerIcon="Ellipsis" Width="160"
ValidateOnEvent="false"
>
<Component>
<ext:GridPanel runat="server" StoreID="Store_DD" Height="200" ID="GridPanel11">
<ColumnModel>
<Columns>
<ext:Column Header="All" DataIndex="Text">
</ext:Column>
</Columns>
</ColumnModel>
<SelectionModel>
<ext:CheckboxSelectionModel runat="server" ID="CheckboxSelectionModel1">
</ext:CheckboxSelectionModel>
</SelectionModel>
</ext:GridPanel>
</Component>
</ext:DropDownField>
</Editor>
</ext:Column>
<ext:Column Header="Price" Width="75" DataIndex="price" Editable="true">
<Renderer Format="UsMoney" />
</ext:Column>
<ext:Column Header="Change" Width="75" DataIndex="change">
<Renderer Fn="change" />
</ext:Column>
<ext:Column Header="Change" Width="75" DataIndex="pctChange">
<Renderer Fn="pctChange" />
</ext:Column>
<ext:DateColumn Header="Last Updated" Width="85" DataIndex="lastChange" Format="H:mm:ss" />
</Columns>
</ColumnModel>
</ext:GridPanel>
</form>
</body>
</html>
Last edited by Daniil; Apr 02, 2012 at 2:48 PM.
Reason: [CLOSED]
Originally Posted by Daniil
