[CLOSED] How to get Cell ID or Row Index in Grid Panel with ComponentColumn

  1. #1

    [CLOSED] How to get Cell ID or Row Index in Grid Panel with ComponentColumn

    Hi,

    We need to retrieve the cell id or the row index in GridPanel with Component Column. We tried with "CellSelectionModel" and "RowSelectionModel" but without success.
    As you can see in the sample below, We are focusing on the second column (dataIndex= Acc_Code). When selecting a value from the combobox we want to update the next column (Acc_Name) with the retrieved value from server in the same row.
    Thanks in advance.

    <ext:GridPanel ID="GridPanelJournalVoucher" runat="server" Title="Receipt Journal Voucher"
                    ButtonAlign="Center" Region="Center" Frame="true" Header="false" ForceFit="true">
                    <Store>
                        <ext:Store ID="StoreReceiptJournalVoucher" runat="server">
                            <Model>
                                <ext:Model ID="ModelJrnRcpVoucher" Name="ModelJrnRcpVoucher" IDProperty="ReceiptJournalVoucher_ID" runat="server">
                                    <Fields>
                                        <ext:ModelField Name="ReceiptJournalVoucher_ID" Type="Int" />
                                        <ext:ModelField Name="Acc_Code" />
                                        <ext:ModelField Name="Acc_Name" />
                                        <ext:ModelField Name="Acc_Desc" />
                                        <ext:ModelField Name="Acc_Credit" />
                                        <ext:ModelField Name="Acc_Debit" />
                                        <ext:ModelField Name="Cheque_No" />
                                        <ext:ModelField Name="Due_Date" Type="Date" />
                                        <ext:ModelField Name="Bank_Name" />
                                        <ext:ModelField Name="Cheque" />
                                        <ext:ModelField Name="Voucher_Type" />
                                    </Fields>                                
                                </ext:Model>
                            </Model>
                        </ext:Store>
                    </Store>               
                    <ColumnModel>                    
                        <Columns>
                            <ext:RowNumbererColumn runat="server">
                            </ext:RowNumbererColumn>
                            <ext:ComponentColumn Text="Code" DataIndex="Acc_Code" ID="Acc_Code" runat="server" >
                                <Component>
                                    <ext:ComboBox ID="cbxAccountCode" runat="server" DisplayField="Acc_ID" ValueField="Acc_ID"
                                        StoreID="Store_AccountsCode" TypeAhead="false" LoadingText="Searching..." Width="140"
                                        PageSize="10" HideTrigger="true" ItemSelector="div.search-item" MinChars="1">
                                        <ListConfig LoadingText="Searching...">
                                                <ItemTpl ID="ItemTpl2" runat="server">
                                                    <Html>
                                                        <div class="search-item">
                                                            <div class="code">{Acc_ID} </div>  
                                                            <div class="name">{Acc_Name_En}</div>
                                                        </div>
                                                    </Html>
                                                </ItemTpl>
                                            </ListConfig>
                                            <Listeners>                                            
                                                <Select Fn="setAccName" />
                                            </Listeners>                                    
                                    </ext:ComboBox>
                                </Component>                            
                            </ext:ComponentColumn>
                            <ext:ComponentColumn Text="Name" DataIndex="Acc_Name" ID="Acc_Name" runat="server"
                                Width="170" >
                                <Component>
                                    <ext:TextField ID="txfAccount_Name" DataIndex="Acc_Name" runat="server" />
                                </Component>
                            </ext:ComponentColumn>
                            <ext:ComponentColumn Text="Desc" DataIndex="Acc_Desc" ID="Acc_Desc" Width="185" runat="server" >
                                <Component>
                                    <ext:TextField ID="txfAccount_Desc" runat="server" />
                                </Component>
                            </ext:ComponentColumn>
                            <ext:ComponentColumn Text="Credit" DataIndex="Acc_Credit" ID="Acc_Credit" Width="70"
                                runat="server" >
                                <Component>
                                    <ext:NumberField ID="txfAccount_Credit" runat="server" Text="">
                                        <Listeners>
                                            <%--<Blur Fn="chckcb" />--%>
                                        </Listeners>
                                    </ext:NumberField>
                                </Component>
                            </ext:ComponentColumn>
                            <ext:ComponentColumn Text="Debit" DataIndex="Acc_Debit" ID="Acc_Debit" Width="70"
                                runat="server" >
                                <Component>
                                    <ext:NumberField ID="txfAccount_Debit" runat="server" Text="">
                                        <Listeners>
                                            <%--<Blur Fn="chckdb" />--%>
                                        </Listeners>
                                    </ext:NumberField>
                                </Component>
                            </ext:ComponentColumn>
                            <ext:ComponentColumn ID="Cheque_No" DataIndex="Cheque_No" Header="Cheque #" Editable="true"
                                Width="130" runat="server" >
                                <Component>
                                    <ext:TextField ID="txfChequeNo" runat="server" Name="Cheque_No" FieldLabel="" Width="150">
                                    </ext:TextField>
                                </Component>
                            </ext:ComponentColumn>
                            <ext:ComponentColumn ID="Due_Date" DataIndex="Due_Date" Editable="true" Width="90"
                                Text="Date" runat="server" >
                                <Component>
                                    <ext:DateField ID="DateField1" runat="server">
                                    </ext:DateField>
                                </Component>
                            </ext:ComponentColumn>
                            <ext:ComponentColumn ID="Bank_Name" DataIndex="Bank_Name" Text="Bank Name" Width="130"
                                runat="server" >
                                <Component>
                                    <ext:TextField ID="txfBank_Name2" runat="server" Name="Bank_Name" FieldLabel="" />
                                </Component>
                            </ext:ComponentColumn>
                        </Columns>
                    </ColumnModel>
                    <View>
                        <ext:GridView ID="GridView1" runat="server">
                        </ext:GridView>
                    </View>
                    <SelectionModel>                    
                        <ext:CellSelectionModel runat="server" ID="cellseltionmode">
                            <Listeners>
                                <Select Fn="Cell_Click" />                        
                            </Listeners>
                        </ext:CellSelectionModel>
                        <%--<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true">
                        </ext:RowSelectionModel>--%>
                    </SelectionModel>                
                </ext:GridPanel>
    Last edited by Daniil; Aug 16, 2012 at 5:19 PM. Reason: [CLOSED]
  2. #2
    Hi,

    Each components contains the "record" property and the "column" property which, respectively, contains the "grid", "column", "rowIndex" and "record" properties.
    cmp.column = {
        grid      : this.grid,
        column : this,
        rowIndex : index,
        record: record
    };
    You can use:
    <Select Handler="this.record.set('dataIndexOfNextColumn', 'Hello!');" />
    Please note that a ComboBox will lose the focus after updating, because a row will be refreshed/rerendered.
    Last edited by Daniil; Aug 13, 2012 at 1:56 PM.
  3. #3
    Thanks Daniil, but still almost same issue. It's ok for record value, it is updating well the record but the component is not showing the value, the component value is empty but show the updates red mark.
  4. #4
    It appears to be working well in the example below. Please provide your test case.

    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[] { "test1" },
                    new object[] { "test2" },
                    new object[] { "test3" }
                };
                store.DataBind();
            }
        }
    </script>
    
    <!DOCTYPE html>
    
    <html>
    <head runat="server">
        <title>Ext.NET v2 Example</title>
    </head>
    <body>
        <ext:ResourceManager runat="server" />
        <ext:GridPanel ID="GridPanel1" runat="server" AutoHeight="true">
            <Store>
                <ext:Store runat="server">
                    <Model>
                        <ext:Model runat="server">
                            <Fields>
                                <ext:ModelField Name="test" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:Store>
            </Store>
            <ColumnModel runat="server">
                <Columns>
                    <ext:ComponentColumn runat="server">
                        <Component>
                            <ext:ComboBox runat="server">
                                <Items>
                                    <ext:ListItem Text="Item 1" />
                                    <ext:ListItem Text="Item 2" />
                                </Items>
                                <Listeners>
                                    <Select Handler="this.record.set('test', records[0].data[this.displayField]);" />
                                </Listeners>
                            </ext:ComboBox>
                        </Component>
                    </ext:ComponentColumn>
                    <ext:Column runat="server" Text="Test" DataIndex="test" />
                </Columns>
            </ColumnModel>
        </ext:GridPanel>
    </body>
    </html>

Similar Threads

  1. Grid Panel - Cell Value selection & Copy option
    By jigpatel06 in forum 1.x Help
    Replies: 3
    Last Post: May 23, 2012, 3:15 PM
  2. Replies: 0
    Last Post: May 12, 2012, 11:24 AM
  3. Replies: 1
    Last Post: Oct 19, 2011, 7:14 AM
  4. [CLOSED] How to refresh cell in grid panel..
    By Satyanarayana murthy in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: May 17, 2010, 7:21 AM
  5. cell value of grid Panel
    By vinu.gupta03 in forum 1.x Help
    Replies: 1
    Last Post: Mar 04, 2009, 1:13 AM

Tags for this Thread

Posting Permissions