3
  @if (Model.ActivityCollection.Count > 0)
        {
        var grid = new WebGrid(source: Model.ActivityCollection, rowsPerPage: 12, canSort: false);   
            @grid.GetHtml(tableStyle: "webGrid",
            headerStyle: "header",
            alternatingRowStyle: "alt",
            columns: grid.Columns(
            grid.Column("EffectiveDate", "Effective Date", style: "date"),
            grid.Column("PremiumPaymentAmount", "Premium Payment Amount", style: "amount"),
            grid.Column("PaymentType", "Payment Type", style: "date")
           ));
        }
else
        {

        }

上記のelseステートメントで、Webグリッド内に「支払い情報が見つかりません」というメッセージを表示したいと考えています。誰かがこれで私を助けることができますか?

4

3 に答える 3

6
<div class="grid" style="margin-left:5px;" id="grid">          
        @if (Model.ActivityCollection.Count > 0)
        {
            var grid = new WebGrid(source: Model.ActivityCollection, rowsPerPage: 12, canSort: false);   
            @grid.GetHtml(tableStyle: "webGrid",
            headerStyle: "header",
            alternatingRowStyle: "alt",
            columns: grid.Columns(
            grid.Column("EffectiveDate", "Effective Date", style: "date"),
            grid.Column("PremiumPaymentAmount", "Premium Payment Amount", style: "amount"),
            grid.Column("PaymentType", "Payment Type", style: "date")
           ));
        }
        else
        {
            <div class="grid">
            <table cellspacing="0" width="80%">
               <thead>
                    <tr>
                        <th>Effective Date</th>
                        <th>Premium Payment Amount</th>
                        <th>Payment Type</th>
                        </tr>
                </thead>
                <tbody>
                 <tr>
                        <td colspan="3" align="center" ><br />No payment information found<br /><br /> </td>
                 </tr>                     
                </tbody>
            </table>
            <br/><br/><br/><br/>
            </div>
        }
        </div>
于 2011-07-26T18:44:17.333 に答える
3

グリッドが読み込まれたときにこの jQuery 関数がトリガーされるようにしました。テーブルにデータがない場合は、空のテーブルに新しい行を挿入してテキストを表示します。HTML で WebGrid のレプリカを構築するよりもはるかに扱いやすい。

行を識別するために、Webgrid に行スタイルを追加しました (ヘッダーとフッターは必要ありません): "webGridDataRow"。

function addNoDataTextIfNeeded(){
    if($(".webGrid .webGridDataRow").length < 1){ //if there are no data-rows in table, our text should be displayed
        var newCell = $("<td>") //create the cell
            .attr("colspan", $(".webGrid tr:first th").length) //set colspan so it will span entire grid width (counting the number of column headers)
            .text("No data found"); //add the text to be displayed
        $("<tr>").append(newCell).appendTo(".webGrid"); //add the cell to a row to the grid :)
    }
}
于 2012-09-24T12:02:21.000 に答える