[CLOSED] on Select event of combobox column in gridpanel with editablegrid plugin

[AnulekhaK]

Hi

I have a grid panel with "EditableGrid" plugin. One of my column is a combo box. My grid panel and combobox are bound to different stores. I want to update the grid row values on selection of combo box. Now i am trying this on Select event. I am getting "Microsoft JScript runtime error: 'this.getEl().dom.value' is null or not an object" error where "this" is the combobox object. Below is the code snippet.

 var UpdateItemGrid = function (record) {
  var selectedRowID = grdItems.getSelectionModel().selections.items[0].data.ItemNumber;
        var gridStore = grdItems.getStore();
        var recordData = record.data;
 var recordIndex = gridStore.find('ItemNumber', selectedRowID);
        if (recordIndex > -1) {
            var gridRecord = gridStore.getAt(recordIndex);
 if (gridRecord != null) {
                grdItems.startEditing(0, 0);
gridRecord.set('ItemNumber', selectedRowID );
  grdItems.startEditing(0, 0);
 }
        }
       /grdItems.getView().refresh();
    };

<ext:GridPanel ID="grdItems" runat="server" StripeRows="true" AnchorHorizontal="100%"
                        AutoDataBind="true" Height="350" StoreID="ItemGridStore" AutoExpandColumn="ShortDesc"  
                        AutoWidth="true">
                        <Plugins>
                            <ext:EditableGrid ID="EditableGrid1" runat="server" >
                            </ext:EditableGrid>
                        </Plugins>
                        <ColumnModel ID="grdItemsColModel" runat="server">
                            <Columns>
                                <ext:RowNumbererColumn Width="100px" ColumnID="RowNoColumn" />
                                <ext:Column ColumnID="ItemNo" Header="Item Number" DataIndex="ItemNumber">
                                    <Editor>
                                        <ext:ComboBox runat="server" ID="cmbItems" Width="400" Mode="Local" StoreID="ItemStore" 
                                            TriggerAction="All" ForceSelection="false" 
                                            DisplayField="ItemNumber" ValueField="ItemNumber">
                                            <Listeners>
                                                <Select Handler="UpdateItemGrid()" />
                                            </Listeners>
                                        </ext:ComboBox>                                        
                                    </Editor>
<SelectionModel>
                            <ext:RowSelectionModel ID="RowSelectionModel2" runat="server" SingleSelect="true" />
                        </SelectionModel>
                        <View>
                            <ext:GridView ID="ItemGridView" runat="server" MarkDirty="false" ForceFit="true" />
                        </View>                                              
                    </ext:GridPanel>

[Daniil]

Hi,

Your handler is

Handler="UpdateItemGrid()"

but the function is

var UpdateItemGrid = function (record)

I think you need to pass a record to the function:

Handler="UpdateItemGrid(record)"

[AnulekhaK]

Hi,

Your handler is

Handler="UpdateItemGrid()"

but the function is

var UpdateItemGrid = function (record)

4

I think you need to pass a record to the function:

Handler="UpdateItemGrid(record)"

Hi,

I made the change but still i am getting the same error. I followed the below link. But now I am getting "Field is undefined" error

http://forums.ext.net/showthread.php...x-Change-Event

Thanks
Anulekha

[Daniil]

Please demonstrate how does the code look now?

[AnulekhaK]

Please demonstrate how does the code look now?

Hi

Below is the updated code.

<ext:GridPanel ID="grdItems" runat="server" StripeRows="true" AnchorHorizontal="100%"                        AutoDataBind="true" Height="350" StoreID="ItemGridStore" AutoExpandColumn="ShortDesc"                          AutoWidth="true">                         <Plugins>                             <ext:EditableGrid ID="EditableGrid1" runat="server" >                             </ext:EditableGrid>                         </Plugins>                         <ColumnModel ID="grdItemsColModel" runat="server">                             <Columns>                                 <ext:RowNumbererColumn Width="100px" ColumnID="RowNoColumn" />                                 <ext:Column ColumnID="ItemNo" Header="Item Number" DataIndex="ItemNumber">                                     <Editor>                                         <ext:ComboBox runat="server" ID="cmbItems" Width="400" Mode="Local" StoreID="ItemStore"                                             TriggerAction="All" ForceSelection="false"                                             DisplayField="ItemNumber" ValueField="ItemNumber">                                             <Listeners>                                                 <Select Handler="this.fireEvent('blur');"/></Listeners>                                         </ext:ComboBox>                                                                             </Editor> <SelectionModel>                             <ext:RowSelectionModel ID="RowSelectionModel2" runat="server" SingleSelect="true" />                         </SelectionModel>                         <View>                             <ext:GridView ID="ItemGridView" runat="server" MarkDirty="false" ForceFit="true" />                         </View>        <Listeners>
                            <AfterEdit Handler="UpdateItemGrid(record);" />
                        </Listeners>                                                               </ext:GridPanel>

Thanks
Anulekha

[Daniil]

Unfortunately, the code is hard to read, please format.

[AnulekhaK]

Hi

i could solve the issue by explicitly call the afteredit event of gridpanel on selection of combobo

combobox.fireEvent('blur');
grid.fireEvent('AfterEdit');

Thanks
Anulekha