In-grid jqxdropdown causes exception.

[agrocksMember]

I have following grid definition:

$("#jqxgrid").jqxGrid({
        width: 550,
        height: '100%',
        theme: theme,
        sortable: true,
        columnsresize: true,
        filterable: true,
        editable: true,
        columns: [{ text: 'Name', datafield: 'Name', columntype: 'textbox', filterable: true, sortable: true, editable: false, width: 250 },                 
                  {
                      text: 'Foo', columntype: 'dropdownlist', datafield: 'FooName', editable: true,
                      initeditor: function (row, cellvalue, editor) {
                          editor.jqxDropDownList({ displayMember: 'Name', source: modelBars });
                          $(document).on('select', editor, function (event) {
                              var args = event.args;
                              var selection = editor.jqxDropDownList('getItem', args.index);
                              if (selection != undefined) {
                                  var rowindex = $('#jqxgrid').jqxGrid('getselectedrowindex');
                                  var foo = $("#jqxgrid").jqxGrid('getrowdata', rowindex);
                                  if (selection.originalItem) {
                                      foo.Bar = selection.originalItem;                                      
                                  }
                              }
                          });                       
                      },
                  }]
    });

And faced strange issue:
When I’m navigating from page without confirming last dropdown-column edit(by pressing ‘Enter’), next time I enter page and try to select any value from dropdown (which actually has items in it) exception occures.

Here there is a stacktrace of this error:

a.extend.getItem (http://localhost:38615/Content/jqwidgets/jqwidgets/jqxlistbox.js:930:29),
a.extend.getItem (http://localhost:38615/Content/jqwidgets/jqwidgets/jqxdropdownlist.js:7:13424),
Object.a.jqx.invoke (http://localhost:38615/Content/jqwidgets/jqwidgets/jqx-all.js:7:591),
Object.a.jqx.jqxWidgetProxy (http://localhost:38615/Content/jqwidgets/jqwidgets/jqx-all.js:7:2168),
HTMLDivElement.a.jqx.jqxWidget.a.fn.(anonymous function) (http://localhost:38615/Content/jqwidgets/jqwidgets/jqx-all.js:7:3311), Function.jQuery.extend.each (http://localhost:38615/Scripts/jquery/jquery-1.7.2.js:660:42)”,
jQuery.fn.jQuery.each (http://localhost:38615/Scripts/jquery/jquery-1.7.2.js:271:31)”,
a.jqx.jqxWidget.a.fn.(anonymous function) [as jqxDropDownList] (http://localhost:38615/Content/jqwidgets/jqwidgets/jqx-all.js:7:3283)

What is wrong with my code?
Is there any way to force grids ‘endedit’ on lostfocus/onblur event?

[Peter StoevKeymaster]

Hi agrocks,

The document also has ‘select’ event which is raised when a widget or focusable html element is selected. In your code, you should add check whether event.args != undefined. In addition, it would be better to use the createeditor instead of initeditor because createeditor is called when the editor is created, the initeditor is called each time the editor becomes active i.e you are binding multiple times to the ‘select’ event.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[agrocksMember]

Hi Peter,

Thanks for quick reply, but after applying changes that you mentioned about, I’m still facing same problem:

Uncaught TypeError: Cannot read property ‘length’ of undefined

in jqxlistbox.js.

Regards,
Anatolii

[Peter StoevKeymaster]

Hi Anatolii,

I don’t know what could be the reason about that. Please, send us a small sample which demonstrates the behavior to support@jqwidgets.com. We’ll test it locally.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts