0

バインドされているアイテムのプロパティに基づいて、特定の css スタイルでテーブルにいくつかの行を設定したいと考えています。CSS を使用してタイガー ストライピングを適用しました。適用したいこの新しい CSS スタイルは、既存のストライピングに追加する必要があります。

@foreach (var item in Model) {
<tr @if(item.IsComplete { class="complete"})>

タイガーストライピングは次の方法で実現されます。

table tr:nth-child(2n+0) {
    background-color: #90b2d3;
    color: white;
}

したがって、他のすべての行は水色で白いテキストである必要がありますが、項目IsCompleteに「完全な」css スタイルが追加されている必要がある行はすべてそれに追加されます。

.complete {
  font-style: italic;
  color: #ccc;
}

これは、グレー表示されて「完全」に見えるようにするだけです。

しかし、私のコードが現在立っているので、私はparser error

パーサー エラー メッセージ: 一致する開始タグのない終了タグ "tr" が見つかりました。開始タグと終了タグのバランスは適切ですか?

私が理解していないの<tr>は、私の最初のコードブロックに存在し、@ IsCompleteかみそりの構文は条件付きで css クラスを含める必要があるということです。

このアプローチは、タイガーストライプが行に色を付け、プロパティがcssクラスを追加することで、そのうちの1つだけが使用されることを意味することを認識しています-私IsCompleteは、ここで構文。ただし、両方のクラスを適用する方法があれば (必要な場合)、それはすばらしいことです。

4

2 に答える 2

2

このようにしてみてください：

<tr@(Html.Raw(item.IsComplete ? " class=\"complete\"" : ""))>

または、カスタム HTML ヘルパーを記述して、タグ スープを回避します。

于 2013-03-11T12:46:00.040 に答える
0

Darin のアドバイスに従って、私は を実装しましたCustom HTML helper。これは主な質問への回答として共有していますが、これはトラのストライピングに取って代わります。そのため、元のトラのストライピングが尊重され、これが既存のクラスに追加されるように、さらに多くの作業を行う必要があります。

public static MvcHtmlString ConditionalCss(this HtmlHelper htmlHelper, 
                                           bool isCompleted, string CssClass)
    {
        var Css = String.Empty;
        if (isCompleted)
            Css = string.Format("class=\"{0}\"", CssClass);

        return MvcHtmlString.Create(Css);
    }

現在、内部の呼び出しは次のようにforeach単純化されています

@foreach (var item in Model) {
<tr @Html.ConditionalCss(item.IsComplete, "complete")>

これにより、少し柔軟性が得られます。css を追加する必要がある場合は、任意の css クラスと条件を指定できます

于 2013-03-11T13:28:51.813 に答える