24

Webサービスからレコードが返されたときにのみjqGridを表示しようとするとかなりの時間がかかります。キャプションバーしか見えないところまで折りたたんではいけませんが、それが最善の方法であれば、キャプションに意味のあるメッセージを入れることができると思います。それでも、グリッドを非表示にして、「レコードが見つかりません」というメッセージdivブロックを表示したいだけです。

また、最悪の事態が発生した場合、この質問の解決策を実行できると思います。データがないという情報をjqGridに表示するにはどうすればよいですか。（他の人のための代替の可能な解決策として含まれているリンク）。

関数からデータをロードするときに使用される関数とGRIDCOMPLETEイベントの両方で.hide（）を実行しようとしましたが、どちらもグリッドを非表示にすることはできませんでした。jqGridの使用にかなり慣れていないことは言うまでもなく、私はJQueryにかなり慣れていません。

$(document).ready(function() {
    $("#list").jqGrid({
        url: 'Service/JQGridTest.asmx/AssetSearchXml',
        datatype: 'xml',
        mtype: 'GET',
        colNames: ['Inv No', 'Date', 'Amount'],
        colModel: [
            { name: 'invid', index: 'invid', width: 55 },
            { name: 'invdate', index: 'invdate', width: 90 },
            { name: 'amount', index: 'amount', width: 80, align: 'right' }],
        pager: jQuery('#pager'),
        postData: { "testvar": "whatever" },
        rowNum: 10,
        rowList: [10, 20, 30],
        sortname: 'id',
        sortorder: "desc",
        viewrecords: true,
        imgpath: 'themes/sand/images',
        caption: 'My first grid',
        gridComplete: function() {
            var recs = $("#list").getGridParam("records");
            if (recs == 0) {
                $("#list").hide();
            }
            else {
                alert('records > 0');
            }
        }
    });

    ...

    <table id="list" class="scroll"></table> 
    <div id="pager" class="scroll" style="text-align:center;"></div>

そしてこれも試してみました：

$(document).ready(function() {
    $("#list").jqGrid({
        datatype: function(postdata) {
            jQuery.ajax({
                url: 'Service/JQGridTest.asmx/AssetSearchXml',
                data: postdata,
                dataType: "xml",
                complete: function(xmldata, stat) {
                    if (stat == "success") {
                        var thegrid = $("#list")[0];
                        thegrid.addXmlData(xmldata.responseXML);
                        var recs = $("#list").getGridParam("records");

                        if (recs == 0) {
                            $("#list").hide();
                            alert('No rows - grid hidden');
                        }
                        else {
                            alert(recs);
                        }
                    }
                    else {
                        alert('FAIL');
                    }
                }
            });
        },
        mtype: 'GET',
        colNames: ['Inv No', 'Date', 'Amount'],
        colModel: [
            { name: 'invid', index: 'invid', width: 55 },
            { name: 'invdate', index: 'invdate', width: 90 },
            { name: 'amount', index: 'amount', width: 80, align: 'right' }],
        pager: jQuery('#pager'),
        postData: { "testvar": "whatever" },
        rowNum: 10,
        rowList: [10, 20, 30],
        sortname: 'id',
        sortorder: "desc",
        viewrecords: true,
        imgpath: 'themes/sand/images',
        caption: 'My first grid'
    });

    ...

    <table id="list" class="scroll"></table> 
    <div id="pager" class="scroll" style="text-align:center;"></div>

あなたが提供できるどんな助けにも感謝します。

4

10 に答える 10

36

jqGrid はテーブルを特別なソースと div でラップするので、非表示にできる独自の div でそのテーブルをラップすることで、必要なことを実行できるはずです。

 <div id="gridWrapper">
    <table id="list" class="scroll"></table> 
 </div>

次に、gridComplete で:

   gridComplete: function() {
        var recs = parseInt($("#list").getGridParam("records"),10);
        if (isNaN(recs) || recs == 0) {
            $("#gridWrapper").hide();
        }
        else {
            $('#gridWrapper').show();
            alert('records > 0');
        }
    }

お役に立てれば。

于 2009-07-22T20:06:23.097 に答える
6

セスのソリューションを少しひねります：

  1. var recs = $('#list').jqGrid('getGridParam',' records ');の代わりに使用できます。

    var recs = $('#list').jqGrid('getGridParam','reccount');

    jqGrid グリッド オプション ' records ' デフォルト値 = 'None'

    jqGrid グリッド オプション ' reccount ' のデフォルトは 0 で、レコードがない場合でも常に数値を返します (0 を返します)

    wiki:options @ jqGrid Wikiを参照してください。

  2. ラッピング div を使用したくない場合は、 $('.ui-jqgrid').hide()またはを使用して jqGrid 全体を非表示にできます$('.ui-jqgrid').show()。

    ui-jqgrid クラスは jqGrid 親にのみ使用されます。

于 2010-10-28T15:18:40.323 に答える
5

私はこれを見つけています：

parseInt($("#grid").getGridParam("records"),10);

「NaN」を返しています。グリッドにレコードがない場合、"records" プロパティは null に設定されます。したがって、それを数値にキャストしてゼロに等しいかどうかを確認することはできません。

于 2009-10-22T01:29:24.133 に答える
1

このメソッドを使用してjqGridを非表示にしてみてください。

$("#someGridTableName").jqGrid("GridUnload");


jquery.jqGrid-xxx / src/grid.custom.jsファイルを必ず含めてください。

上記の方法について詳しく説明しているこの投稿を参照してください。または、セクションでこのメソッドについて説明しているjqGridwikiAdd on Grid Methods。

考慮すべきもう1つのポイント：グリッド列を手動で広くしてラッパーdivの幅を超えようとすると属性が機能しないため、jqGridで
ラッパー（postを参照）<div>タグを使用して非表示にすることは避けてください。言い換えると、jqGridには、外部divを使用せずに水平スクロールバーを作成するロジックがすでに装備されています。 overflow: auto;

注： IE8および9でテスト済み

于 2013-03-12T22:52:05.287 に答える
1 
<!-- table for Pagination START -->
<table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td>
            <div id="pager" class="scroll" style="text-align: right;" />
        </td>
    </tr>
</table> 
<!-- table for Pagination END -->
<table id="tblCompany" class="scroll" width="100%" cellpadding="0" cellspacing="0">
</table>
<div id="NoRecord" class="NoRecord">
    <%: CommonText.NoRecords %>
</div>

JqG​​rid レコードなしチェック

gridComplete: function () {
    var recs = $("#").getGridParam("records");
    if (recs == 0 || recs == null) {
        $(tableContacts).setGridHeight(100);
        $("#NoRecordContact").show();
    }
}
于 2010-09-08T07:04:03.747 に答える
0

jqgrid を作成する以下のタグがあるとします。

<div id=jqgridcontent>
<table id="jqgridtab"></table>
</div>

jqgrid コードの js スクリプトで、loadcomplete オプションを次のように変更できます。

loadComplete: function () {

if(jQuery("#jqgridtab").getDataIDs().length==0){
            noDataError();
        }
    }

noDataError の定義は次のようになります。

function noDataError(){
       document.getElementById("jqgridcontent").style.visibility="hidden";
       document.getElementById("jqgridcontent").style.display="none"; 
}
于 2014-06-05T06:24:58.127 に答える
0

グリッドの定義に「キャプション」オプションを含めなくても十分です。バージョン 5.0.1 でテスト済み

于 2016-10-27T19:48:17.673 に答える