Author Topic: Save columns state ( size and position ) in cookie  (Read 5850 times)

omerix

  • Pro Enterprise
  • Full Member
  • *
  • Posts: 148
    • View Profile
Save columns state ( size and position ) in cookie
« on: January 22, 2014, 04:18:38 pm »
Hello,

I am changing column's sizes and places. However when the page is refreshed they turns back to original size and places. Can you please advice if I those adjustments could be hold in cookies on your grid code?
« Last Edit: January 23, 2014, 08:41:28 am by paramquery »

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6310
    • View Profile
Re: Cookie resize and column drag
« Reply #1 on: January 22, 2014, 07:39:57 pm »
You can serialize the colModel into string upon column resize or page unload event and save it in cookie and retrieve later upon grid reload.

var CM = $grid.pqGrid( "option", "colModel" );
var strCM = JSON.stringify( CM );
//save strCM in a cookie.

use $.parseJSON to convert string back to colModel.

There is no inbuilt API for cookie read / write in pqGrid. You could use some third party library

http://stackoverflow.com/questions/1458724/how-to-set-unset-cookie-with-jquery
http://www.sitepoint.com/eat-those-cookies-with-jquery/

omerix

  • Pro Enterprise
  • Full Member
  • *
  • Posts: 148
    • View Profile
Re: Cookie resize and column drag
« Reply #2 on: January 22, 2014, 09:27:33 pm »
Hello Param,

I'm include "<script src="js/jquery.cookie.js"></script>"

Where do you think the problem. Can you help?
Thanks

add code
Code: [Select]
var CM = $grid.pqGrid("option", "colModel");
var strCM = JSON.stringify(CM);
console.log(strCM);
$.cookie("test2",strCM,{json:true}); /* Not work */
var TestColMod1 ="[{\"Test\":\"Test String\"}]";
$.cookie("test3",TestColMod1,{json:true}); /* work */


strCM
Code: [Select]
[{"title":"ID","dataIndx":"Id","width":10,"dataType":"integer","editable":false,"align":"center","sortable":true,"hidden":true,"colSpan":0,"childCount":0,"leftPos":0,"rowSpan":1},{"title":"Uye","dataIndx":"UyeId","width":10,"dataType":"integer","editable":false,"align":"center","sortable":true,"hidden":true,"colSpan":0,"childCount":0,"leftPos":1,"rowSpan":1},{"title":"Yetki","width":150,"dataIndx":"ModulId","dataType":"integer","editable":true,"align":"left","sortable":true,"editor":{},"colSpan":1,"childCount":0,"leftPos":2,"rowSpan":1},{"title":"Yetki A
« Last Edit: January 22, 2014, 09:45:11 pm by omerix »

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6310
    • View Profile
Re: Cookie resize and column drag
« Reply #3 on: January 22, 2014, 10:16:28 pm »
Here is the working code. You don't need to mention { json: true} as you are storing it as string in the cookie.

Code: [Select]
  //setter
            var CM = $grid.pqGrid("option", "colModel");
            var strCM = JSON.stringify(CM);
            $.cookie("CM", strCM);
            //alert(strCM);
  //getter
            var strCM2 = $.cookie("CM");
            alert(strCM2);
            var CM2 = JSON.parse(strCM2);
            $grid.pqGrid("option", "colModel", CM2);
            $grid.pqGrid("refresh");

omerix

  • Pro Enterprise
  • Full Member
  • *
  • Posts: 148
    • View Profile
Re: Save columns state ( size and position ) in cookie
« Reply #4 on: January 23, 2014, 05:46:50 pm »
Thank you param,

Incredible very good