How to bind different data source to dropdown in editor, when editing a row cell

[abhisheks@plasmacomp.comParticipant]

i have many columns in JQXGRID and having a fixed datasource for a dropdown which comes up when i go to edit row cell of column “FIRSTNET” .
Now i need to bind that dropdown with different source of column “FIRSTNET” , based on a different column “CATEGORY”
eg. When “CATEGORY” is “Test-1” then Dropdown should show “AB” & “CD” and When “CATEGORY” is “Test-2” then Dropdown should show “GH” & “YZ”
Anyone please suggest how to change dropdown’s source on cellbeginedit or any other way to get the above functionality ?

my code like

$.each(AppKeys.ListColumnName.split(‘,’), function (_rowIndex, i) {
else if (i.trim() == “FIRSTNET”) {
/* Begin Abhishek updated filter values – CR #584 – FirstNet Breakdown Options */
var listfnet = [‘AB’, ‘CD’];
var listfnetf = [‘FirstNet Capable’, ‘FirstNet Ready’, ‘FirstNet Trusted’, ‘No’, ‘(Blanks)’];
/* End Abhishek updated filter values – CR #584 – FirstNet Breakdown Options */
lstGridColumns.push({
text: ColFrindlyName, columntype: ‘dropdownlist’, filtertype: ‘checkedlist’, datafield: i, width: 100, editable: true,
rendered: changeColor, filteritems: listfnetf,
createeditor: function (row, cellvalue, editor, cellText, width, height) {

editor.jqxDropDownList({
checkboxes: false, source: listfnet,
selectionRenderer: function () {

return “<span style=’top:4px; position: relative;’>Please Choose:</span>”;
}
});

},

cellbeginedit: function (row, datafield, columntype, ) {

}
/* End CR #678 */
});
}
});
gGridData = gridData;
var source = {
datafields: lstDatafields,
datatype: “array”,
localdata: {},
totalrecords: gtotalRecords
};
$(“#jqxgrid”).jqxGrid({
editable: true,
pagesize: parseInt(AppKeys.PageSize),
selectionmode: ‘checkbox’,
//editmode: ‘Dblclick’,
width: ‘100%’,
//height: 0,
enablebrowserselection: true,
keyboardnavigation: false,
source: adapter,
altrows: true,
sortable: true,
filterable: true,
virtualmode: true,
pageable: true,
rendergridrows: rendergridrows,
columnsresize: true,
columnsreorder: true,
ready: function () {
addfilter();
},
autoshowfiltericon: false,
autoheight: false,
height: gheight,
showsortcolumnbackground: false,
showfiltercolumnbackground: true,
enabletooltips: true,
columns: lstGridColumns

});

[adminKeymaster]

Hi,

To change the datasource of an editor, you should use the ‘initeditor’ callback of the column. Example; https://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/cascadingediting.htm?fluent

Hope this helps.

Best regards,
Peter Stoev

https://www.jqwidgets.com/

[Author]

Posts