Salve a tutti,
ammetto la mia ignoranza per quanto riguarda il mondo JavaScript ed in particolar modo JQuery. Fino ad oggi le mie esperienze con AJAX sono state limitate all'uso di determinati framework di presentazione in JAVA che wrappano al loro interno AJAX rendendo Javascript completamente trasparente allo sviluppatore (in pratica forniscono una serie di tag library con cose prefatte)...framework tipo IceFaces, PrimeFaces, JSF per capirsi...

Al momento mi stò trovando a studiare un esempio dello showcase di Spring MVC (un framework Java per creare web application) e tale esempio sembra fare largo uso di JQuery per creare un'interfaccia RIA (quindi sfrutta AJAX)...proprio per questo ho bisogno del vostro aiuto per capire, almeno a grandi linee, come funziona e cosa andarmi a vedere\studiare...dico a grandi linee perchè per il momento sono più interessato a studiare il framework Spring più che JQuery...ora non voglio approfondire più di tanto tale tecnologia ma solo avere dei concetti base per interpretare gli output...

Sostanzialmente questa è l'immagine di come si presenta la mia web application:



Come potete vedere ci sono una serie di tab: "Simple", "Mapping Request", "Obtaining Result Data", etcetc.

Di default siamo quando accediamo alla web application siamo su "Simple".

Dentro al tab "Simple" ho 2 links: "Get /simple" e "Get /simple/revisited"

Clickando su uno di questi link accade che accanto ad esso compare un messaggio di "Hello World", se volete una visione di cosa accade potete vederlo al minuto 1:42 di questo video: http://s3.springsource.org/MVC/mvc-s...screencast.mov

Allora...veniamo a noi...credo che entrambe le cose di cui ho parlato (la creazione del menù a tab ed il far comparire il messaggino di "Hello World" accanto al link una volta che quest'ultimo è stato clickato siano cose implementate tramite JQuery)

In praticolar modo il far comparire una scritta accanto al link dopo averlo clickato, senza ricaricare tutta la pagina, dovrebbe proprio essere un esempio dell'uso di una metodologia AJAX...a grandissime linee credo che per fare questa cosa JQuery vada a modificare il DOM una volta che clicko il link (cioè...più a basso livello il mio esempio funziona così: quando l'utente clicka sul link si genera una HTTP Request verso la risorsa /simple, tale richiesta è mappata dal framework Spring verso un metodo di una classe controllore che semplicemente ritorna la stringa "Hello World" messa all'interno del body della HTTP Response del server, così una volta che tale HTTP Response arriva al cliente...beh suppongo che JQuery la estragga ed inserisca tale stringa accanto al link modificando il DOM...credo...sono supposizioni mie...correggetemi se dico cavolate)

Solo che...non ho idea di come lo faccia e di cosa andarmi a vedere per capirlo...

Questo è il codice della mia pagina home.jsp che fà uso di JQuery (lo ho linkato perchè è lunghetto e non me lo fà inserire all'interno del post): http://andreanobiliphoto.com/storage/java/home.jsp

Come potete vedere ho un div esterno con id="tabs" che contiene una lista non ordinata contenente links a tutti i vari tab del mio menù. Questi link non puntano ad indirizzi reali ma hanno un valore simbolico del tipo: #simple

Poi al di sotto di tale lista non ordinata ho una serie di div che hanno ognuno id uguale ad uno dei "link simbolici" dei vari elementi nella lista non ordinata...e di fatto ognuno di questi link poi conterrà il codice associato ad ogni "pagina" per ogni tab...per essere più concreti:

Dentro l'UL ho un LI che contiene un link simbolico verso #simple, quindi poi avrò un div con id uguale a "simple" che conterrà il codice di ciò che viene visualizzato quando clicko sul link del menu relativo al tab simple.

Credo che questa sia la sintassi di come JQuery implementa questo tipo di menù a tab, giusto?

Ora per quanto riguarda il tab simple ed il suo contenuto ho che sono presenti dei link, ad esempio ho:

codice:
[*]
				">GET /simple
Tale link ha id: "simpleLink", quando clicko su di esso accanto ad esso mi comprare il messaggio di "Hello World", credo che in qualche modo ci sia uno script che modifichi il DOM e che vada a dire: Metti il messaggio di hello world ricevuto nel mody della http response accanto al link avente id="simpleLink"

La domanda è...ma dove stà questo script ?!?! booo

Se vedete verso la fine del codice, dopo la chiusura del div principale avente id "tags" per intenderci" ho una serie di cose di JavaScript che fanno riferimento a JQuery...e penso che il segreto sia là...anche se mi risulta piuttosto oscuro...

Intanto ho qualcosa come:

codice:
<script type="text/javascript" src="<c:url value="/resources/jquery/1.6/jquery.js" />"></script>
<script type="text/javascript" src="<c:url value="/resources/jqueryform/2.8/jquery.form.js" />"></script>
<script type="text/javascript" src="<c:url value="/resources/jqueryui/1.8/jquery.ui.core.js" />"></script>
<script type="text/javascript" src="<c:url value="/resources/jqueryui/1.8/jquery.ui.widget.js" />"></script>
<script type="text/javascript" src="<c:url value="/resources/jqueryui/1.8/jquery.ui.tabs.js" />"></script>
<script type="text/javascript" src="<c:url value="/resources/json2.js" />"></script>