[Ajax] Gestire il testo di risposta come fosse html

[Shadow976]

Cari utenti,
nella mia web application una funzione Ajax richiama un testo da una classe java. Tutto funziona.

Ora però vorrei che quel testo venisse interpretato come codice html (contiene diversi tag al suo interno, non posso adottare soluzioni alternative per diverse ragioni). Se inglobo il testo di risposta con eval (testodirisposta), non funziona e nella pagina non compaiono gli elementi che vorrei. Come mai? Grazie!

Codice Javascript

var aj_txt = ajax.responseText;
document.getElementById('divEsterno').firstChild.nodeValue = eval(aj_txt);

Testo richiamato:

<div class="subDiv">prova</div>

Ripeto, senza eval il testo si richiama correttamente (il problema è che però vedo i tag "in chiaro") e questo escluderebbe qualunque problema esterno a Javascript. Deve esserci qualcosa che devo fare sul testo prima di passarlo a eval... Forse! Avete suggerimenti?

Grazie

[cavicchiandrea]

prova cosi:

var aj_txt = ajax.responseText;
document.getElementById('divEsterno').firstChild.nodeValue.innerHTML = aj_txt;

[Shadow976]

Sapevo... Avrei però voluto evitare innerHTML!

[cavicchiandrea]

Per motivi religiosi? E comunque è sicuramente meglio di eval che è deprecato, l'alternativa è ricreare i tag con creaElement del dom molto più complesso

[Shadow976]

Le cose si fanno difficili, avrei bisogno di una dritta.

Posto che come sapete le mie intenzioni sono quelle di poter caricare in modo dinamico e via Ajax solo la parte centrale di pagina che l'utente richiederà con una selezione da un menu laterale, andiamo per esclusione per scegliere la miglior soluzione.

1) L'uso dei vari tags include e import (ricordo che sto usando jstl) lo escluderei a priori, agendo questi solo una volta, quando il client richiama la pagina dal server, pagina che viene inviata quindi "tutta intera" con tali tag già valutati, e non essendo certo possibile "rinnovare" la loro azione a pagina già caricata tramite artfizi javascript o altro. O sbaglio?

2) L'uso di innerHTML e di eval è spesso sconsigliato, in quanto non corrisponde agli standard di scrittura di codice e potrebbe dare problemi in diverse occasioni. Nel mio caso dovrei peraltro usare spesso descrizioni di eventi javascript da associare ad alcuni pulsanti e tali contenuti non vanno ad esempio d'accordo con innerHTML associato ad IE. Riguardo eval, come dice Andrea che ringrazio per il tempo dedicatomi, questo comando è addirittura deprecato quindi a maggior ragione sarebbe da evitare.

3) L'uso di Ajax che crea una risposta non testuale ma xml non mi è di alcun aiuto: in tal modo ottengo solo un albero di valori testuali, ossia i valori di ciascun nodo, quando a me per ogni nodo servirebero proprietà, stili, associazione di funzioni js ad eventi, tutte cose che un semplice albero xml non mi permetterebbe di associare a ciascun tag se non creando un sacco di sotto tag specifici per le relative proprietà di ciascun tag principale (a tal punto meglio fare tutto via javascript).

4) L'unica soluzione possibile parrebbe fare tutto da Ajax & Javascript. Ossia, via javascript utilizzare DOM per creare materialmente tutti i tags e gli elementi delle "sotto pagine" da caricare. Sarebbe in assoluto la soluzione più standardizzata e corretta dal punto di vista del codice, nonché la più efficiente ed affidabile.

Se sin qui condividete, ecco come avrei pensato di procedere.

1) Tutto il codice delle sotto pagine sarebbe implicitamente contenuto nelle stesse funzioni javascript; ed a questo punto si capisce che Ajax diventerebbe del tutto inutile (la modifica di un elemento via DOM si può fare tranquillamente con una funzione javascript che non va a disturbare il server) tranne ovviamente per i casi di lettura dati da un database, ipotesi che resterebbe l'unica valida per il suo utilizzo. Quindi, tante funzioni javascript, ciascuna per ogni sottopagina. Se ben ricordo, poi, i file javascript di una web application dovrebbero caricarsi una tantum al primo utilizzo per poi restare memorizzati nel client, quindi i tempi di caricamento sarebbero un pò più lunghi solo all'inizio.

2) Nella mia applicazione faccio largo uso di testi localizzat jstl. Bene, in tal modo javascript non ha alcun problema a richiamare variabili definite nella stessa pagina "contenitore", con i testi già localizzati all'atto del suo caricamento, e che javascript provvederebbe solo a leggere sfruttando le variabili a tali testi associate.

