[CLOSED] selectbox in component column

  1. #1

    [CLOSED] selectbox in component column

    I want to select a value in a selectBox inside a gridpanel component column.

    I try this on the store listeners:

    <Load Handler="#{cbMagazzino}.setValue(record.data.MagazzinoDefault);" ></Load>
    but parser can't resolve the combobox name #{cbMagazzino}.

    How can I fix it?
    Thanks in advance
    Marco
    Last edited by Daniil; Feb 21, 2013 at 3:51 AM. Reason: [CLOSED]
  2. #2
    Hi Marco,

    I am not exactly sure how all is configured on your side. Could you provide a test case, please?
  3. #3
    I almost built a working example but I coud not find a way to create a selectbox with a store.
    The problem is that the selectbox is in a componentcolumn and I cannot address it.

    In my real page the store uses an AjaxProxy.


    Anyway if you look at the Load event of the SelectBox store you will face my problem: #{SelectBox1} is not resolved.


    <%@ Page Language="C#"  %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <script runat="server">
    
    
             public static List<object> myList;
        
            protected void Page_Load(object sender, EventArgs e)
            {
    
                if (!X.IsAjaxRequest)
                {
                    myList = new List<object>();
    
                    for (int i = 1; i < 10; i++)
                    {
                        myList.Add(new object[] { i,false, i,i, "Text " +  i, DateTime.Now.Date });
                    }
    
                    this.Store1.DataSource = myList;
    
                    this.Store1.DataBind();
                }
            }
    
            protected void btnAddService_Click(object sender, DirectEventArgs e)
            {
                this.Store1.CommitChanges();
    
                myList.Add(new object[] { 11,false, 11,11, "Text 11", DateTime.Now.Date });
    
                this.Store1.DataSource = myList;
    
                this.Store1.DataBind();
            }
    
    
    </script>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html>
    <head runat="server">
        <title>ComponentColumn Editor - Ext.NET Examples</title>
        <link href="/resources/css/examples.css" rel="stylesheet" />    
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
            
            <h1>ComponentColumn as Editor</h1>
    
            <ext:GridPanel 
                runat="server" 
                Title="ComponentColumn Editor" 
                Width="600" 
                Height="300">
                <Store>
                    <ext:Store ID="Store1" runat="server">
                        <Model>
                            <ext:Model runat="server">
                                <Fields>
                                    <ext:ModelField Name="IntField" Type="Int" />
                                    <ext:ModelField Name="BooleanField" Type="Boolean" />
                                    <ext:ModelField Name="ComboField" Type="Int" />
                                    <ext:ModelField Name="ComboField2" Type="Int" />
                                    <ext:ModelField Name="TextField" Type="String" />
                                    <ext:ModelField Name="DateField" Type="Date" />
                                    <ext:ModelField Name="SelectField2" Type="String" />
                                </Fields>
                            </ext:Model>
                        </Model>
                    </ext:Store>
                </Store>
                <ColumnModel runat="server">
                    <Columns>
                        <ext:ComponentColumn 
                            runat="server" 
                            Editor="true"
                            DataIndex="ComboField2"
                            Flex="1"
                            Text="ComboBox2">
                            <Component>
                                <ext:ComboBox runat="server">
                                    <Items>
                                        <ext:ListItem Text="Item 1" Value="1" Mode="Raw" />
                                        <ext:ListItem Text="Item 2" Value="2" Mode="Raw" />
                                        <ext:ListItem Text="Item 3" Value="3" Mode="Raw" />
                                        <ext:ListItem Text="Item 4" Value="4" Mode="Raw" />
                                        <ext:ListItem Text="Item 5" Value="5" Mode="Raw" />
                                        <ext:ListItem Text="Item 6" Value="6" Mode="Raw" />
                                        <ext:ListItem Text="Item 7" Value="7" Mode="Raw" />
                                        <ext:ListItem Text="Item 8" Value="8" Mode="Raw" />
                                        <ext:ListItem Text="Item 9" Value="9" Mode="Raw" />
                                    </Items>
                                </ext:ComboBox>
                            </Component>
                        </ext:ComponentColumn>
    
    
                        <ext:ComponentColumn 
                            runat="server" 
                            Editor="true"
                            DataIndex="IntField"
                            Flex="1"
                            Text="Integer">
                            <Component>
                                <ext:NumberField runat="server" />
                            </Component>
                        </ext:ComponentColumn>
    
                        <ext:ComponentColumn 
                            runat="server" 
                            Editor="true"
                            DataIndex="BooleanField"
                            Text="Boolean"
                            >
                            <Component>
                                <ext:Checkbox runat="server"  />
                            </Component>
                            <Listeners>                            
                                <Edit Handler="item.grid.getView().refreshNode(e.rowIdx);" Delay="100" />
                            </Listeners>
                        </ext:ComponentColumn>         
    
                        <ext:ComponentColumn 
                            runat="server" 
                            Editor="true"
                            DataIndex="ComboField"
                            Flex="1"
                            Text="ComboBox">
                            <Component>
                                <ext:ComboBox runat="server">
                                    <Items>
                                        <ext:ListItem Text="Item 1" Value="1" Mode="Raw" />
                                        <ext:ListItem Text="Item 2" Value="2" Mode="Raw" />
                                        <ext:ListItem Text="Item 3" Value="3" Mode="Raw" />
                                        <ext:ListItem Text="Item 4" Value="4" Mode="Raw" />
                                        <ext:ListItem Text="Item 5" Value="5" Mode="Raw" />
                                        <ext:ListItem Text="Item 6" Value="6" Mode="Raw" />
                                        <ext:ListItem Text="Item 7" Value="7" Mode="Raw" />
                                        <ext:ListItem Text="Item 8" Value="8" Mode="Raw" />
                                        <ext:ListItem Text="Item 9" Value="9" Mode="Raw" />
                                    </Items>
                                </ext:ComboBox>
                            </Component>
                            <Listeners>
                                <Bind Handler="cmp.setDisabled(!record.data.BooleanField);" />
                            </Listeners>
                        </ext:ComponentColumn>
    
                        <ext:ComponentColumn 
                            runat="server" 
                            Editor="true"
                            DataIndex="TextField"
                            Flex="1"
                            Text="Text">
                            <Component>
                                <ext:TextField runat="server" />
                            </Component>
                        </ext:ComponentColumn>
    
                        <ext:ComponentColumn 
                            runat="server" 
                            Editor="true"
                            DataIndex="DateField"
                            Flex="1"
                            Text="Date">
                            <Component>
                                <ext:DateField runat="server" />
                            </Component>
                        </ext:ComponentColumn>
    
                        <ext:ComponentColumn runat="server" Editor="true" DataIndex="SelectField2" 
                            Text="SelectBox">
                            <Component>
                                <ext:SelectBox ID="SelectBox1" runat="server" DisplayField="state" ValueField="abbr"
                                    EmptyText="Select a state...">
                                    <Store>
                                        <ext:Store runat="server">
                                            <Model>
                                                <ext:Model runat="server">
                                                    <Fields>
                                                        <ext:ModelField Name="abbr" />
                                                        <ext:ModelField Name="state" />
                                                        <ext:ModelField Name="nick" />
                                                    </Fields>
                                                </ext:Model>
                                            </Model>
                                            <Listeners>
                                                <Load Handler="#{SelectBox1}.setValue(record.data.TextField);" ></Load>
                                            </Listeners>
                                        </ext:Store>
                                    </Store>
                                </ext:SelectBox>
                            </Component>
                        </ext:ComponentColumn>
    
    
                    </Columns>
                </ColumnModel>          
            <Buttons><ext:Button 
                runat="server" 
                Text="Aggiungi intervento" 
                Icon="Add" 
                OnDirectClick="btnAddService_Click"      
                >
                <DirectEvents>
                <Click>
                 <EventMask Msg="please, wait..." ShowMask="true" UseMsg="true"></EventMask>
                 </Click>
                </DirectEvents>
                </ext:Button>
            </Buttons>
            </ext:GridPanel>  
        </form>
    </body>
    </html>
  4. #4
    Setting up ID for the ComponentColumn's Component doesn't make sense, because a new SelectBox instance is created for each row.

    And its ids are unique.

    I would handle the ComponentColumn's Bind listener.
    <Bind Handler="cmp.getStore().on('load', function () { console.log('load'); });" />
  5. #5
    Thanki you Daniil,
    but I am still missing something.

    You mean I should replace "console.log('load'); " with my function?

    Do you mean:

    
    <Bind Handler="cmp.getStore().on('load', function () { this.setValue(record.data.MagazzinoDefault);"  });" />
  6. #6
    Yes, please try:
    <Bind Handler="cmp.getStore().on('load', function () { cmp.setValue(record.data.MagazzinoDefault);"  });" />
  7. #7
    Hi Daniil,
    I tried and got this error: "store.loading" is null or is not an object

    Click image for larger version. 

Name:	error.png 
Views:	107 
Size:	17.5 KB 
ID:	5641
  8. #8
    Please provide a sample to reproduce.

Similar Threads

  1. [CLOSED] Component Column layout Issues
    By RCM in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Nov 28, 2012, 2:58 PM
  2. [RAZOR] Component Column - [JS] me.el is null
    By carlosveber in forum 2.x Help
    Replies: 0
    Last Post: Nov 12, 2012, 5:59 PM
  3. Replies: 1
    Last Post: Sep 09, 2012, 5:12 PM
  4. [CLOSED] MVC Grid Component Column
    By adelaney in forum 2.x Legacy Premium Help
    Replies: 4
    Last Post: May 11, 2012, 8:00 PM
  5. Replies: 4
    Last Post: Oct 24, 2011, 3:34 AM

Posting Permissions