Features

スタイル

スタイル

このサンプルは、組み込みのクラス名をCSSルールで使用して、レコード区切りとグループ区切りの外観をカスタマイズする方法を示します。

機能

説明

多くのアプリケーションでは、各レコードやグループがどこで始まりどこで終わるかを示しておくのが普通です。
MultiRowコントロールは、グループごとに最初と最後の行/列にあるセル要素にCSSクラス名を追加することで、これを可能にしています。
使用するクラス名は、wj-record-start、wj-record-end、wj-group-start、wj-group-endです。

この例は、これらのクラス名をCSSルールで使用して、レコード区切りとグループ区切りの外観をカスタマイズする方法を示します。
また、標準のCssClassプロパティを使用して、グループ内の特定のセルをカスタマイズする方法も示します。

using System.Web.Mvc;
using System.Collections.Generic;
using MultiRowExplorer.Models;

namespace MultiRowExplorer.Controllers
{
    public partial class MultiRowController : Controller
    {
        public ActionResult Styling()
        {
            return View(Orders.GetOrders());
        }
    }
}
@model IEnumerable<Orders.Order>

@section Styles{
    <link rel="stylesheet" href="~/Content/css/CustomMultiRow.css" />
}

@(Html.C1().MultiRow<Orders.Order>()
    .Id("stylingMultiRow")
    .Bind(bl => bl.Bind(Model).DisableServerRead(true))
    .CssClass("multirow multirow-css")
    .LayoutDefinition(LayoutDefinitionsBuilders.ThreeLines)
)

@section Summary{
<p>@Html.Raw(Resources.MultiRowExplorer.Styling_Text0)</p>

}

@section Description{
<p>@Html.Raw(Resources.MultiRowExplorer.Styling_Text1)</p>

<p>@Html.Raw(Resources.MultiRowExplorer.Styling_Text2)</p>

}