Pulsanti di default, focus sui controlli e inibizione del PostBack con ASP.NET 2.0

di Cristian Civera, in UserScript, ASP.NET 2.0, Web Controls,

Ogni pagina ASP.NET per poter usufruire della programmazione lato server e degli eventi deve contenere un elemento

. E' un controllo fondamentale perché tramite il POST vengono inviati i valori di ogni tag input, visibili o meno.

Lo standard HTML prevede che il tag input di tipo submit sia univoco e che l'uso del pulsante "invio" ne simuli la pressione.

Purtroppo ASP.NET demanda il rendering HTML ai controlli e in caso di più Button, sono presenti più controlli di submit. Il browser deve decidere quale prevale sugli altri e lo fa scegliendo il primo che incontra nell'HTML.

Possiamo però forzare questo comportamento mediante la proprietà DefaultButton indicando lo UniqueID (l'ID concatenato con gli ID dei padri separato da : o $) del pulsante che vogliamo rendere predefinito. Il motore intercetterà l'evento client OnKeyPress per gestire da JavaScript la pressione.
Possiamo inoltre indicare qual è il controllo che ottiene il focus appena caricata la pagina. Solitamente è una textbox dalla quale l'utente deve partire e si ottiene impostando DefaultFocus con lo UniqueID del controllo.

<form id="form" runat="server" DefaultButton="Button2" DefaultFocus="txt1">
<p><asp:TextBox ID="txt1" runat="server" /></p>
<asp:Button ID="Button1" Text="Bottone 1" runat="server" />
<asp:Button ID="Button2" Text="Bottone 2" runat="server" />
</form>

E' spesso utile evitare che l'utente prema più volte il pulsante di submit, così da non avere record duplicati nel database. Questo è possibile estendendo con poche righe il controllo HtmlForm e riscrivendo la funzione JavaScript __doPostBack:

public class MyForm : HtmlForm
{
  protected override void OnPreRender(EventArgs e)
  {
    base.OnPreRender(e);

    if (this.Page != null)
      this.Page.ClientScript.RegisterStartupScript(this.GetType(),
                    "DisablePostbackControl",
                    "var f = __doPostBack;\r\n__doPostBack = function(eventTarget, eventArgument){f(eventTarget, eventArgument);\r\nWebForm_GetElementById(eventTarget).disabled = true;};\r\n", true);
  }
}

Basta sostituire la form originale con la nostra ed otteniamo la disabilitazione automatica del controllo che scatena l'evento:

[code lang="aspx"]<%@ Register TagPrefix="ASPItalia" Namespace="ASPItalia.com.Scripts" %>
<ASPItalia:MyForm id="form" runat="server" DisablePostbackControl="true">
</ASPItalia:MyForm>

La funzione __doPostBack provoca il submit della form ed è utilizzata da qualsiasi controllo che non faccia utilizzo del tag input. Dobbiamo quindi forzare i button ad utilizzare sempre questa funzione tramite la proprietà Button.UseSubmitBehavior.

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