Asp.Net visualizzare nel footer di un controllo gridview il totale di una colonna

Riporto l'articolo scritto per il sito http://www.iprogrammatori.it/articoli/programmazione/art_aspnet-applicare-in-un-controllo-gridvie_707.aspx

Descrizione

In questo articolo, vedremo come applicare in un controllo griglia (gridview) una riga dei totali. In particolare, visualizzeremo nel footer di tale controllo il totale di una colonna degli importi, il tutto come mostrato in figura 1. Inoltre nel caso che un importo è negativo, il testo verrà visualizzato di colore rosso.

Figura 1

Formattazione della Griglia

Dopo aver creato un nuovo progetto web, con Visual Studio 2008, inseriamo nella pagina un controllo Gridview. Impostiamo a False, la proprietà autogenerateColumns, sempre nella finestre delle proprietà impostiamo a true la voce Shofooter (figura 2).

Figura 2

Dalla finestra delle proprietà, facciamo click sulla voce columns, ed aggiungiamo due colonne, di tipo boundFiled (figura 3).

Figura 3

La proprietà HeaderTExt, impostiamo il valore Descrizione, stessa cosa per la proprietà DataField, mentre per la proprietà footerText, impostiamo il valore totale, in questo modo, verrà visualizzata nella prima colonna e nella parte inferiore, tale dicitura.

Aggiungiamo un'altra colonna, sempre di tipo boundfield, valorizzando la proprietà HeaderText e DataField, con il valore importo.

A questo punto confermate tutte le modifiche apportate tramite il pulsante ok.

Stesura del codice

Terminata la fase di impostazione del nostro controllo griglia, non ci resta che scrivere il codice per valorizzare la griglia con i totali degli importi.

Nell'evento load della form, inseriamo il codice per caricare dei dati fittizzi. Il datatable, sarà composto da due colonne, nella prima sarà di tipo testo, e ci sarà una descrizione, mentre nella seconda colonna, ci saranno gli importi.

Di seguito si riporta il codice per il linguaggio VB.Net e C#.

VB.Net

'dataTable contenente i dati

Dim dttDati As New DataTable

Dim dtcDescrizione As New DataColumn("Descrizione")

Dim dtcImporto As New DataColumn("Importo")

dttDati.Columns.Add(dtcDescrizione)

dttDati.Columns.Add(dtcImporto)

Dim dtrRiga As DataRow = dttDati.NewRow()

dtrRiga("Descrizione") = "Hard Disk"

dtrRiga("Importo") = 100.3

dttDati.Rows.Add(dtrRiga)

dtrRiga = dttDati.NewRow()

dtrRiga("Descrizione") = "Mouse"

dtrRiga("Importo") = 10.4

dttDati.Rows.Add(dtrRiga)

dtrRiga = dttDati.NewRow()

dtrRiga("Descrizione") = "Crediti precedenti"

dtrRiga("Importo") = -5.2

dttDati.Rows.Add(dtrRiga)

GridView1.DataSource = dttDati

GridView1.DataBind()

C#

//dataTable contenente i dati

DataTable dttDati = new DataTable();

DataColumn dtcDescrizione = new DataColumn("Descrizione");

DataColumn dtcImporto = new DataColumn("Importo");

dttDati.Columns.Add(dtcDescrizione);

dttDati.Columns.Add(dtcImporto);

DataRow dtrRiga = dttDati.NewRow();

dtrRiga["Descrizione"] = "Hard Disk";

dtrRiga["Importo"] = 100.30;

dttDati.Rows.Add(dtrRiga);

dtrRiga = dttDati.NewRow();

dtrRiga["Descrizione"] = "Mouse";

dtrRiga["Importo"] = 10.40;

dttDati.Rows.Add(dtrRiga);

dtrRiga = dttDati.NewRow();

dtrRiga["Descrizione"] = "Crediti precedenti";

dtrRiga["Importo"] = -5.20;

dttDati.Rows.Add(dtrRiga);

GridView1.DataSource = dttDati;

GridView1.DataBind();

A questo punto, nell'evento RowDataBound, verifichiamo se l'importo è negativo, in tale caso sarà applicato un font di colore rosso, e facciamo la somma di tutti gli importi.

Di seguito si riporta il codice da inserire nell'evento rowdatabound

VB.Net

Dim totale As Decimal

Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound

If e.Row.RowType <> DataControlRowType.Header Then

'totali degli importi

If e.Row.RowType = DataControlRowType.DataRow Then

'imposto il testo di colore rosso e faccio la sottrazione

If Convert.ToDecimal(e.Row.Cells(1).Text) < 0 Then

e.Row.Cells(1).ForeColor = Drawing.Color.Red

End If

' aggiungo alla variabile i singoli importi

totale += Convert.ToDecimal(DataBinder.Eval(e.Row.DataItem, "Importo"))

ElseIf e.Row.RowType = DataControlRowType.Footer Then

'Totale

e.Row.Cells(1).Text = "€ " + totale.ToString()

If Convert.ToDecimal(totale) < 0 Then

e.Row.Cells(1).ForeColor = Drawing.Color.Red

End If

e.Row.Font.Bold = True

End If

End If

End Sub

C#

decimal totale;

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)

{

if (e.Row.RowType != DataControlRowType.Header)

{

//totali degli importi

if (e.Row.RowType == DataControlRowType.DataRow)

{ //imposto il testo di colore rosso e faccio la sottrazione

if (Convert.ToDecimal(e.Row.Cells[1].Text) < 0)

{

e.Row.Cells[1].ForeColor = System.Drawing.Color.Red;

}

// aggiungo alla variabile i singoli importi

totale += Convert.ToDecimal(DataBinder.Eval(e.Row.DataItem, "Importo"));

}

else if (e.Row.RowType == DataControlRowType.Footer)

{

// Totale

e.Row.Cells[1].Text = "€ " + totale.ToString();

if (totale < 0)

{

e.Row.Cells[1].ForeColor = System.Drawing.Color.Red;

}

e.Row.Font.Bold = true;

}

}

Conclusioni

Il controllo Gridview, offre molte possibilità di personalizzazioni, in questo caso si è visto come dotare il nostro controllo griglia come un listino di prezzi, e di come mostrare nella parte inferiore del controllo, il totale di tutti gli importi.

Tramite la parola download potete scaricare il file di esempio utilizzato nell'articolo.

Download