2

WebGrid に 2 行のヘッダーを含める方法はありますか?

ヘッダーのカスタム レンダリングを行う方法、またはテーブルの本体のみを (テーブル タグなしで) レンダリングする方法を探しましたが、何も見つかりませんでした。

次のような webgrid を作成したいと思います。

-------------------------------------------
|grouped cols                |grouped cols|
-------------------------------------------
|col1 |  col2 | col3 | col4  | col5 |col6 |
-------------------------------------------
-------------------------------------------
|d1   |  d2   | d3   | d4    | d5   |d6   |
-------------------------------------------
|d1   |  d2   | d3   | d4    | d5   |d6   |
-------------------------------------------
|d1   |  d2   | d3   | d4    | d5   |d6   |
-------------------------------------------

私はmvc3を初めて使用することに注意してください(そのため、明らかな解決策を見逃す可能性があります)。

4

2 に答える 2

4

サーバー側のソリューション:

@(new HtmlString(grid.GetHtml(Your grid definition).ToHtmlString()
    .Replace("<thead>",""<thead><tr class='webgrid-header'><th scope='col' colspan='4'>cols 1 to 4</th><th scope='col' colspan='2'>cols 5 and 6</th></tr>")))

クライアント側 (ビューに Web グリッドが 1 つだけあると仮定すると、jquery を使用できます):

@Scripts.Render("~/bundles/jquery")
<script>
    $(function () {
        var th = $("<tr class='webgrid-header'><th scope='col' colspan='4'>col 1 to 4</th><th scope='col' colspan='2'>col 5 and 6</th></tr>")
        $("thead").prepend(th);
    });
</script>
于 2013-09-12T15:42:36.830 に答える
0

html要素でビルドできます。セルをグループ化するには、colspan と rowspan を使用する必要があります。このリンクを見てください。

于 2013-07-01T07:11:33.670 に答える