ATLAS: La potenza di ASP.NET 2.0 al servizio di AJAX

di Stefano Mostarda, in ASP.NET 2.0,

Cos'è ATLAS

Dal momento in cui è stato coniato il termine AJAX (marzo 2005), questo modo di sviluppare ha avuto una crescita esponenziale a tal punto che colossi come Google, Yahoo e Hotmail hanno scelto di utilizzarlo per migliorare i propri servizi. In particolar modo Google ha utilizzato nella maniera più disparata questa tecnica: basta pensare a Google Suggest e GMail per citare le applicazioni più famose. A questo punto, Microsoft ha deciso di sviluppare un proprio framework in grado di abilitare scenari AJAX nelle applicazioni ASP.NET 2.0 denominandolo ATLAS.

Le fondamenta

AJAX ha reso più forte il concetto di programmazione client-centric, ovvero quel paradigma che sposta parte della logica sul client. Infatti, grazie ad un accesso senza postback al server, alcuni comportamenti sono realizzabili direttamente in Javascript. Alcune elaborazioni come il calcolo del codice fiscale non sono peraltro realizzabili unicamente sul client a meno che non si scarichi la lista completa dei comuni e del loro codice. Questo paradigma contrasta con il modello di sviluppo Server-Centric dove la logica risiede completamente sul server ed il client è solo uno strumento che ne sfrutta la logica. La necessità di eseguire elaborazioni "miste" ha portato alla realizzazione di una piattaforma che permette lo sviluppo di feature sia sul client che sul server. La naturale conseguenza è stata la creazione di due distinti framework: uno javascript per il client e uno .NET per il server.

Framework Client

Il framework client di ATLAS è ovviamente sviluppato in javascript. Questo linguaggio non condivide nulla con Java se non la sintassi e le prime quattro lettere del nome. In javascript non esiste un supporto per la programmazione ad oggetti dovendo così rinunciare ad ereditarietà, polimorfismo, interfacce ed altre caratteristiche tipiche dell'OOP. Il primo obiettivo del framework client è quello di introdurre questi concetti in javascript permettendo così la realizzazione di classi che possono servire a diversi scopi.

Proprio grazie al framework, con ATLAS sono state sviluppate classi e controlli che offrono una sintassi molto simile a quella che si usa quando si programma sul server. Tra queste classi ce ne sono alcune che non esistono di base (StringBuilder, Timer) o che espongono solo un set limitato di funzioni (String, Array). Ci sono controlli non visuali come Validators e Bindings, e controlli visuali come TextBox, Label, Select, ecc. che fanno da wrapper ai controlli html e controlli che rientrano in una categoria a parte come quelli per il databinding.

La più grande novità del framework client sta nella nuova sintassi XML-SCRIPT. Questo è un markup tramite il quale si possono definire in maniera dichiarativa alcuni comportamenti dei controlli presenti sulla pagina.

XML-SCRIPT

Quando si devono effettuare operazioni sul browser, si deve ricorrere al javascript. Molto spesso queste operazioni sono sempre le stesse (controlli di validità dei campi, per esempio) e si possono sfruttare metodi predefiniti. L'XML-SCRIPT rappresenta un metodo che permette di definire operazioni di uso frequente in maniera dichiarativa eliminando la necessità di scrivere codice, dato che a runtime il framework client esegue il parsing dello script e genera automaticamente il codice corrispondente.

Binding

I binding sono una modalità per collegare tra loro due proprietà di due controlli. Ad esempio, si può collegare la proprietà Enabled di una TextBox con la proprietà Checked di una CheckBox. Questo può essere fatto sia in modalità dichiarativa, tramite XML-SCRIPT, che in modalità programmatica tramite Javascript.

XML-SCRIPT:

<checkBox id="checkBoxId" />
<textBox id="TextBoxId">
  <bindings>
    <binding dataContext="checkBoxId" dataPath="checked" property="enabled" transform="Invert" direction="In"/>
  </bindings>
</textBox>

JAVASCRIPT:

var txt = new Sys.UI.TextBox("TextBoxId");
var chk = new Sys.UI.CheckBox("CheckBoxId");

var binding = new Sys.Binding();
binding.set_dataContext(chk);
binding.set_dataPath("Checked");
binding.set_property("Enabled");
binding.set_direction(Sys.BindingDirection.In);
binding.transform.add(Sys.BindingBase.Transformers.Invert);

txt.get_bindings().add(binding);

txt.initialize();
chk.initialize();

Entrambi gli script eseguono il binding tra due proprietà di due controlli: il primo in maniera dichiarativa, il secondo in maniera programmatica. La proprietà Enabled della TextBox è inversa alla proprietà Checked della CheckBox, quindi se una e true, l'altra è false e viceversa. Questo avviene perché nel binding è stato inserito un transformer di tipo Invert che permette appunto di invertire il binding (utile per proprietà di tipo boolean). Esistono altri Transformer predefiniti che permettono di eseguire operazioni aritmetiche o di modificare la stringa quando si fa il binding tra proprietà di tipo Text. Per offrire la massima personalizzazione, è stata inserita la possibilità di invocare metodi custom durante la fase di Binding.

Validator

I Control Validator di ASP.NET coprono tutte le esigenze di validazione di una pagina quando si tratta di prevenire un postback con dati errati. Questi controlli, però, non coprono tutte le esigenze di validazione. Infatti, ci sono casistiche in cui si devono eseguire operazioni sul client senza postback, ma col bisogno di una validazione. Un esempio è quello di una ListBox che viene popolata con indirizzi email inseriti, uno alla volta, in una textbox. Al momento del click del bottone che popola la listbox, occorre effettuare due tipi di controlli sul dato inserito: uno di obbligatorietà ed uno di validità sintattica della email. Essendo queste operazioni fatte in javascript, non c'è postback al server e quindi non c'è modo di usare i validator standard.

ATLAS copre questo "buco" inserendo dei propri validator. Esistono validator per controllare l'obbligatorietà di un campo, il tipo, il range in caso si tratti di un campo numerico e la validità sintattica tramite RegularExpression. In aggiunta, è possibile utilizzare metodi personalizzati per effettuare validazioni custom. Così come per i binding, anche per i validator è possibile utilizzare o il codice XML-SCRIPT o javascript.

HTML:

<input type="text" id="txt"/>
<span id="lblError">*</span>

XML-SCRIPT:

<textBox id="txt">
  <validators>
    <requiredFieldValidator errorMessage="Il campo non può essere vuoto" />
  </validators>
</textBox>
<validationErrorLabel id="lblError" associatedControl="txt" />

HTML:

<input type="text" id="txtCustom"/>
<span id="lblCustom">*</span>

XML-SCRIPT:

<textBox id="txtCustom">
  <validators>
    <requiredFieldValidator errorMessage="Campo obbligatorio" />
    <customValidator validateValue="validationEvent" errorMessage="Campo errato" />
  </validators>
</textBox>
<validationErrorLabel id="lblCustom" associatedControl="txtCustom" />

CUSTOM JAVASCRIPT:

function validationEvent(sender, eventArgs) {
  eventArgs.set_isValid(true);
}

Nel primo esempio, viene inserito un validator per controllare l'obbligatorietà di un campo e la label per visualizzare il messaggio di errore. Nel secondo viene utilizzato un CustomValidator che invoca un metodo custom per effettuare la validazione. Quando si usano i validator, bisogna tenere in considerazione la proprietà ErrorMessage poichè la label visualizza il messaggio di errore non come testo, ma come tooltip.

5 pagine in totale: 1 2 3 4 5
Contenuti dell'articolo

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