1. 程式人生 > >jqGrid屬性介紹

jqGrid屬性介紹

表格 容器 blog height grid hid style idt 適應

一、jqGrid屬性:

width:
Grid的寬度,如果未設置,則寬度應為所有列寬的之和;如果設置了寬度,則每列的寬度將會根據shrinkToFit選項的設置,進行設置。

height :

Grid的高度,可以接受數字、%值、auto,默認值為150。
shrinkToFit:
此選項用於根據width計算每列寬度的算法。默認值為true。如果shrinkToFit為true且設置了width值,則每列寬度會根據width成比例縮放;如果shrinkToFit為false且設置了width值,則每列的寬度不會成比例縮放,而是保持原有設置,而Grid將會有水平滾動條。  
autowidth
默認值為false。如果設為true,則Grid的寬度會根據父容器的寬度自動重算。重算僅發生在Grid初始化的階段;如果當父容器尺寸變化了,同時也需要變化Grid的尺寸的話,則需要在自己的代碼中調用setGridWidth

方法來完成。

  這些屬性只能是保證第一次時的寬度,當瀏覽器大小變化如還想讓表格寬度自適應,就需要用jqgrid的方法setGridWidth,它有兩個參數:new_width、shr,當第二個參數不設置時會按照shrinkToFit的設置值或默認值,而第一個參數則要設置的新的寬度值,所以可用js實現對瀏覽器寬度變化的自適應:  

$(function(){  
    $(window).resize(function(){  
        $("#analyDataTab").setGridWidth($(window).width()*0.99);
        $("#charDataTab
").setGridWidth(document.body.clientWidth*0.99);  });   });

註:這裏的百分比可按自己需要來設定,也可直接是瀏覽器的寬度大小。

二、jqGrid保持顯示垂直滾動條

在IE中記錄比較少的時候,默認情況下不顯示垂直滾動條,會出現標題行與數據行位置對不 齊的情況,通過保持顯示垂直滾動條可以解決這個問題。

$( pGridId ).closest(".ui-jqgrid-bdiv").css({ overflow-y : scroll });

需要保持水平滾動條,則:

$( pGridId ).closest(".ui-jqgrid-bdiv
").css({ overflow-x : scroll });

三、動態顯示隱藏某一列

$("#grid_id").setGridParam().showCol("colname").trigger("reloadGrid");
$("#grid_id").setGridParam().hideCol("colname").trigger("reloadGrid");

jqGrid屬性介紹