JQGrid with Multiselect widget for multi filter and persisting the filter and sort value into cookie - cookies

Question

I have requirement to be able to persist the filtered grid view for a session. I have done something like this. I am storing the filter value into cookie. But not being able to get the desired result.
modifySearchingFilter = function (separator) {
var i, l, rules, rule, parts, j, group, str, iCol, cmi, cm = this.p.colModel,
filters = this.p.postData.filters === undefined ? null : $.parseJSON(this.p.postData.filters);
console.log(document.cookie);
if(( filters===null) &&(document.cookie.length != 0)) {
var tempcookiearray = document.cookie.split(';');
if (tempcookiearray.length > 1) {
var temp = tempcookiearray[0];
var secondtemp = temp.split('=');
if (secondtemp[1] !== 'null') {
filters = secondtemp[1];
filters = $.parseJSON(filters);
}
}
}
if (filters && filters.rules !== undefined && filters.rules.length>0) {
var temp = filters.rules;
rules = filters.rules;
for (i = 0; i < rules.length; i++) {
rule = rules[i];
iCol = getColumnIndexByName.call(this, rule.field);
cmi = cm[iCol];
if (iCol >= 0 &&
((cmi.searchoptions === undefined || cmi.searchoptions.sopt === undefined)
&& (rule.op === myDefaultSearch)) ||
(typeof (cmi.searchoptions) === "object" &&
$.isArray(cmi.searchoptions.sopt) &&
cmi.searchoptions.sopt[0] === rule.op)) {
// make modifications only for the "contains" operation
parts = rule.data.split(separator);
if (parts.length > 1) {
if (filters.groups === undefined) {
filters.groups = [];
}
group = {
groupOp: "OR",
groups: [],
rules: []
};
filters.groups.push(group);
for (j = 0, l = parts.length; j < l; j++) {
str = parts[j];
if (str) {
// skip empty "", which exist in case of two separaters of once
group.rules.push({
data: parts[j],
op: rule.op,
field: rule.field
});
}
}
rules.splice(i, 1);
i--; // to skip i++
}
}
}
}
this.p.postData.filters = JSON.stringify(filters);
document.cookie = "cookie=" + this.p.postData.filters;
};
$.ajax({
method: "GET"
, url: "/Test/_vti_bin/ListData.svc/ProductList?$expand=Invoice"
, contentType: "application/json; charset=utf-8"
, dataType: "json"
, success: function (data, status) {
ParseData(data.d);
}
, error: function () {
//alert("WAT?!");
}
});
var ParseData = function (d) {
var newData = {
totalPages: 1
, currentPage: 1
, totalRows: d.results.length
, data: d.results
};
BuildTable(newData);
};
var BuildTable = function (d) {
$("#jqGrid").jqGrid({
data: d.data,
datatype: 'local',
colModel: [
{ label: "Title", name: 'Title' },
{ label: "Number", name: 'Number', align: 'center', key: true },
{ label: "Date", name: 'Date', align: 'center' },
{ label: "Descritption", name: 'Description', formatter: testformat },
{ label: "Category", name: 'Category'}
],
loadonce: true,
viewrecords: true,
autowidth: true,
shrinkToFit: false,
sortable: true,
sortname:"Title",
rowNum: '999',
rownumbers:true
});
setSearchSelect('Title');
setSearchSelect('Number');
setSearchSelect('EndDate');
setSearchSelect('Description');
setSearchSelect('Category');
function testformat(cellvalue, options, rowObject) {
return "<a href='http://www.google.com' target='_blank'>" + cellvalue + "</a>"
};
// activate the filterToolbar
$('#jqGrid').jqGrid('filterToolbar', {
stringResult: true,
searchOnEnter: true,
// defaultSearch: myDefaultSearch,
beforeClear: function () {
$(this.grid.hDiv).find(".ui-search-toolbar button.ui-multiselect").each(function () {
$(this).prev("select[multiple]").multiselect("refresh");
}).css({
width: "98%",
marginTop: "1px",
marginBottom: "1px",
paddingTop: "3px"
});
}
}).trigger('reloadGrid');
$('#jqGrid').jqGrid('setGridParam', {
beforeRequest: function () {
modifySearchingFilter.call(this, ",");
}
});
$('#jqGrid').jqGrid('setGridParam', {
loadComplete: function () {
$('.ui-jqgrid .ui-jqgrid-htable th').css('background-color', '#DCD796');
$('.ui-jqgrid tr.jqgrow:odd').css('background-color', '#FFFCED');
$('.ui-jqgrid .ui-jqgrid-bdiv').css('height', '500px');
$('.ui-multiselect-checkboxes LI').css('font-size', '1.2em');
}
}).trigger('reloadGrid');
};
enter code here