jqGrod 折り畳み状態の永続化

たくさんのグリッドを配置したページでは、あまり見ないのは折り畳んでおくとすっきりしますが、次回使う時、開いた状態で始まるとわかりにくく、使いにくいので、ローカルストレージに保存して前回最終折り畳み状態を再現できるようにします。

[ コードサンプル ]


      //  各グリッド折り畳み状態 //
      /* キーはグリッドid, hiddngid が true or false 既定は全部trueで折り畳み   */
      var gdhiddenMap = {delayskip: true, pctgt: true, pchst: true, mtapi: true, usradd: true, tgtbps: true,
        tableschemalist: true, tableloglist: true, batlog: true,
        pcsum: true, apidoc: true, pcncann: true, svpdsterr: true, polydel: true, polyfacildel: true,
        bareaupdt: true, actcy: true};
        
      // ローカルストレージから読む //
      if (localStorage) {
        if (localStorage.getItem('vesselsch_gdstate_logshow') != null) {
          var hdnmap = JSON.parse(localStorage.getItem('vesselsch_gdstate_logshow'));
          /*for (key in gdhiddenMap) {
           if (hdnmap[key] !== undefined) {
           gdhiddenMap[key] = hdnmap[key];
           }
           }*/
          // これでも出来るが、あまり変わりないような //
          $.map(gdhiddenMap, function (value, index) {
            if (hdnmap[index] !== undefined) {
              gdhiddenMap[index] = hdnmap[index];
            }
          });
        }
      }
      
      
      /* jgGrid プロパティ設定 */
      hiddengrid: gdhiddenMap['delayskip'], // 折り畳み
      	
      /* jqGrid onHeaderClick イベントでローカルストレージに保存する */
      // -- 折り畳みを変えた時 -- //
          onHeaderClick: function () {
            var gdstate = $(this).jqGrid('getGridParam', 'gridstate');
            var thisid = $(this).attr('id');
            gdhiddenMap[thisid] = gdstate == 'hidden';
            localStorage.setItem('vesselsch_gdstate_logshow', JSON.stringify(gdhiddenMap));
          },	

Chromeの開発ツールで状態をチェックする

コメントを残す