We want to add pqSelect (multiselect dropdown with checkboxes) in pqGrid. We have found few options to do the same and it worked.
We are facing few issues like
1. when we select values and come out of the cell values doesn't show as comma separated.
2. when we again open the dropdown all the selected values (check boxes) doesn't get select and we loose all selected data.
we are creating pq-grid dynamically on run-time on click of a button.
Here is code snippet:
var colModel = [{
title: "Zones",
dataIndx: "zones",
width: 200,
editor: {
type: 'select',
options: Zones,
attr: "multiple='multiple'",
init: function(ui) {
ui.$cell.find("select").pqSelect({
checkbox: true,
multiplePlaceholder: 'Select Zone',
width: '100%',
search: false
});
},
mapIndices: {
name: "zones",
id: "zone_id"
},
labelIndx: "name",
valueIndx: "id"
}
}, {
dataIndx: "zone_id",
hidden: true
}];
//Zones is a global object
var Zones = [{
"name": "A1",
"active": 1,
"description": "dsads",
"modified_by": null,
"created_timestamp": 1474294158,
"modified_timestamp": null,
"id": "32"
}, {
"name": "B1",
"active": 1,
"description": "dsads",
"modified_by": null,
"created_timestamp": 1474294158,
"modified_timestamp": null,
"id": "33"
}, {
"name": "C1",
"active": 1,
"description": "dsads",
"modified_by": null,
"created_timestamp": 1474294158,
"modified_timestamp": null,
"id": "34"
}];