jqxDropDownButton and geteditorvalue issue

[dutoanParticipant]

Hi All
I have a problem with using Geteditorvalue for jqxDropDownButton.
I appended an input tag to the editor:
createeditor: function (row, cellvalue, editor, celltext, cellwidth, cellheight) {
editor.append(‘<input id=”inputbox” value=”somevalue”><div style=”border-color: transparent;” id=”jqxgrid-editor”></div>’);
editor.jqxDropDownButton({ width: 150, height: 25 });
and get the returned value through geteditorvalue
geteditorvalue: function (row, cellvalue, editor) {

// return the editor’s value.
editor.jqxDropDownButton(“close”);
alert(row);
return name;
}

With the rowindex NOT EQUAL to the last row, I have no issue to type into the html input tag, however with the last row of the grid, the editor.jqxDropDownButton(“close”); fire immediately when mousedown in the html input tag and typing into the input is impossible. Please have a look at the following link
https://jseditor.io/?key=grid-editing-with-dropdownlist-grid
With the said link, when click on “Beate Wilson” and “Andrew Fuller”, I can type into the dropdown input (row 1 and 2). Nonetheless, when click on “Mayumi Murphy”, I cannot type into the dropdown input tag but the alert fires off immediately.

I’ve tried to use settimeout() or true/false on(“input”) event but failed to get the expected result. This happens to ONLY on the last row. I’m unable to figure out. Any help is highly appreciated.
Thank you

[MartinParticipant]

Hello dutoan,

After playing a bit with your jseditor example I managed to notice that this behavior is not related with the last row of the grid,
but with the grid’s height. I mean that the geteditorvalue callback is executed when the mouse click is under the grid.
In your example you can see that if you click in the top part of the input you can type in it.

So, if you replace the autoheight property of the main grid with height: 145, the issue does not exist anymore.

I hope that this would help!

Best Regards,
Martin

jQWidgets Team
http://www.jqwidgets.com/

[dutoanParticipant]

Hi Martin
It works. Thanks so much for your finding. I had spent lots of time figuring out without result.

[dutoanParticipant]

Hi Martin
Another issue with your solution, when I increased height, say 500 or 1000, then on(‘rowselect’) in the jqxDropDownButton (jqxgrid-editor) did not return value but wait until I clicked on the main grid (jqxgrid).
Can you provide me some hint?

[MartinParticipant]

Hello dutoan,

Again, if you click the row in the right side where the main grid is not behind, the row value is returned.
Instead, I would suggest you to consider using a pop-up menu which will contain the grid.

You can see the approach in this Demo.

Best Regards,
Martin

jQWidgets Team
http://www.jqwidgets.com/

[Author]

Posts