Appliquez sélectivement css à une ligne dans un gridview

Question

Je cherche un moyen d'appliquer de manière sélective une classe CSS à des lignes individuelles d'un GridView en fonction d'une propriété de l'élément lié aux données.

exemple:

La source de données de GridView est une liste générique de SummaryItems et SummaryItem a une propriété ShouldHighlight . Lorsque ShouldHighlight == true , le code CSS de la ligne associée doit être défini sur en surbrillance

.

des idées?

Answer 1

très facile

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";
    }
}

le code ci-dessus fonctionne si vous utilisez un DataTable en tant que source de données

changer en:

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";
    }
}

juste pour l'exemple ci-dessus lors de l'utilisation de génériques:

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

si vous travaillez avec Génériques (liste, dictionnaire, etc.)

garder à l'esprit:

e.Row.dataItem

retourne toujours l'intégralité de l'objet avec lequel vous remplissez la ligne, il est donc facile de manipuler l'apparence des données dans la page Web.

vous devez utiliser l'événement RowDataBound qui se déclenchera une fois que les données auront été attachées à l'objet ligne mais que le code HTML n'a pas encore été écrit dans la page. Vous pouvez ainsi vérifier la valeur ShouldHighlight (j'ai converti en chaîne car je ne le fais pas connaissez le type, vous pouvez le changer si vous savez que c'est une valeur booléenne).

ce code est beaucoup plus rapide que le code megakemp car vous ne créez pas d'objet List et vous le remplissez avec la source de données complète pour chaque ligne ...

P.S. Consultez ce site Web . Vous pouvez trouver plusieurs tutoriels pour votre projet à l'aide de l'objet GridView

Answer 2

Vous devez garder à l’esprit que la définition de la propriété Row.CssClass dans les gestionnaires d’événements RowCreated ou RowDataBound écrasera tous les styles par défaut que vous avez appliqués au niveau de la grille. GridView vous permet d’accéder facilement aux styles de ligne via des propriétés telles que:

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

Toutefois, lorsque vous affectez une valeur CssClass à une ligne spécifique (comme vous en avez besoin dans ce cas, l'affectation remplace toute affectation de niveau supérieur au niveau de la grille. Les assignations ne seront pas "en cascade". comme nous pourrions les aimer. Donc, si vous voulez conserver l'affectation de classe de niveau supérieur et également une couche plus spécifique, vous devez alors vérifier l'état de la ligne pour savoir quel type de ligne vous traitez et concaténer vos noms de classe en conséquence.

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)
    }


}