[CLOSED] Linked dynamic searches in grid

  1. #1

    [CLOSED] Linked dynamic searches in grid

    I have two dynamic searches in a gridpanel. I want to pass the results from the first search into the second. I have created a BaseParam with a Raw value on the second search but please assist with JS syntax to read the data from the store from that specific record and pass it to the second dynamic search. Currently, it doesnt pass it properly. I also tried record.data.testLevelOneId and that didnt work. Maybe it doesnt work since combo isnt loaded yet?
    Thanks,
    /Z

                    <ext:Column ColumnID="testLevelOneId" Header="Group1" Width="120" DataIndex="testLevelOneId">
                        <Renderer Fn="testIdOneRenderer" />
                        <Editor>
                            <ext:ComboBox ID="ParentTestOneId" 
                                runat="server" 
                                Padding="5" 
                                DisplayField="description" 
                                TypeAhead="false"
                                ValueField="id" 
                                LoadingText="Searching..."
                                EmptyText="Select an parent" 
                                PageSize="10"
                                Width="300"
                                HideLabel="true"
                                HideTrigger="true"
                                ItemSelector="div.search-item"        
                                MinChars="1" >
                                <Store>
                                    <ext:Store ID="StoreTest_Combo" runat="server" AutoLoad="false">
                                        <Proxy>
                                            <ext:HttpProxy Method="GET" Url="/ta/Search/FindTests" />
                                        </Proxy>
                                        <Reader>
                                            <ext:JsonReader Root="data" TotalProperty="total">
                                                <Fields>
                                                    <ext:RecordField Name="id" Type="Int" />
                                                    <ext:RecordField Name="description" Type="String" />
                                                </Fields>
                                            </ext:JsonReader>
                                        </Reader>
                                    </ext:Store>
                                </Store>
                                <Triggers>
                                    <ext:FieldTrigger Icon="Clear" HideTrigger="true" />
                                </Triggers>
                                <Listeners>
                                    <Select Handler="if (this.editable) { this.triggers[0].show(); } " />
                                    <BeforeQuery Handler="this.triggers[0][ this.getRawValue().toString().length == 0 ? 'hide' : 'show']();" />
                                    <TriggerClick Handler="if (index == 0) { this.clearValue(); this.triggers[0].hide(); }" />
                                </Listeners>
                                <Template ID="TemplateStoreTest" runat="server">
                                    <Html>
                         <tpl for=".">
                          <div class="search-item">
                           <h3>{id}</h3>Description: {description}
                          </div>
                         </tpl>
                        </Html>
                                </Template>
                            </ext:ComboBox>
                        </Editor>
                    </ext:Column>
                    
                    <ext:Column ColumnID="testLevelTwoId" Header="Group2" Width="120" DataIndex="testLevelTwoId">
                        <Renderer Fn="testIdTwoRenderer" />
                        <Editor>
                            <ext:ComboBox ID="ParentTestTwoId" 
                                runat="server" 
                                Padding="5" 
                                DisplayField="description" 
                                TypeAhead="false"
                                ValueField="id" 
                                LoadingText="Searching..."
                                EmptyText="Select an parent" 
                                PageSize="10"
                                Width="300"
                                HideLabel="true"
                                HideTrigger="true"
                                ItemSelector="div.search-item"        
                                MinChars="1" >
                                <Store>
                                    <ext:Store ID="StoreTestTwo_Combo" runat="server" AutoLoad="false">
                                        <Proxy>
                                            <ext:HttpProxy Method="GET" Url="/ta/Search/FindTests" />
                                        </Proxy>
                                        <BaseParams>
                                            <ext:Parameter Name="parentId" Value="#{ParentTestOneId}.getValue()" Mode="Raw" />
                                        </BaseParams>
                                        <Reader>
                                            <ext:JsonReader Root="data" TotalProperty="total">
                                                <Fields>
                                                    <ext:RecordField Name="id" Type="Int" />
                                                    <ext:RecordField Name="description" Type="String" />
                                                </Fields>
                                            </ext:JsonReader>
                                        </Reader>
                                    </ext:Store>
                                </Store>
                                <Triggers>
                                    <ext:FieldTrigger Icon="Clear" HideTrigger="true" />
                                </Triggers>
                                <Listeners>
                                    <Select Handler="if (this.editable) { this.triggers[0].show(); } " />
                                    <BeforeQuery Handler="this.triggers[0][ this.getRawValue().toString().length == 0 ? 'hide' : 'show']();" />
                                    <TriggerClick Handler="if (index == 0) { this.clearValue(); this.triggers[0].hide(); }" />
                                </Listeners>
                                <Template ID="TemplateStoreTestTwo" runat="server">
                                    <Html>
                         <tpl for=".">
                          <div class="search-item">
                           <h3>{id}</h3>Description: {description}
                          </div>
                         </tpl>
                        </Html>
                                </Template>
                            </ext:ComboBox>
                        </Editor>
                    </ext:Column>
    Last edited by Daniil; Feb 14, 2013 at 4:46 AM. Reason: [CLOSED]
  2. #2
    Hi @Z,

    The Parameter won't know that he should take a ComboBox from the same row. Moreover, there is just a single ComboBox for each row.

    So, that is not an option.

    We have an example of the functionality you need.
    https://examples1.ext.net/#/Form/Com...ombos_In_Grid/

    Here is a bit different approach. Maybe, it will be more appropriate for you.

    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[] { "1" },
                    new object[] { "2" },
                };
                store.DataBind();
            }
        }
        
        protected void Store_RefreshData(object sender, StoreRefreshDataEventArgs e)
        {
            string id = e.Parameters["id"];
            Store store = sender as Store;
    
            store.DataSource = new object[] 
            {
                new 
                {
                    text = id + "_1"    
                },
                new 
                {
                    text = id + "_2"    
                }  
            };   
        }
    </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>
    </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="test1" />
                                    <ext:RecordField Name="test2" />
                                    <ext:RecordField Name="test3" />
                                </Fields>
                            </ext:ArrayReader>
                        </Reader>
                    </ext:Store>
                </Store>
                <ColumnModel runat="server">
                    <Columns>
                        <ext:Column Header="Test1" DataIndex="test1">
                            <Editor>
                                <ext:ComboBox ID="ComboBox1" runat="server">
                                    <Items>
                                        <ext:ListItem Text="1" />
                                        <ext:ListItem Text="2" />
                                    </Items>
                                </ext:ComboBox>
                            </Editor>
                        </ext:Column>
                        <ext:Column Header="Test2" DataIndex="test2">
                            <Editor>
                                <ext:ComboBox runat="server" DisplayField="text" ValueField="text">
                                    <Store>
                                        <ext:Store runat="server" OnRefreshData="Store_RefreshData" AutoLoad="false">
                                            <Proxy>
                                                <ext:PageProxy />
                                            </Proxy>
                                            <Reader>
                                                <ext:JsonReader>
                                                    <Fields>
                                                        <ext:RecordField Name="text" />
                                                    </Fields>
                                                </ext:JsonReader>
                                            </Reader>
                                        </ext:Store>
                                    </Store>
                                </ext:ComboBox>
                            </Editor>
                            <EditorOptions>
                                <Listeners>
                                    <BeforeStartEdit Handler="editor.field.getStore().setBaseParam('id', editor.record.get('test1'));
                                                              delete editor.field.lastQuery;" />
                                </Listeners>
                            </EditorOptions>
                        </ext:Column>
                    </Columns>
                </ColumnModel>
            </ext:GridPanel>
        </form>
    </body>
    </html>
  3. #3
    Thanks!

    I used a hybrid of both. I used the editor.row to get the row and then pulled the record out of the Grid with the getAt(X) command. The delete lastQuery command was a neat trick.

    /Z
  4. #4
    Quote Originally Posted by Z View Post
    The delete lastQuery command was a neat trick.
    This trick is even documented:)
    http://docs.sencha.com/ext-js/3-4/#!...erty-lastQuery

Similar Threads

  1. [CLOSED] linked comboboxes dynamic url problem
    By zwf in forum 2.x Legacy Premium Help
    Replies: 9
    Last Post: Dec 13, 2012, 3:00 PM
  2. [CLOSED] Dynamic binding of linked combos using javascript
    By Vasudhaika in forum 1.x Legacy Premium Help
    Replies: 6
    Last Post: Oct 29, 2012, 7:09 AM
  3. Replies: 0
    Last Post: Apr 01, 2010, 6:51 AM
  4. The example Linked combos in grid.
    By FreddeM in forum Examples and Extras
    Replies: 1
    Last Post: Jan 04, 2010, 2:41 PM
  5. Linked Combos in Grid Version 0.7
    By eguerrap in forum 1.x Help
    Replies: 0
    Last Post: Jan 27, 2009, 3:19 PM

Posting Permissions