グリッドビューの行にCSSを選択的に適用する

Question

データバインドアイテムのプロパティに基づいて、 GridView の個々の行にCSSクラスを選択的に適用する方法を探しています。

e.g。：

GridViewのデータソースは SummaryItems の汎用リストであり、 SummaryItem にはプロパティ ShouldHighlight があります。 ShouldHighlight == true の場合、関連付けられた行のCSSは highlighted

に設定する必要があります

アイデアはありますか

Answer 1

非常に簡単

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        DataRowView drv = e.Row.DataItem as DataRowView;
        if (drv["ShouldHighlight"].ToString().ToLower() == "true")
            e.Row.CssClass = "highlighted";
    }
}

DataTableをデータソースとして使用する場合

、上記のコードは機能します

変更先：

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        myClass drv = (myClass)e.Row.DataItem;
        if (drv.ShouldHighlight)
            e.Row.CssClass = "highlighted";
    }
}

ジェネリックを使用する場合の上記の例のみ：

public class myClass
{ 
    public Boolean ShouldHighlight
    { get; set; }
}

ジェネリック（リスト、辞書など）を使用している場合

留意点：

e.Row.dataItem

常に行を移入するオブジェクト全体を返すため、ここからウェブページ内のデータの外観を簡単に操作できます。

RowDataBoundイベントを使用する必要があります。このイベントは、データが行オブジェクトにアタッチされた後にトリガーされますが、ページにHTMLコードがまだ書き込まれていないため、ShouldHighlight値を確認できます（文字列に変換したため、型がわかっている場合は、ブール値であることがわかっている場合は変更できます。

このコードは、megakempコードよりもはるかに高速で実行されるため、Listオブジェクトを作成せず、各行のデータソース全体が入力されます...

PS このウェブサイトをご覧ください、GridViewオブジェクトを使用してプロジェクトのチュートリアルをいくつか見つけることができます

Answer 2

留意する必要があることの1つは、RowCreatedまたはRowDataBoundイベントハンドラーでRow.CssClassプロパティを設定すると、グリッドレベルで適用したデフォルトスタイルがオーバーライドされることです。 GridViewでは、次のようなプロパティを介して行スタイルに簡単にアクセスできます。

gvGrid.AlternatingRowStyle.CssClass = ALTROW_CSSCLASS
gvGrid.RowStyle.CssClass = ROW_CSSCLASS

ただし、この場合のニーズのように、CssClass値を特定の行に割り当てると、割り当てはグリッドレベルでのトップレベルの割り当てを無効にします。割り当ては「カスケード」しません。好きなように。したがって、最上位クラスの割り当てを保持し、独自のより具体的なレイヤーを作成する場合は、rowStateをチェックして、処理している行の種類を確認し、それに応じてクラス名を連結する必要があります

If(item.ShouldHighlight)
 {
    If(e.Row.RowState == DataControlRowState.Alternate)
    {
        e.Row.CssClass = String.Format("{0} {1}", "highlight", ALTROW_CSSCLASS)
    }
    else
    {
        e.Row.CssClass = String.Format("{0} {1}", "highlight", ROW_CSSCLASS)
    }


}