2

jQuery の JQGrid を使用中に奇妙な問題が発生しました。次のフラグメント コードはそれを作成するためのものです。

grid= jQuery("#grid_id").jqGrid({
    data : response.list,
    datatype : "local",
    colNames : columnNames,
    colModel : [ {....}],                       
    rowNum : 30,
    width : $("#grid_id").width(),
    height: $("#grid_page").height(),
    rowList : [ 30, 100, 150 ],
    pager : "#grid_page",
    sortname : 'name',
    viewrecords : true,
    sortorder : "desc",
    shrinkToFit: false,
    rownumbers: true,
    altRows:true,
    caption: "Sample Grid"
});

この問題には 3 つの症状があります。

1、このグリッドには 35 を超える列があり、各列の幅は 100 PX を超えており、このグリッドの幅は 1000 PX に固定されているため、ユーザーがすべての列を表示できるようにグリッドにスクロール バーが表示されます。（ご覧のとおり、グリッドの幅と高さを固定値で設定しています）

2, このグリッドは最初はうまく機能しますが、2 回目以降の更新ではヘッダーとコンテンツが失われます。

3、幅の設定にコメントしようとしています。つまり、このグリッドに幅を設定していません。最初でも2回目でも問題なく動作しますが、グリッドの幅はすべての合計です列（3500PX）、ページ全体を醜く拡大します。

grid= jQuery("#grid_id").jqGrid({
    data : response.list,
    datatype : "local",
    colNames : columnNames,
    colModel : [ {....}],                       
    rowNum : 30,
    // width : $("#grid_id").width(), COMMENT it.
    height: $("#grid_page").height(),
    rowList : [ 30, 100, 150 ],
    pager : "#grid_page",
    sortname : 'name',
    viewrecords : true,
    sortorder : "desc",
    shrinkToFit: false,
    rownumbers: true,
    altRows:true,
    caption: "Sample Grid"
});

だから私が聞きたい質問は、幅と高さをjQuery JQGridに設定するための最良の解決策は何ですか? それらをグリッドにどのように設定する必要がありますか?

簡単に言えば、多くの列を持つグリッドを X スクロールバーで動作させるにはどうすればよいでしょうか?

4

1 に答える 1

3

何度か試した後、この問題を解決しました。私の場合、グリッドの幅と高さを固定し、列が多すぎるときに水平スクロールバーを表示する必要がある場合は、次のように jqGrid を設定します。

grid= jQuery("#grid_id").jqGrid({
    width : 1000,
    height: 800,
    shrinkToFit: false,
});

グリッドが問題なく動作することを確認する最も重要なことは、グリッドが接続するテーブルに THML 構成 'align="center"' を追加する必要があることです。

<table id="grid_id" align="center"></table>

なぜこれで解決するのかわかりませんが、とにかく動作します。

于 2012-11-07T08:55:28.900 に答える