[CLOSED] componentID shows in combo text

  1. #1

    [CLOSED] componentID shows in combo text

    Support,
    See complete example below.

    The problem is that the component id is showing int he textfield part of the combo.

    to reproduce, run the example. Then load then page. Click the add row button and a new row will appear. Click the editable combo (in the new row), and you will see the component Id in the dropdown.

    This is confusing the users. i expect that this will NOT show and the textfield part is blank.

    Thanks,
    /Z

    <%@ Page Language="C#" %>
    
    
    <!DOCTYPE html>
    
    
    <html>
    <head id="Head1" runat="server">
        <title>GridPanel Row with ToolTip - Ext.NET Examples</title>
        <link href="/resources/css/examples.css" rel="stylesheet" />    
    
    
        <script>
            var rowInsertCounter = -1;
            var runMe = function () {
                var newdet = {
                    id: 1, description: 'test'
                };
    
    
                App.StoreTestDetails.add(newdet);
                var newdet2 = {
                    id: 2, description: 'test2'
                };
    
    
                App.StoreTestDetails.add(newdet2);
    
    
                var newRecord = {
                    myTestValueId: 1, name: 'test', description: 'test'
                };
    
    
                App.GridPanelTestDetails.getStore().add(newRecord);
                var newRecord = {
                    myTestValueId: 2, name: 'test1', description: 'test1'
                };
    
    
                App.GridPanelTestDetails.getStore().add(newRecord);
                var newRecord = {
                    myTestValueId: 2, name: 'test2', description: 'test2'
                };
    
    
                App.GridPanelTestDetails.getStore().add(newRecord);
            };
    
    
            var generateNewTestRow = function (grid) {
                rowInsertCounter -= 1;
                var newRecord = {
                    id: rowInsertCounter, description: ''
                };
    
    
                grid.getStore().add(newRecord);
            }
    
    
            var editTestDetailsRenderer = function (value, metaData, record, rowIndex, colIndex, store) {
                var r = App.StoreTestDetails.getById(value);
    
    
                if (Ext.isEmpty(r)) {
                    return record.data.description;
                }
    
    
                return r.data.description;
            };
    
    
    
    
        </script>
    </head>
    <body>
        <form id="Form1" runat="server">
            <ext:ResourceManager ID="ResourceManager1" runat="server">
                <Listeners>
                    <DocumentReady Handler="runMe()" />
                </Listeners>
            </ext:ResourceManager>
            
        <ext:Store ID="StoreTestDetails" runat="server" AutoLoad="false">
            <Model>
                <ext:Model ID="Model1" IDProperty="id"  runat="server">
                    <Fields>
                        <ext:ModelField Name="id" />
                        <ext:ModelField Name="description" />
                    </Fields>
                </ext:Model>
            </Model>
            <Sorters>
                <ext:DataSorter Property="description" Direction="ASC" />
            </Sorters>
         </ext:Store>
    
    
    
    
        <ext:Window 
            ID="WindowEditTestDetails" 
            runat="server" 
            Icon="ApplicationFormAdd" 
            Layout="VBoxLayout"
            Width="400"
            Hidden="false" 
            Modal="true"
            Title="Edit Test Details">
            <LayoutConfig>
                <ext:VBoxLayoutConfig Align="Stretch" Pack="Start"/>
            </LayoutConfig>
            <Items>
                <ext:GridPanel 
                    ID="GridPanelTestDetails"
                    runat="server" 
                    AutoScroll="true">
                    <Store>
                        <ext:Store runat="server"
                                   AutoLoad="false">
                            <Model>
                                <ext:Model IDProperty="myTestValueId"  runat="server">
                                    <Fields>
                                        <ext:ModelField Name="name" Type="String"/>
                                        <ext:ModelField Name="myTestValueId" Type="Int"/>
                                        <ext:ModelField Name="description" Type="String"/>
                                    </Fields>
                                </ext:Model>
                            </Model>
                        </ext:Store>
                    </Store>
                    <ColumnModel ID="ColumnModel1" runat="server">
                        <Columns>
                            <ext:Column ID="Column1" runat="server" Text="Test Code" Width="120" DataIndex="myTestValueId">
                                <Renderer Fn="editTestDetailsRenderer" />
                                <Editor>
                                    <ext:ComboBox ID="ComboBox1"  
                                        runat="server"
                                        DisplayField="description"
                                        ValueField="id"
                                        StoreID="StoreTestDetails"
                                        QueryMode="Local">
                                    </ext:ComboBox>
                                </Editor>
                            </ext:Column>
                        </Columns>
                    </ColumnModel>
                    <SelectionModel>
                        <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" Mode="Single" />
                    </SelectionModel>
                    <Plugins>
                        <ext:CellEditing ID="CellEditing1" ClicksToEdit="1" runat="server" />
                    </Plugins>
                    <BottomBar>
                        <ext:Toolbar ID="Toolbar1" runat="server">
                            <Items>
                                <ext:Button ID="Button1" Text="Add Row"  runat="server" Icon="Add">
                                    <Listeners>
                                        <Click Handler="generateNewTestRow(App.GridPanelTestDetails);" />
                                    </Listeners>
                                </ext:Button>
                            </Items>
                        </ext:Toolbar>
                    </BottomBar>
                </ext:GridPanel>
            </Items> 
        </ext:Window>
        </form>
    </body>
    </html>
    Last edited by fabricio.murta; Dec 15, 2016 at 12:41 PM.
  2. #2
    Hello @Z!

    Thanks for the test case, it really helps us see what's happening in your side.

    The problem is because you are mixing up the combo box's ID with the grid records' ID. Use something different (or don't specify it at all) at the grid store's IDProperty setting.

    One other problem with the approach you took is that any value chosen from the combo boxes will result in an error for the grid having two records with the same ID. Notice a grid's record ID is not necessarily the company database's record ID. While the company may in some circumstances allow different products have the same ID, a grid requires the records to be unique in the whole grid.

    Here, as soon as I changed the IDProperty to something else (or just erased it, from your line 125) your test case seemed to work like a charm. I could edit, save, select same dropdown record on different cells/rows...

    Well, maybe I still skipped some test or requirement about your test case, so let us know if there's still not a solution for your issue.

    Hope this helps!
    Fabrício Murta
    Developer & Support Expert
  3. #3
    thanks. that worked.

    /Z
  4. #4
    Glad it helped, thanks for the feedback!
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. [CLOSED] Component Column - Combobox shows value first and then corresponding text
    By PriceRightHTML5team in forum 2.x Legacy Premium Help
    Replies: 9
    Last Post: Apr 15, 2014, 3:38 PM
  2. [CLOSED] Notification Window shows no Text
    By Peter.Treier in forum 2.x Legacy Premium Help
    Replies: 5
    Last Post: Aug 19, 2013, 5:35 PM
  3. Replies: 1
    Last Post: Apr 03, 2013, 6:46 AM
  4. Replies: 3
    Last Post: Oct 27, 2012, 10:47 AM
  5. Combo Box TEXT Problem
    By EMS in forum 1.x Help
    Replies: 1
    Last Post: Dec 07, 2010, 2:36 PM

Posting Permissions