Creiamo la nostra prima applicazione in Ajax (Parte II-1)
Pagina 1 di 2
Fino ad ora abbiamo visto i concetti base dell'xml, perdarvi le basi concettuali prima di iniziare a costruire lanostra widget finale. Da questo tutorial in poi inizieremo adaddentrarci nella parte più "Ajax" ,mostrando a fondo le varie possibilitàdell'oggetto xmlhttprequest, per arrivare finalmente amettere in piedi la nostra prima webapp. Per scaricare tuttigli esempi che utilizzeremo, cliccate qui. Trattandosi di unsolo file.zip contenente tutti gli esempi, sappiate che inomi di file che troverete in questo articolo - in corsivovicino ai vari esempi - vi indicano il nome del file alquale si riferiscono.
Fino ad ora abbiamo semplicemente generato un menu da un filexml, importandolo in un documento. Adesso iniziamo a renderela cosa un po' più complessa.
In questo prossimo esempio modificheremo il nostro casestart_up di modo da dire al browser di caricare il filenavigazione.xml tramite XMLHttpRequest. Eccovi il codicemodificato:
case "start_up": ajaxTester('load_page', 'navigation.xml', 'contentAjx');break; Tutto il resto dello script rimane immutato. Vediamo ora comeapparirà il nostro file xml incaricato di contenere lanostra navigazione:
<?xml version="1.0" encoding="UTF-8"?> <menu> <item id="menutest"><ul xmlns="http://www.w3.org/1999/xhtml"> <li><a xhref="http://www.ajaxcity.it/" tabindex="10">AjaxCity.it</a></li><li><a xhref="http://filosovita.splinder.com" tabindex="10" class="menu">filosovita!</a></li> <li><a xhref="https://www.webmasterpoint.org" tabindex="10" class="menu">WebMasterPoint.org</a></li> </ul> </item></menu>
Come potete notare abbiamo utilizzato alcuni markups html perdefinire una lista. Va specificato che per un parser xml, ilfile verrà comunque considerato come xml puro. Conquesto vogliamo solo spiegarvi che non esiste in questo casodifferenza tra come viene considerato un tag div o pippo inun file xml. Per chiarirvi meglio la situazione, eccovi degliesempi. Il primo esempio controlla cosa accade quando noifacciamo puntare il browser ad un file xml. per vederel'esempio cliccate qui[file_nav2.xml].
Come vedete, il browser parsa il documento senza riconoscerein alcun modo i tags html presenti nella strutturadell’xml; nessun markup quindi viene applicato ed ildocumento non è formattato come una lista. Vediamo oracosa accade quando aggiungiamo un namespace xhtmlall’interno di un tag <ul> nel nostro file xml(attenzione: non funziona con iexplore, a meno che nonabbiate installato il parser proprietario dimiscrosoft…no comment…):
<ul xmlns="http://www.w3.org/1999/xhtml">
Il documento ora è formattato come lista,esattamente come da nostra esigenza. Questo accadeperché il namespace permette al browser di intepretarei tags e renderizzare la pagina di conseguenza, come poteteosservare qui [file_nav3.xml] [purtroppo tenete amente il problema su Iexplore]. Comunque, una voltacaricato il documento l’xml nella nostra interfaccia,diventa semplicissimo applicare stylesheets come in undocumento html ;). Potete vedere il risultato finale qui[xmlbase_1.html]
- Articolo precedente Un carrello elettronico per l'e-commerce in Ajax
- Articolo successivo Connessione ad un database MySql
