[CLOSED] ComboBox shows ValueField instead of DisplayField in a Grid.

  1. #1

    [CLOSED] ComboBox shows ValueField instead of DisplayField in a Grid.

    Hi,

    I have a GridPanel with a comboBox to show the cultures. My problem is that when the Grid is loaded it shows the
    ValueField value instead of DisplayField, but when I edit the column it shows the Display field correctly.

    Could you please tell me what I am doing wrong?

     
       protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
                createLanguagesDataSource();
            }
            
        }
     
        protected void createLanguagesDataSource()
        {
            this.StoreLanguages.DataSource = new object[]
                {
                    new object[] { ResourceManager.GetIconClassName(Icon.FlagUs), "English", "en-US"},
                    new object[] { ResourceManager.GetIconClassName(Icon.FlagUs), "Espa˝ol", "es-ES"}
                };
            this.StoreLanguages.DataBind();
            ResourceManager1.RegisterIcon(Icon.FlagUs);
            ResourceManager1.RegisterIcon(Icon.FlagEs);
        }        
     
        <ext:Store ID="StoreLanguages" runat="server">
                <Reader>
                    <ext:ArrayReader>
                        <Fields>
                            <ext:RecordField Name="iconCls" />
                            <ext:RecordField Name="name" />
                            <ext:RecordField Name="culture" />
                        </Fields>
                    </ext:ArrayReader>
                </Reader>            
         </ext:Store>   
     
      <ext:Panel ID="PanelHotTopics" runat="server" Height="600px" Title="Hot Topics"
                Cls="panelTabGroupContainer" Border="false">
        <Content>
            <ext:GridPanel ID="GridPanelHotTopics" runat="server" Height="430px" Width="666px" Title="Hot Topics" 
                           StoreID="StoreHotTopics" Cls="formGroupListing" BodyCssClass="formContentGroupListing"
                           Border="false"
                           >
                <TopBar>
                  <ext:Toolbar ID="ToolbarGridPanelHotTopics" runat="server"
                    >
                    <Items>
                        <ext:ToolbarFill ID="ToolbarFill1" runat="server" MaxWidth="20px"  />
                        <ext:Button ID="Button1" runat="server"  
                                    Text="<%$ Resources:Resource, btnSave %>"
                                    Icon="Disk" Cls="btnMenuGroupListing">
                            <Listeners>
                                <Click Handler="#{GridPanelHotTopics}.save();" />
                            </Listeners>
                        </ext:Button>
                        <ext:Button ID="Button2" runat="server"  Text="<%$ Resources:Resource, btnDelete %>"
                                    Icon="Delete">
                            <Listeners>
                                <Click Handler="#{GridPanelHotTopics}.deleteSelected();" />
                            </Listeners>
                        </ext:Button>
                        <ext:Button ID="Button3" runat="server"  Text="<%$ Resources:Resource, btnInsert %>" Icon="Add">
                            <Listeners>
                                <Click CausesValidation="true" Handler="#{GridPanelHotTopics}.insertRecord(0, {});#{GridPanelHotTopics}.getView().focusRow(0);#{GridPanelHotTopics}.startEditing(0, 1);" />
                            </Listeners>
                        </ext:Button>
                        <ext:Button ID="Button4" runat="server"  Text="<%$ Resources:Resource, btnRefresh %>" 
                                    Icon="ArrowRefresh">
                            <Listeners>
                                <Click Handler="#{GridPanelHotTopics}.reload();" />
                            </Listeners>
                        </ext:Button>
                            </Items>
                        </ext:Toolbar>
                </TopBar>
            
                <ColumnModel>
                    <Columns>
                        <ext:Column ColumnID="ColumnID" DataIndex="ID" Hidden="true"/>
                        
                        <ext:Column ColumnID="DESCRIPTIONcolumn" 
                                    Header="<%$ Resources: GridPanelHotTopics.DESCRIPTIONcolumn %>"
                                    DataIndex="DESCRIPTION" Width="420px">
                            <Editor>
                                <ext:TextField ID="TextFieldDESCRIPTION" runat="server">
                                </ext:TextField>
                            </Editor>
                        </ext:Column>
                        <ext:Column ColumnID="CULTUREcolumn" 
                                    Header="<%$ Resources: GridPanelHotTopics.CULTUREcolumn %>" 
                                    DataIndex="CULTURE" Width="70px">
                            <Editor>
                               <ext:ComboBox ID="ComboBoxCULTUREcolumn" runat="server" 
                                            AllowBlank="false"
                                            TypeAhead="true" 
                                            Mode="Local" 
                                            ForceSelection="true"
                                            SelectOnFocus="true" 
                                            StoreID="StoreLanguages" 
                                            DisplayField="name" 
                                            ValueField="culture"
                                            TriggerAction="All"
                                            >
                                    <Template ID="Template1" runat="server">
                                            <Html>
                                                <tpl for=".">
                                                    <div class="x-combo-list-item icon-combo-item {iconCls}">
                                                        {name}
                                                    </div>
                                                </tpl>
                                            </Html>
                                     </Template>  
                                     <Listeners>
                                          <Select Handler="this.setIconCls(record.get('iconCls'));" />
                                     </Listeners>                                                                  
                              </ext:ComboBox>
                            </Editor>
                        </ext:Column>
                    </Columns>
                </ColumnModel>
            </ext:GridPanel>
            <div class="groupBackBottom"/>
            <div class="paginationToolBarGroupListing">
                      <ext:PagingToolBar ID="PagingToolBar1" 
                            runat="server" 
                            StoreID="StoreGridGroupListing" 
                            PageSize="10" 
                            DisplayInfo="false" 
                           />
            </div>                            
          
        </Content>
    </ext:Panel>
    Last edited by geoffrey.mcgill; Aug 05, 2010 at 8:29 PM.
  2. #2
    Hello, flormariafr!

    I have a GridPanel with a comboBox to show the cultures. My problem is that when the Grid is loaded it shows the
    ValueField value instead of DisplayField, but when I edit the column it shows the Display field correctly.

    Could you please tell me what I am doing wrong?
    The ComboBox in the Editor section is used only to edit the column, not to show.
    When the GridPanel is loaded it shows the value from its store (not ComboBox store) with name specified in DataIndex property.
    DataIndex="CULTURE"
    So, you need to change a value of DataIndex property or use a Renderer section for showing values in a column.
  3. #3
    Hi,

    Please see the following sample
    http://examples1.ext.net/#/GridPanel...Field_Mapping/
    Vladimir Shcheglov
    Sr. Developer
  4. #4

    How to resize a panel depending of radio button BoxLabels length?

    Hi,

    I am using a panel that contents radio buttons and I am filling the BoxLabels dinamicatly by code when the page is loaded.

    Somo label can be larger than others. My question is if it is posible to resize the panel depending of the BoxLabel lenght.


  5. #5
    Hi,

    Please create new topic, this topic is started with another issue
    Vladimir Shcheglov
    Sr. Developer
  6. #6
    Hi Vladimir,


    I aplogize. it was mistake.

    I will create a new topic for the last post.

    Thanks for the example.

Similar Threads

  1. [CLOSED] ComboBox DisplayField with HTML?
    By peter.campbell in forum 1.x Premium Help
    Replies: 2
    Last Post: Sep 24, 2012, 9:31 PM
  2. Get value of DisplayField of Combobox
    By littletran in forum 1.x Help
    Replies: 0
    Last Post: May 17, 2012, 8:32 AM
  3. Combobox DisplayField 2 fields???
    By 78fede78 in forum 1.x Help
    Replies: 3
    Last Post: Sep 06, 2010, 3:07 PM
  4. Replies: 2
    Last Post: Jul 28, 2010, 7:50 AM
  5. DisplayField of the ComboBox
    By Maia in forum 1.x Help
    Replies: 2
    Last Post: Jun 04, 2009, 11:46 AM

Posting Permissions