I have an issue with shown/hide columns not saved to saveState...
Toolbar code:
{
type: 'select',
cls: 'columnSelector',
attr: "multiple='multiple'", style: "height:60px;",
options: function (ui) {
var CM = this.getColModel(),
opts = [];
for (var i = 0; i < CM.length; i++) {
var obj = {},
column = CM[i];
obj[ column.dataIndx ] = column.title;
opts.push(obj);
}
return opts;
},
listener: function (evt) {
var arr = $(evt.target).val(),
CM = this.getColModel();
for (var i = 0; i < CM.length; i++) {
var column = CM[i],
dataIndx = column.dataIndx;
//hide the column if not a selected option.
column.hidden = ($.inArray(dataIndx, arr) == -1);
}
this.option("colModel", this.option("colModel")); //refresh the colModel.
this.refresh();
}
}
Function code:
create: function (evt, ui) {
var CM = this.getColModel(),
opts = [];
for (var i = 0; i < CM.length; i++) {
var column = CM[i];
if (column.hidden !== true) {
opts.push(column.dataIndx);
}
}
//initialize the selected options in toolbar select list.
$(".columnSelector").val(opts);
//convert it into pqSelect.
$(".columnSelector").pqSelect({
checkbox: true,
multiplePlaceholder: 'SELECT VISIBLE COLUMNS',
maxDisplay: 0, //100
width: '180px', //auto
displayText: 'SELECT VISIBLE COLUMNS'
});
}
All other states is saved correctly.
