Abilitare la History nel browser per le chiamate AJAX

Ormai sempre più applicazioni web fanno uso della tecnologia AJAX, in quanto essa offre numerosi vantaggi: dall’ottimizzazione del traffico di rete ad una maggior velocità di navigazione. L’uso di questa tecnologia permette sì la navigazione tra contenuti differenti senza effettuare il reload della pagina, ma purtroppo toglie usabilità al sito, in quanto l’utente è portato ad utilizzare il bottone Back del browser per tornare al contenuto precedente, cosa che non avviene se si sta utilizzando AJAX.


Per risolvere questo incoveniente Microsoft ha introdotto, tramite il Service Pack 1 del .NET Framework 3.5, la possibilità di utilizzare i bottoni per la navigazione integrati con il browser per muoversi attraverso l’hystory delle chiamate AJAX.

Come per ogni ASP.NET WebForm che utilizza AJAX, è necessario che nella pagina sia presente lo ScriptManager, dove si andrà ad abilitare l’utilizzo dell’Hystory e ad associare l’evento che dovrà essere scatenato durante la navigazione, come mostrato di seguito:

<asp:ScriptManager ID="ScriptManager1" runat="server" EnableHistory="True" 
    onnavigate="ScriptManager1_Navigate">
</asp:ScriptManager>

Nello snippet seguente viene mostrato come aggiungere un HystoryPoint, e l’evento che viene invocato alla pressione dei tasti Back e Forward del browser.

protected void GridView1_PageIndexChanged(object sender, EventArgs e)
{
    if(ScriptManager1.IsInAsyncPostBack && !ScriptManager1.IsNavigating)
    {
        ScriptManager1.AddHistoryPoint("Gridview1",GridView1.PageIndex.ToString());
    }
}

protected void ScriptManager1_Navigate(object sender, HistoryEventArgs e)
{
    int pageIndex = 0;

    if(string.IsNullOrEmpty(e.State["Gridview1"]))
    {
        GridView1.PageIndex = pageIndex;
    }
    else
    {
        pageIndex = int.Parse(e.State["Gridview1"]);
        GridView1.PageIndex = pageIndex;

        Title = "Paginda del gridview numero:" + (pageIndex + 1);

    }
}

In questo esempio si è optato per l’associazione degli HystoryPoint alla paginazione di un GridView, ma la stessa cosa è applicabile a qualsiasi tipo di chiamata AJAX.


Comments