jQuery UI Widgets › Forums › DataTable › Dropdownlists in editor mode
This topic contains 6 replies, has 2 voices, and was last updated by Hristo 7 years, 6 months ago.
-
Author
-
I’ll apologize in advance as this might be a bit hard to explain.
I have a datatable that inits dropdownlists in the cells when a row is put into edit. I’ve used example code from the site to make this work. My data adapters have two values, an ID and a Name. The ID is a mysql database ID. Generally when I use standard dropdowns, the database ID is the value, and the Name is what is displayed in the dropdown list, for example <option value=”ID”>Name</option>.
I’m having a problem with using a jqxdropdownlist as my cell editor because as soon as the row leave edit mode, the database ID is displayed in the cell, not the name. This is because getEditorValue: is returning editor.val(). Okay, so I can resolve this issue by changing editor.val() to editor.text(). Now the cell displays the text that is selected in the dropdownlist. This however prevents two new problems. The first is that if I try to edit a cell in a row that has already been edited, the editor does not have the current value selected, since initEditor: is returning values, and not display names. Not the end of the world but a small problem.
The larger problem is that when I submit my form and scan the datatable to enter these new values into my database, there is no way for me to find my ID. Since the editor.text has been placed into the cell, all I can get is the text it’s self, and this is no good to me.
So I guess I’m looking for a solution that allows me to grab the value of each editor, can I assign a form name to each editor in each cell so they become form elements and their values are submitted ? That seems to be the easiest solution as it means I do not have to scan each row in the table and make hidden form elements.
Hope this makes sense !
I also thought I could maybe store the value in another column that is hidden, however I’m not too sure where to set the hidden columns value, tried setting it in getEditorValue: but that does not work.
Hello defyent,
I would like to suggest you use methods that are from the current Widget API.
About the jqxDropDownList you could use.val()
orvar item = editor.jqxDropDownList('getSelectedItem');
and you could return that value in thegetEditorValue
callback of the DataTable. Another important thing is to usecolumntype: 'template'
or columntype: ‘custom’.
Please, take a look at this example: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxdatatable/javascript-datatable-custom-editors.htm?light
Also, I would suggest you about mentioned hidden column you could get full data for the jqxDataTable row byvar rows = $("#table").jqxDataTable('getRows');
.
After that you can use simple iteration to find the particular row.Best Regards,
Hristo HristovjQWidgets team
http://www.jqwidgets.comThanks for the reply.
The thing you have suggested I am already doing. I guess I do not have a good understanding of how editor mode works with datatable and templated or custom editors. Can you tell me, when a row goes out of edit mode, what happens to each editor (for instance the dropdownlist), is it destroyed? or just hidden? Basically what I’m trying to do is get the value (not text) of the dropdownlist upon a form submission, while only displaying the text of the dropdownlist in the cell it’s self. Otherwise when I select the item in the dropdownlist and the row goes out of edit mode, a number is displayed in the cell, and not the text it’s self. I hope this makes sense, it’s a difficult issue to describe.
Hello defyent,
You could implement an additional dataField with the desired value for each one concrete item.
I would like to suggest you look at this example.
If this does not help you please, clarify what you mean by ” get the value (not text) of the dropdownlist upon a form submission”.Best Regards,
Hristo HristovjQWidgets team
http://www.jqwidgets.comThanks again for the reply, in the mean time I managed to work around this issue by creating a hidden column in the datatable and populating that with the id of the selected dropdown.
However, now I’ve run into a new issue, I’m using both dropdownlists and combobox’s as my editors. In my getEditorValue: function, I return editor.value and editor.text, separated by a “:”. Then in rowEndEdit I am spliting this value and populating the cells appropriately, this works great for dropdownlists, however if I use a combox box, the editor.text value is always empty. Is this value called something different for combobox’s?
Hello defyent,
Yes, it is the same callback – renderer.
Please, take a look at this example.Best Regards,
Hristo HristovjQWidgets team
http://www.jqwidgets.com -
AuthorPosts
You must be logged in to reply to this topic.