[Easyui-grid] Adds a header menu for Easyui DataGrid, Treegrid to show or hide columns

Add a header menu for Easyui DataGrid, Treegrid, to show or hide columns

/** * @author Sun yu * * @requires jquery,easyui * * for DataGrid, Treegrid Add header menu to show or hide columns, note: Frozen columns are not in this menu*/varCreategridheadercontextmenu =function(E, field) {E.preventdefault (); varGrid = $ ( This);/*Grid itself*/    varHeadercontextmenu = This. Headercontextmenu;/*column Header Menu object on grid*/    if(!Headercontextmenu) {        varTmenu = $ (' <div style= "width:100px; ></div> '). AppendTo (' body '); varFields = Grid.datagrid (' Getcolumnfields ');  for(vari = 0; i < fields.length; i++) {            varFildoption = Grid.datagrid (' getcolumnoption '), Fields[i]); if(!Fildoption.hidden) {$ (' <div iconcls= ' Icon-ok "field=" ' + fields[i] + ' "/> '). HTML (fildoption.title). AppendTo (Tmenu); } Else {                $(' <div iconcls= ' icon-empty "field=" ' + fields[i] + ' "/> '). HTML (fildoption.title). AppendTo (Tmenu); }} Headercontextmenu= This. Headercontextmenu =Tmenu.menu ({onClick:function(item) {varfield = $ (item.target). attr (' field '); if(Item.iconcls = = ' Icon-ok ') {Grid.datagrid (' Hidecolumn ', field); $( This). Menu (' SetIcon ', {target:item.target, iconcls:' Icon-empty '                    }); } Else{Grid.datagrid (' Showcolumn ', field); $( This). Menu (' SetIcon ', {target:item.target, iconcls:' Icon-ok '                    });    }            }        }); } headercontextmenu.menu (' Show ', {left:e.pagex, top:e.pagey});}; $.fn.datagrid.defaults.onheadercontextmenu=Creategridheadercontextmenu;$.fn.treegrid.defaults.onheadercontextmenu= Creategridheadercontextmenu;

[Easyui-grid] Adds a header menu for Easyui DataGrid, Treegrid to show or hide columns