在我們使用JQuery jqGrid的過程中,如果出現了列表項過多,會導致頁面的混亂,那么我們就需要隱藏一些列來緩解這種情況。
jqGrid中提供了columnChooser屬性來控制列的顯示和隱藏。我們只需要在構建jqGrid的時候添加columnChooser屬性,就可以實現列的隱藏效果。
$("#grid").jqGrid({ ... columnChooser: true, //其他配置項 });
當我們設置columnChooser為true時,頁面上會顯示一個顯示/隱藏列的按鈕,點擊該按鈕會彈出一個對話框,我們可以在該對話框中選擇要顯示的列和要隱藏的列,點擊確定按鈕后,所選列的狀態就會改變,從而達到列的隱藏效果。
除了使用columnChooser這種方法,我們還可以在gridComplete事件中手動隱藏列,如下所示。
gridComplete: function() { var ids = jQuery("#grid").getDataIDs(); for (var i = 0; i < ids.length; i++) { jQuery("#grid").hideCol('column_name'); } }
以上就是使用JQuery jqGrid進行列隱藏的兩種方法。大家可以根據自己的需求來選擇適合自己的方法,以達到更好的效果。