Modifier la couleur de la ligne en fonction de la valeur d'une colonne dans la ligne

Question

J'ai une sqldatasource qui charge les données de mon serveur et les place dans une grille de données.

J'ai une colonne nommée clnumber qui a, les numéros 1,2,3

Ce que je veux que chaque ligne ont une couleur différente en fonction du nombre est dans cette colonne de datarow

C'EST lE CODE I USED

$(document).ready(function() { 

    $("#<%=GridView1.UniqueID%> tr").each(function() { 

     var number = $(this).children('td:eq(6)').text(); 

     if (number == 'OK') { 
      $(this).children('td').css({ "background-color": "lightgreen" }); 

     } 
    }) 
}); 

Answer 1

Accordée que vous avez donné votre gridview une classe css appelée « myGridView », vous pouvez faire ce qui suit: Où 'td: eq (1)' fait référence à la deuxième cellule d'une rangée. Cela dépendra bien sûr de la cellule de votre rangée qui contient ce nombre magique.

Je suis certain que ce n'est pas l'utilisation la plus élégante de jQuery, mais vous pouvez factoriser comme vous le souhaitez

Answer 2

en fonction du nombre comment?
Première rangée blanche, deuxième gris?

if(rownumber%2 == 0) //white 
else //grey 

ou l'inverse.

Answer 3

Si le nombre qui dicte quelle couleur doit être utilisée est réellement généré dans la sortie HTML, pourquoi ne pas utiliser javascript?

Answer 4

Vous pouvez utiliser semblable à ceci:

/// <summary> 
    /// Updates the row fore colour to show the line type 
    /// </summary> 
    /// <param name="sender">object</param> 
    /// <param name="e">args</param> 
    protected void gvLineValues_RowDataBound(object sender, GridViewRowEventArgs e) 
    { 
     try 
     { 
      //Format the row 
      this.FormatRow(e); 
     } 
     catch (Exception ex) 
     { 
      ErrorLogging.LogError(ex); 
     } 
    } 

    /// <summary> 
     /// Formats a gridview row 
     /// </summary> 
     /// <param name="e">Gridview event args</param> 
     private void FormatRow(GridViewRowEventArgs e) 
     { 
      try 
      { 
       //Change the forecolor of the row 
       if (e.Row.RowType == DataControlRowType.DataRow) 
       { 
        OrderLine oOrderLine = e.Row.DataItem as OrderLine; 

        if (oOrderLine != null) 
        { 
         e.Row.ForeColor = oOrderLine.ForeColour; 


           //Check the line is over budget 
           if (oOrderLine.OverBudget) 
           { 
            e.Row.BackColor = ColourManager.OverBudgetItemBackColour; 
            e.Row.ToolTip = String.Format("Item over {0} and awaiting your approval", GlobalizationManager.Budget); 
           } 
           else 
           { 
            e.Row.BackColor = ColourManager.WithinBudgetItemBackColour; 
            e.Row.ToolTip = "Item awaiting your approval"; 
           } 
          } 
         } 

         //Change the back colour of the row if its a deleted row 
         if (oOrderLine.Deleted) 
         { 
          e.Row.Font.Strikeout = true; 
          e.Row.ToolTip = "This line has been deleted"; 
         } 
        } 
       } 
      } 
      catch (Exception) 
      { 
       throw; 
      } 
     } 

vous pourriez faire quelque chose comme

switch (DataItem.ColorNumber) 
{ 
case 1: 

e.row.backcolor = Color.blue; 

break; 

case 2: 

e.row.backcolor = Color.red; 

break; 

case 3: 

e.row.backcolor = Color.white; 

break; 

}