#557 - Modificare la status bar dei collegamenti del DataGrid di ASP.NET

Pur non essendo particolarmente flessibile di sicuro il DataGrid è comodo da utilizzare ed offre tante funzionalità facilmente implementabili.
Una delle cose che potrebbe essere migliorata è l'area del pager, ovvero il posto in cui sono contenuti i link alle pagine successive, implementate attraverso LinkButton.
In questo esempio dunque sostituiremo nella barra di stato del browser qualcosa come:

javascript:__doPostBack('myDataGrid:_ctl9:_ctl1','')

con un più chiaro "Pagina 1".

Per farlo è sufficiente intercettare l'evento ItemCreated del DataGrid, verificare che il control creato sia il Pager e quindi fare un ciclo sui controls contenuti.
A questo punto si tratta di aggiungere due attributi per fare in modo che il testo cambi attraverso Javascript, che sono OnMouseOver quando si passa sopra e OnMouseOut quando si esce dall'area, che useremo per ripulire la status bar.

<%@ Page Language="C#"%>
<%@ 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

  if (!IsPostBack)
    bindData() ;
}

// routine di estrazione dati

void bindData () {
  // effettuo il DataBinding sul control

    // 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_ItemCreated(object sender, DataGridItemEventArgs e)
{
// solo se è il pager

if (e.Item.ItemType == ListItemType.Pager) {
  // elenco tutti i controls all'interno

  TableCell pg = (TableCell) e.Item.Controls[0];

  for (int i = 0; i<pg.Controls.Count;i+=2) {
  // intercetto solo i LinkButton

  if (pg.Controls[i].ToString().IndexOf("LinkButton") >=0) {
    LinkButton lb = (LinkButton) pg.Controls[i];
    lb.Attributes.Add("onMouseOver", "window.status='Vai alla pagina " + lb.Text + "';return true;");
    lb.Attributes.Add("onMouseOut", "window.status='';return true;");
  }
  }
}
}

private void myDataGrid_PageIndexChanged(object sender, DataGridPageChangedEventArgs e){

// imposta il numero di pagina

myDataGrid.CurrentPageIndex = e.NewPageIndex;

// effettua di nuovo il binding

bindData();
}

</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"
onItemCreated="myDataGrid_ItemCreated"
AllowPaging="True"
OnPageIndexChanged="myDataGrid_PageIndexChanged"
PageSize="5"
PagerStyle-Mode="NumericPages"
PagerStyle-Font-Bold="True"
PagerStyle-ForeColor="Red"
PagerStyle-HorizontalAlign="Center"
/>

</form>

L'esempio può essere sfruttato al meglio creando un Custom Control che erediti da DataGrid, in modo da rendere di più facile utilizzo questa versione modificata all'interno di più pagine o di più progetti.


Approfondimenti

Commenti

Esprimi il tuo giudizio su questo script:

Per procedere devi essere autenticato.

Aggiungi un nuovo commento »»»
Per inserire un commento, devi registrarti alla nostra community.




IN EVIDENZA
MISC