Jun 19, 2013, 1:30 PM
[OPEN] [#278] Hidden column editor cause java error
Hello,
When a component column of a grid is hidden during page load, it causes javascript error @ the second item mouse over. If the column is not hidden during page load but than hidden @client side, no problem occurs. Please investigate the sample code below. Just run and move mouse over the rows.
Update: The same error applies to ext:Column editor as well. Sample code-2 attached.
Component Sample:
ext:Column sample (Click Show Comments button than double click any comment to start edit):
The problem occurs in below code line. JavaScript runtime error: Object doesn't support property or method 'getEditor'
When a component column of a grid is hidden during page load, it causes javascript error @ the second item mouse over. If the column is not hidden during page load but than hidden @client side, no problem occurs. Please investigate the sample code below. Just run and move mouse over the rows.
Update: The same error applies to ext:Column editor as well. Sample code-2 attached.
Component Sample:
<%@ 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.Data = new object[]
{
new object[] { 0, "Item1" },
new object[] { 1, "Item2" },
new object[] { 2, "Item3" },
new object[] { 3, "Item2" },
new object[] { 4, "Item4" }
};
}
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Multiple Editors - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" />
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<h1>Multiple Editors</h1>
<ext:GridPanel ID="GridPanel1"
runat="server"
Title="Hidden component column"
Width="400"
Height="180">
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="Index" Type="Int" />
<ext:ModelField Name="Value"/>
</Fields>
</ext:Model>
</Model>
<Reader>
<ext:ArrayReader />
</Reader>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:RowNumbererColumn ID="RowNumbererColumn1" runat="server" />
<ext:ComponentColumn ID="ComponentColumn1" runat="server" Flex="1" Editor="true" OverOnly="true" DataIndex="Value">
<Component>
<ext:ComboBox ID="ComboBox1" runat="server">
<Items>
<ext:ListItem Text="Item1" />
<ext:ListItem Text="Item2" />
<ext:ListItem Text="Item3" />
</Items>
</ext:ComboBox>
</Component>
<Renderer Handler="return value;" />
</ext:ComponentColumn>
<ext:ComponentColumn ID="ComponentColumn2" runat="server" Width="25" PinAllColumns="false" AutoWidthComponent="false" OverOnly="true" Hidden="true" Hideable="true">
<Component>
<ext:Button ID="Button1" runat="server" ToolTip="Edit" Icon="Pencil" AllowDepress="true" EnableToggle="false">
</ext:Button>
</Component>
</ext:ComponentColumn>
</Columns>
</ColumnModel>
</ext:GridPanel>
</form>
</body>
</html>this.fireEvent("unbind", this, this.overComponent, this.overComponent.record, this.overComponent.column.index, this.grid);ext:Column sample (Click Show Comments button than double click any comment to start edit):
<%@ 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.Data = new object[]
{
new object[] { "Bond", "Com1" },
new object[] { "James Bond", "Com2" },
new object[] { "Jr. Bond", "Com3" },
new object[] { "Bond Jr.", "Com4" },
};
}
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Multiple Editors - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" />
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<h1>Multiple Editors</h1>
<ext:GridPanel ID="GridPanel1"
runat="server"
Title="Hidden component column"
Width="600"
Height="180">
<Buttons>
<ext:Button runat="server" Text="Show Comments">
<Listeners>
<Click Handler="App.Comments.show()"></Click>
</Listeners>
</ext:Button>
</Buttons>
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="Name"/>
<ext:ModelField Name="Comments"/>
</Fields>
</ext:Model>
</Model>
<Reader>
<ext:ArrayReader />
</Reader>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:RowNumbererColumn ID="RowNumbererColumn1" runat="server" />
<ext:Column ID="Name" runat="server" Text="Name" DataIndex="Name" Flex="1" ></ext:Column>
<ext:Column ID="Comments" runat="server" Text="Comments" DataIndex="Comments" Flex="1" Hidden="true">
<Editor>
<ext:TextArea ID="CommentsEditor" runat="server" Height="200">
</ext:TextArea>
</Editor>
</ext:Column>
</Columns>
</ColumnModel>
<Plugins>
<ext:CellEditing runat="server">
</ext:CellEditing>
</Plugins>
</ext:GridPanel>
</form>
</body>
</html>The problem occurs in below code line. JavaScript runtime error: Object doesn't support property or method 'getEditor'
if (columnHeader && !columnHeader.getEditor(record)) {
return false;
}
Last edited by Baidaly; Jun 20, 2013 at 12:41 AM.
Reason: [OPEN] [#278]
