Below is the code have used to bind select for editor, when option is selected in editor, the values is binded in SGROUPNAME, instead of text and SGROUPCODE code is not updated as in demo page inline editing - editors validators example, am i missing anything
var obj = {
width: 965,
maxWidth: 965,
height: 300,
columnBorders: true,
wrap: false, hwrap: false,
showTitle: false,
collapsible: false,
selectionModel: { type: 'cell', mode: 'single' },
trackModel: { on: true }, //to turn on the track changes.
virtualX: true,
editModel: {
saveKey: $.ui.keyCode.ENTER,
//filterKeys: false,
keyUpDown: true,
cellBorderWidth: 0
},
editor: { select: true },
toolbar: {
items: [
{ type: '<span style="margin-right:630px">Asset Details</span>' },
{
type: 'button',
style: 'padding:5px;',
label: "Add New",
attr: 'id="btnNewCapex"',
icon: 'ui-icon-circle-plus',
listeners: [{
"click": function (evt) {
if ($('#ddlGroup').prop('selectedIndex') <= 0) { Notify('Please select group first', 4); $('#ddlGroup').focus(); return false; }
var rowdata = { UNITPRICE: 0, NOOFUNITS: 1, FC: 0, EXRATE: 0, TOTAL: 0 };
var rowIndx = $grid.pqGrid("addRow", { rowData: rowdata });
}
}],
},
{ type: 'separator' },
{
type: 'button', icon: 'ui-icon-arrowreturn-1-s', label: 'Undo', style: 'padding:5px;', cls: 'changes', listener:
{
"click": function (evt, ui) {
$grid.pqGrid("history", { method: 'undo' });
}
},
options: { disabled: true }
},
{ type: 'separator' },
{
type: 'button', icon: 'ui-icon-arrowrefresh-1-s', label: 'Redo', style: 'padding:5px;', listener:
{
"click": function (evt, ui) {
$grid.pqGrid("history", { method: 'redo' });
}
},
options: { disabled: true }
},
]
}
};
obj.colModel = [
{ title: "PKID", dataIndx: "PKID", hidden: false },
{ title: "GroupCode", dataIndx: "SGROUPCODE", hidden: false },
{
title: "Sub Group", dataIndx: "SGROUPNAME", width: 200,
editor: {
type: 'select',
valueIndx: "code",
labelIndx: "name",
mapIndices: { name: "SGROUPNAME", code: "SGROUPCODE" },
options: [
{ code: "120", name: "TRUCK MIXER" },
{ code: "121", name: "CONCRETE PUMP" }
]
},
validations: [{ type: 'minLen', value: 1, msg: "Required" }]
},
{ title: "Unit Price", dataIndx: "UNITPRICE", width: 70, align: 'center', dataType: 'float' },
{ title: "No Of Units", dataIndx: "NOOFUNITS", width: 80, align: 'center', dataType: 'integer' },
{ title: "Freight / Customs", dataIndx: "FC", width: 110, align: 'center', dataType: 'float' },
{ title: "Exchange Rate", dataIndx: "EXRATE", width: 100, align: 'center', dataType: 'float' },
{ title: "Total", dataIndx: "TOTAL", width: 150, align: 'center', editable: false, dataType: 'float' },
{ title: '', minWidth: 40, maxWidth: 40, align: 'center', editable: false, render: function (ui) { return "<button type='button' class='delete_btn'>Delete</button>" } }
];
obj.dataModel = {
location: "remote",
dataType: "JSON",
method: "GET",
url: requestpath + "Master/MasterHandler.ashx?q=GET_CAPEX_DETAILS&id=" + pkid,
getData: function (dataJSON) { return { curPage: dataJSON.curPage, totalRecords: dataJSON.totalRecords, data: dataJSON.data }; }
}
var $grid = $("#gdvCapexDetails").pqGrid(obj);
$grid.on('pqgridrefresh pqgridrefreshrow', function () {
var $grid = $(this);
//delete button
$grid.find("button.delete_btn").button({ icons: { primary: 'ui-icon-trash' }, text: false }).css('width', '20px').css('padding', '1px').css('height', '20px')
.unbind("click")
.bind("click", function (evt) {
var $tr = $(this).closest("tr");
var rowIndx = $grid.pqGrid("getRowIndx", { $tr: $tr }).rowIndxPage;
$grid.pqGrid("deleteRow", { rowIndx: rowIndx });
return false;
});
});