Prima di addentrarmi oltre, vi pare che stia procedendo nella giusta soluzione?

Grazie per l'attenzione.

[cavicchiandrea]

Per quanto concerne la prima parte ci sono alcune inesattezze (eventi javascript da associare ad alcuni pulsanti e tali contenuti non vanno ad esempio d'accordo con innerHTML) non centra nulla innerHTML il javascript (pertanto anche ajax) non carica blocchi javascript (nello specifico va in conflitto quando trova la parola script) per fare questo ci sono alcuni accorgimenti.
Giusto porsi delle domande di conflitti, problemi, etc... ma quando non si ha la giusta conoscenza del linguaggio o si studia e si acquisisce, oppure si lasciano da parte i dubbi e si cerca la strada più semplice (pensiero personale).
Ritengo che un giusto compromesso potrebbe essere usare jquery, più semplice nell'apprendimento e meno problemi di compatibilità (browser vari) o conflitti.
Auguri per l'operazione

[Shadow976]

Andrea,
grazie per la risposta e per il tempo dedicato.

Riguardo Javascript, intendevo dire: per associare una funzione javascript già esistente e da me in precedenza creata, con innerHTML posso avere problemi mentre con Ajax e Javascript posso comunque procedere (ad esempio con addEventListener, associando una mia funzione ad un evento onclick di un certo elemento).

Usare jQuery sarebbe esattamente come usare innerHTML visto che (come sullo stesso sito jquery si evince) tale funzione si basa proprio sul predetto comando.

A questo punto non riterresti che la migliore soluzione, più elegante, efficiente e standardizzata, possa essere fare tutto via DOM inserendo così i dati di creazione dei singoli nodi direttamente nel codice javascript?

Grazie

[Shadow976]

Andrea, vorrei comunque cercare di seguire il tuo consiglio solo che non riesco a far funzionare jquery. Potresti darmi una mano? jQuery è installato e funzionante (lo uso già per altre funzioni) ed in testa alla pagina ho il codice:

<script>
$(document).ready(function() {
	$("#h").load("test.jsp");
	}); 
</script>

Nella stessa root della pagina web della quale ti ho copiato il codice c'è la pagina test.jsp, e nella pagina che contiene appunto il codice è presente appunto un div che ha id = "h". Eppure non si carica nulla. Come mai? Grazie!

[cavicchiandrea]

Originariamente inviato da Shadow976
Andrea,
grazie per la risposta e per il tempo dedicato.

Riguardo Javascript, intendevo dire: per associare una funzione javascript già esistente e da me in precedenza creata, con innerHTML posso avere problemi mentre con Ajax e Javascript posso comunque procedere (ad esempio con addEventListener, associando una mia funzione ad un evento onclick di un certo elemento).

Boh.... non è che c'ho capito molto, e secondo me stai facendo confusione ma...

Usare jQuery sarebbe esattamente come usare innerHTML visto che (come sullo stesso sito jquery si evince) tale funzione si basa proprio sul predetto comando.

Non mi risulta ma non mi sono mai studiato il sito a fondo e può darsi, anche se ritengo che jquery sia molto più complesso ma lungi da me convincerti

A questo punto non riterresti che la migliore soluzione, più elegante, efficiente e standardizzata, possa essere fare tutto via DOM inserendo così i dati di creazione dei singoli nodi direttamente nel codice javascript?

Elegante dipende cosa intendi se ti riferisci al codice forse, efficiente non penso che cambi molto rispetto a innerHTML per lo standard se intendi il w3c avrai problemi solo con IE fino alla 7 (la 8 cosi cosi) dalla 9 nessuno visto che aderisce, sicuramente è la strada più complessa.

Grazie

Saluti.

[cavicchiandrea]

Originariamente inviato da Shadow976
Andrea, vorrei comunque cercare di seguire il tuo consiglio solo che non riesco a far funzionare jquery. Potresti darmi una mano? jQuery è installato e funzionante (lo uso già per altre funzioni) ed in testa alla pagina ho il codice:

<script>
$(document).ready(function() {
	$("#h").load("test.jsp");
	}); 
</script>

Nella stessa root della pagina web della quale ti ho copiato il codice c'è la pagina test.jsp, e nella pagina che contiene appunto il codice è presente appunto un div che ha id = "h". Eppure non si carica nulla. Come mai? Grazie!

Dato che dovrebbe funzionare boh... posta un link alla pagina demo pubblica forse si capisce meglio.