Click here to Skip to main content
15,887,435 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
JavaScript
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',
                                           //beforeSaveCell: function(value) {
                                           //    alert('New cell value: "'+value+'"');
                                           //},
                                           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.
Posted
Comments
Member 12127723 19-Apr-16 10:26am    
Please suggest me any other alternate solution

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900