I want to add a dropdown in column4 of jqgrid and bind the data for it based on its Column2 particular cell value. All I need is dropdown data will be different for each cell in a Column and it depends on the column2 cell value of that particular row.
$("#VendorGrid").jqGrid({
url: 'TRPurchase.aspx/VendorDATA',
datatype: 'json',
mtype: 'POST',
serializeGridData: function (postData) {
return JSON.stringify(postData);
},
ajaxGridOptions: { contentType: "application/json" },
loadonce: true,
colNames: ['ID', 'Inventory ID', 'Company Name', ' ModelNumber'],
colModel: [
{ name: 'ID', index: 'ID' },
{ name: ' InventoryID', index: ' InventoryID ' },
{ name: 'strCompanyName', index: 'strCompanyName' },
{
name: 'ModelNumber', index: 'ModelNumber',
sortable: true,
align: 'center',
editable: true,
cellEdit: true,
edittype: 'select',
formatter: 'select',
editoptions: {
value: getAllSelectOptions(),
dataEvents: [
{
type: 'change',
fn: function () {
debugger;
}
}]
}
}, ],
pager: '#pagingGrid',
rowNum: 10,
rowList: [10, 20, 30],
viewrecords: true,
gridview: true,
});
Here is my jqgrid code. In column4 'ModelNumber' editoptions function of column call a function getAllSelectOptions() and it returns all data from the array which came from the Ajax call (Ajax call only once while grid load) and bind it for all cells of a column. I want to bind data in column4 depends on the cell value of column2 ' InventoryID'.
For server side I am using ASP.NET with C#.
What I have tried:
I tried to do it with two ways one is dataurl properties of jqgrid but it does not work properly to achieve my requirement. The other is on selectcellEvent of jqgrid I tried to call Ajax each time when user select particular dropdown cell column but in this case cell get into editable mode and Ajax take time to return data can’t show data into editable mode.