[CLOSED] CheckColumn in GridPanel

[softmachine2011]

Hi!

I have a gridpanel with three checkcolumns editables; and i want to change this property when this field is doing databound; but i'm unable to do it.

How can i change IsEditable property in client-side?
I've to do it in databinding and when the user click's the other check with a simple client-side function.

Here is my gridpanel code:

<ext:GridPanel ID="grdNivelesOrganigrama" runat="server" StripeRows="false" Height="110" Border="false"
                                        TrackMouseOver="false" EnableColumnMove="false" EnableColumnResize="false" EnableColumnHide="false">
                                        <View>
                                            <ext:GridView MarkDirty="false" HeadersDisabled="true" />
                                        </View>
                                        <Store>
                                            <ext:Store ID="dsNivelesOrganigrama" runat="server" AutoLoad="false" WarningOnDirty="false">
                                                <Proxy>
                                                    <ext:HttpProxy Url='<%# ViewData[ViewModel.ROUTE_URL_FILTRO_AGRUPACION]+"/TotalizacionesOrganigrama" %>' Method="GET" AutoDataBind="true" />
                                                </Proxy>
                                                <Reader>
                                                    <ext:JsonReader Root="data">
                                                        <Fields>
                                                            <ext:RecordField Name="Nivel" />
                                                            <ext:RecordField Name="Titulo" />
                                                            <ext:RecordField Name="Total" />
                                                            <ext:RecordField Name="Ruptura" />
                                                        </Fields>
                                                    </ext:JsonReader>
                                                </Reader> 
                                                <BaseParams>
                                                    <ext:Parameter Name="rootCI" Value="#{cmbNivelesOrganigrama}.getValue()" Mode="Raw" />
                                                    <ext:Parameter Name="FiltroCI" Value="Millenium.Controls.FiltroAgrupacion.getFiltroCI()" Mode="Raw" />
                                                    <ext:Parameter Name="TipoFiltro" Value='<%# ViewData[FiltroParams.TIPO_FILTRO] %>' Mode="Value" AutoDataBind="true" />
                                                </BaseParams>
                                                <Listeners>
                                                    <Load Fn="Millenium.Controls.FiltroAgrupacion.onReloadGridNiveles" />
                                                </Listeners>
                                            </ext:Store>
                                        </Store>
                                        <ColumnModel runat="server" DefaultSortable="false">
                                            <Columns>
                                                <ext:Column ColumnID="Nivel" DataIndex="Nivel" Width="45" />
                                                <ext:CheckColumn ColumnID="Titulo" DataIndex="Titulo" Width="40" Header="<%$ AppRecursos : sm_txt_titulo %>" Editable="true" />
                                                <ext:CheckColumn ColumnID="Total" DataIndex="Total" Width="40" Header="<%$ AppRecursos : sm_txt_total %>" Editable="true" />
                                                <ext:CheckColumn ColumnID="Ruptura" DataIndex="Ruptura" Width="55" Header="<%$ AppRecursos : sm_txt_ruptura %>" Editable="true" />
                                            </Columns>
                                        </ColumnModel>
                                        <SelectionModel>
                                            <ext:RowSelectionModel runat="server" SingleSelect="false" />
                                        </SelectionModel>

Thanks in advance

[Daniil]

How can i change IsEditable property in client-side?

Hi,

Please use

GridPanel1.getColumnModel().columns[0].editable = true/false;

[softmachine2011]

Hi Daniil.

I think that your solution makes all column editable or not editable; but I want to make an specific column editable or not for each row.
For example if I have a grid with 3 columns and 5 rows; I only want to make editable column 3 of rows 1,2,4. Rows 3 and 5 must be disabled or readonly.

Thanks

[Daniil]

Please investigate the example.

Example

<%@ 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)
        {
            Store store = this.GridPanel1.GetStore();
            store.DataSource = new object[] 
            { 
                new object[] { true },
                new object[] { false },
                new object[] { true }
            };
            store.DataBind();
        }
    }

    protected void TestDirectEventHandler(object sender, DirectEventArgs e)
    {
        X.Msg.Alert("DirectEvent", "Hello from Server!").Show();
    }
</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>Ext.Net Example</title>

    <script type="text/javascript">
        var onBeforeRender = function () {
            Ext.grid.CheckColumn.prototype.onMouseDown = Ext.grid.CheckColumn.prototype.onMouseDown.createInterceptor(interceptor);
        }
    
        var interceptor = function (e, t) {
            if (this.editable && t.className && Ext.fly(t).hasClass("x-grid3-cc-" + this.dataIndex)) {
                var rIndex = this.grid.getView().findRowIndex(t),
                    dataIndex = this.dataIndex,
                    record = this.grid.store.getAt(rIndex),
                    value = record.data[this.dataIndex];
                 
                 return rIndex === 0 || rIndex === 2;
            }
            return false;
        }
    </script>
</head>
<body>
    <form runat="server">
    <ext:ResourceManager runat="server" />
    <ext:GridPanel ID="GridPanel1" runat="server" AutoHeight="true">
        <Store>
            <ext:Store runat="server">
                <Reader>
                    <ext:ArrayReader>
                        <Fields>
                            <ext:RecordField Name="test" />
                        </Fields>
                    </ext:ArrayReader>
                </Reader>
            </ext:Store>
        </Store>
        <ColumnModel runat="server">
            <Columns>
                <ext:CheckColumn Header="Test" DataIndex="test" Editable="true" />
            </Columns>
        </ColumnModel>
        <Listeners>
            <BeforeRender Fn="onBeforeRender" />
        </Listeners>
    </ext:GridPanel>
    </form>
</body>
</html>

[softmachine2011]

Hi,

I tried your piece of code, and with some modifications it do that I want ;P

In my case I have to find columnIndex and based on the other two values, I allow to check the last checkbox or not.

I attach the code, if you see any deprected function use or I could do some optimization say me something.

if (this.editable && t.className && Ext.fly(t).hasClass("x-grid3-cc-" + this.dataIndex)) {
            var rIndex = this.grid.getView().findRowIndex(t);

            record = this.grid.store.getAt(rIndex);

            var cIndex = record.fields.keys.indexOf(this.dataIndex);
            var titulo = record.data[record.fields.items[1].name];
            var total = record.data[record.fields.items[2].name];

            if (record.fields.items[1].name == this.dataIndex)
                titulo = !titulo;

            if (record.fields.items[2].name == this.dataIndex)
                total = !total;

            if (!(titulo || total)) {
                record.data[record.fields.items[3].name] = false;
            }

            return (cIndex == 3 && (titulo || total)) || cIndex != 3;
        }
        return false;

Otherwise my query was solved.

Thanks Daniil

[Daniil]

It seems I'm not sure what logic is implemented by the code you provided, so, I can't suggest something to optimize.

In general, your code looks normal. One thing I can suggest - declare 'record' local variable, no global.

var record = this.grid.store.getAt(rIndex);

[softmachine2011]

Ok thanks again

[Daniil]

For someone who is interested in, here is the Ext.NET v2 related discussion.
http://forums.ext.net/showthread.php?21028