PDA

View Full Version : [CLOSED] How to disable component column editor



bayoglu
Jun 18, 2013, 11:37 PM
Hello,

I am using component column editor for grid panel. For some reason I need to disable editing of the whole grid panel conditionally. How can I ensure component columns are not editable? I need solutions for both page_load and during Ajax event in code behind. Below is a simplified form of component column I am using. Thanks for your help.



<ext:ComponentColumn ID="CompID" runat="server" Text="Component Column" DataIndex="CompID" Align="Left" Editor="true" OverOnly="true" PinEvents="expand" UnpinEvents="collapse" SilentSave="false" Pin="false">
<Component>
<ext:ComboBox ID="MyComboBox" runat="server" DisplayField="GeneralDescription" ValueField ="ID" QueryMode="Local" Editable="false" AllowBlank="true" StoreID="MyStore">
</ext:ComboBox>
</Component>
</ext:ComponentColumn>

Baidaly
Jun 19, 2013, 1:55 AM
Hello!

You should use Bind listener. Please, take a look at this thread: http://forums.ext.net/showthread.php?21284

bayoglu
Jun 19, 2013, 1:23 PM
Hello,

I went through the threat you suggested. In the bind listener when I call cmp.hide(), it also hides the value.The same problem was also reported in that threat. As an answer Daniil posted a sample code but it is about how to use more than one component in a component column. To avoid binding the component and continue showing rendered cell value, I tried returning false in Bind listener. The same solution also works with BeforeBind listener as well. Is this the right way to do it?

Thanks.



<%@ 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="Multiple Editors"
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" />
<ext:ListItem Text="Item4" />
<ext:ListItem Text="Item5" />
</Items>
</ext:ComboBox>
</Component>
<Listeners>
<BeforeBind Handler="return false;" />
</Listeners>
<Renderer Handler="return value;" />
</ext:ComponentColumn>
</Columns>
</ColumnModel>
</ext:GridPanel>
</form>
</body>
</html>

Daniil
Jun 19, 2013, 3:48 PM
Yes, you got it correctly. Returning false from a BeforeBind listener prevents a Component to be rendered. In this case a Column's Renderer is used to render a cell's value.

By the way, you can remove this. It is by default.

<Renderer Handler="return value;" />

bayoglu
Jun 19, 2013, 4:10 PM
Thank you @Daniil.
Well, the problem gets bigger as we solve (;

Even if the BeforeBind returns false, ComponentColumn's edit event is fired and the record's value related to the component column is set to null. I think there is something going wrong with it (;

This is the sample code to reproduce:



<%@ 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>
<Listeners>
<Edit Handler="alert('Edit handler fired. New value set: ' + e.record.data.Value); if(App.Store1.isDirty()){alert('store is dirty.');};"></Edit>
<BeforeBind Handler="return false;"></BeforeBind>
</Listeners>
</ext:ComponentColumn>
</Columns>
</ColumnModel>
</ext:GridPanel>
</form>
</body>
</html>

Vladimir
Jun 19, 2013, 5:52 PM
Thanks for your report, fixed in SVN

bayoglu
Jun 19, 2013, 8:16 PM
Thanks for quick response, issue solved. Please mark as closed.