$(function () { var colM = [ { title: "Auto size editor (Enter for new lines)", width: 200, dataIndx: "ShipAddress1", editor: { type: "select", options:[{'value1':'text 1'},{'value2':'text 2'}], } }, { title: "Auto size editor (Alt-Enter for new lines)", width: 200, dataIndx: "ShipAddress2", editor: { type: "textarea" } }, { title: "Manually resizable editor", width: 200, dataIndx: "ShipAddress3", editor: { type: "textarea", attr: "rows=8 cols=58", style: "resize:both;" }, editModel: { saveKey: '' //disable or set it to some other key code to free up use of Enter key for line breaks. } } ]; var dataModel = { location: "remote", dataType: "JSON", method: "GET", url: "/content/invoice.json", getData: function (response) { response.data.forEach(function (rd) { //make ShipAddress multiline text. rd.ShipAddress1 = rd.ShipAddress2 = rd.ShipAddress3 = rd.ShipAddress + "\n" + rd.ShipCity + "\n" + (rd.ShipRegion || "") + "\n" + rd.ShipPostalCode; }) return response; } } $("div#grid_custom_editing").pqGrid({ title: "Shipping Orders", dataModel: dataModel, colModel: colM, autoRow: true, scrollModel: { autoFit: true }, columnTemplate: { valign: 'center' }, create: function (evt, ui) { this.widget().pqTooltip(); }, editModel: { clicksToEdit: 1, keyUpDown: false }, numberCell: { show: false }, resizable: true }); });
editor: { type: 'select', //json arrays valueIndx: "value", labelIndx: "text", //mapIndices: { "text": "ShipVia", "value": "ShipViaId" }, options: [ { "value": "SE", "text": "Speedy Express" }, { "value": "UP", "text": "United Package" }, { "value": "FS", "text": "Federal Shipping" } ] /* key:value pairs options: [ { "SE": "Speedy Express" }, { "UP": "United Package" }, { "FS": "Federal Shipping" } ] */},