Cambiare il colore di sfondo di una cella del DataGrid in base al suo valore

di Daniele Bochicchio, in ASP.NET, C#, DataGrid,

In alcune applicazioni può ritornare utile il differenziare visivamente un ltesto rispetto ad un altro, ad esempio per rendere più visibili le pratiche scadute, i pagamenti non effettuati, etc.
In questo esempio vengono estratti i dati dalla tabella sales del database pubs, mostrati all'interno di un DataGrid.
Viene intercettato l'evento ItemDataBound, che si verifica quando i dati vengono associati al control, e recuperata (per posizione) la terza cella, quella che contiene la data.
Nel caso in cui l'anno sia uguale al 1993 viene cambiato il colore di sfondo.

<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<SCRIPT language="C#" runat="server">
// stringa di conn
string connstring = @"server=localhost;database=pubs;trusted_connection=true;";

void Page_Load () {
   // estrazione dati
   bindData() ;
}

// routine di estrazione dati
void bindData () {
    // connessione
    SqlConnection conn = new SqlConnection(connstring);

    // query
    SqlDataAdapter query = new SqlDataAdapter("SELECT * FROM sales", conn);

    // creo il dataset
    DataSet querydataset = new DataSet();
    query.Fill(querydataset);

   myDataGrid.DataSource = querydataset;
   myDataGrid.DataBind ( );
}

 private void myDataGrid_ItemDataBound(object sender, DataGridItemEventArgs e)
{
  // solo su Item e Alternating Item
  if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem) {

    // recupero il valore della terza colonna
    string valore = ((TableCell) e.Item.Cells[2]).Text;

    if (DateTime.Parse(valore).Year == 1993) {
      e.Item.Style["background-color"] = "yellow";
    }
  }
}

</SCRIPT>
<form runat="server">
<ASP:DataGrid id="myDataGrid" runat="server"
  CellPadding = "3"
  HeaderStyle-BackColor="#336699"
  HeaderStyle-Font-Size="Large"
  EditItemStyle-BackColor="yellow"
  ItemStyle-BackColor="lightsteelblue"
  AlternatingItemStyle-BackColor="lightgray"
  AutoGenerateColumns="true"
  onItemDataBound="myDataGrid_ItemDataBound" />
</form>

Commenti

Visualizza/aggiungi commenti

| Condividi su: Twitter, Facebook, LinkedIn

Per inserire un commento, devi avere un account.

Fai il login e torna a questa pagina, oppure registrati alla nostra community.

Approfondimenti

I più letti di oggi