RowEditing + Combobox

  1. #1

    RowEditing + Combobox

    Hi! When I try to make work a combobox inside a editor using RowEditing plugin, when I update the record it is storing the combobox ValueField, not the Display field. This is the code of the GridPanel:

        <ext:GridPanel 
                        ID="grdTools" 
                        runat="server"
                        AnchorHorizontal="100%"
                        Height="125"
                        Frame="true"
                        Header="false"
                        Scroll="Vertical"
                        >
                        <Store>
                            <ext:Store ID="stToolsEdit" runat="server">
                                <Sorters>
                                    <ext:DataSorter Property="start" Direction="ASC" />
                                </Sorters>
                                <Model>
                                    <ext:Model ID="Model2" runat="server" Name="ToolModel">
                                        <Fields>
                                            <ext:ModelField Name="Name" Type="String" />
                                            <ext:ModelField Name="FromInterval" Type="String" />
                                            <ext:ModelField Name="ToInterval" Type="String" />
                                            <ext:ModelField Name="Total" Type="String" />
                                            <ext:ModelField Name="ID" Type="String" />
                                        </Fields>
                                    </ext:Model>
                                </Model>
                            </ext:Store>
                        </Store>
                        <Plugins>
                            <ext:RowEditing ID="editingPlugin" runat="server" ClicksToMoveEditor="1" AutoCancel="false" > 
                            </ext:RowEditing>
                        </Plugins>            
                        <TopBar>
                            <ext:Toolbar ID="Toolbar1" runat="server">
                                <Items>
                                    <ext:Button ID="Button3" runat="server" Text="Add Tool" Icon="Add">
                                        <Listeners>
                                            <Click Fn="function(){
                                                    var grid = #{grdTools};
                                                    grid.editingPlugin.cancelEdit();
    
                                                    var r = Ext.ModelManager.create({
                                                        Name:'',
                                                        FromInterval:'',
                                                        ToInterval:'',
                                                        Total:'',
                                                        ID:''
                                                    }, 'ToolModel');
                
                                                    grid.store.insert(0, r);
                                                    grid.editingPlugin.startEdit(0, 0);
                                                }" />
                                        </Listeners>
                                    </ext:Button>
                                    <ext:Button ID="btnRemoveTool" runat="server" Text="Remove Tool" Icon="Delete" Disabled="true">
                                        <Listeners>
                                            <Click Fn="function(){
                                                    var grid = #{grdTools};
                                                    var sm = grid.getSelectionModel();
    
                                                    grid.editingPlugin.cancelEdit();
                                                    grid.store.remove(sm.getSelection());
                                                    if (grid.store.getCount() > 0) { sm.select(0); }}" />
                                        </Listeners>
                                    </ext:Button>
                                </Items>
                            </ext:Toolbar>
                        </TopBar>            
                        <ColumnModel>
                            <Columns>
                                <ext:RowNumbererColumn ID="RowNumbererColumn1" runat="server" Width="25" />
                                <ext:Column ID="Column1" runat="server"                         
                                    Text="Name" 
                                    DataIndex="Name" 
                                    Flex="1">
                                    <Editor>
                                    <ext:ComboBox ID="cbTools" runat="server" AnchorHorizontal="100%" 
                                        DisplayField="Name"
                                        ValueField="ID"
                                        TypeAhead="true"
                                        Editable="true"
                                        QueryMode="Local"
                                        HideTrigger="true"
                                        >
                                        <Store>
                                            <ext:Store ID="stTools" runat="server">
                                                <Model>
                                                    <ext:Model ID="Model1" runat="server" IDProperty="ID">
                                                        <Fields>
                                                            <ext:ModelField Name="ID" />
                                                            <ext:ModelField Name="Name" />
                                                        </Fields>
                                                    </ext:Model>
                                                </Model>
                                            </ext:Store>
                                        </Store>
                                    </ext:ComboBox>
                                    </Editor>
                                </ext:Column>
                                <ext:Column ID="Column2" runat="server" Text="From" DataIndex="FromInterval" Width="160">
                                    <Editor>
                                        <ext:NumberField ID="nfFromInterval" runat="server" AllowBlank="false" HideTrigger="true"/>
                                    </Editor>
                                </ext:Column>
                                <ext:Column ID="Column3" runat="server" Text="To" DataIndex="ToInterval" Width="160">
                                    <Editor>
                                        <ext:NumberField ID="nfToInterval" runat="server" AllowBlank="false" HideTrigger="true"/>
                                    </Editor>
                                </ext:Column>
                                <ext:Column ID="Column4" runat="server" Text="Total" DataIndex="Total" Width="160">
                                    <Editor>
                                        <ext:NumberField ID="nfTotal2" runat="server" AllowBlank="true"  ReadOnly="true" HideTrigger="true"/>
                                    </Editor>
                                </ext:Column>
                            </Columns>
                        </ColumnModel>
                        <Listeners>
                            <SelectionChange Handler="#{btnRemoveTool}.setDisabled(!selected.length);" />
                        </Listeners>
                    </ext:GridPanel>
    This is the screenshot of my problem:

    Click image for larger version. 

Name:	Captura.PNG 
Views:	20 
Size:	12.0 KB 
ID:	14971

    In other hand, is possible to update the Total Column after update?

    Thanks!
  2. #2
    Hi @Rahnzo,

    Welcome to the Ext.NET forums!

    Please take a look at the Department column here.
    https://examples2.ext.net/#/GridPane...Field_Mapping/

    You should use a Renderer.
  3. #3
    Thanks a lot Daniil!! This work perfectly!

Similar Threads

  1. [CLOSED] Use RowEditing and CheckboxSelectionModel
    By UnifyEducation in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Jul 30, 2013, 7:30 AM
  2. [CLOSED] Rowediting: phantom row
    By tanky65 in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Jun 21, 2013, 8:01 AM
  3. RowEditing Plugin Not working
    By GKG4 in forum 2.x Help
    Replies: 2
    Last Post: Apr 27, 2013, 6:49 PM
  4. Null values in RowEditing V 2.0
    By billy in forum 2.x Help
    Replies: 0
    Last Post: Oct 11, 2012, 2:31 PM
  5. [CLOSED] About the rowEditing plugin.
    By feanor91 in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Oct 10, 2012, 11:31 AM

Tags for this Thread

Posting Permissions