La pagina perde i riferimenti al javascript

[Adriano67]

Ciao.

Sto programmando una pagina che prevede la creazione di una lista di nomi selezionabili da determinati elenchi che vengono presentati in base alla scelta che si effettua in una combo-box.

Provo a spiegarmi meglio: se nella combo seleziono, per esempio, la voce "Antipasti", attraverso una chiamata javascript mostro, in un DIV accanto alla combo stessa, l'elenco degli antipasti disponibili. Da questo elenco posso scegliere 1 o più voci, quindi clicco su un pulsante ed eseguendo una funzione javascript richiamo una pagina PHP che riceve i dati selezionati ed esegue un INSERT, dopodichè eseguo una query per mostrare l'elenco aggiornato ed indirizzo l'output in uno specifico DIV che si trova al di sotto della combo iniziale.

Ai piedi dell'elenco ci sono alcune text-box grazie alle quali posso indicare il numero di persone che partecipano all'evento ed il costo del pranzo.

Quando aggiorno il numero di persone, attraverso una chiamata javascript lancio una funzione che esegue il calcolo dei costi per fare in modo di avere in tempo reale quello che mi serve.

Ora descrivo il problema: quando carico la pagina per la prima volta, il ricalcolo che viene eseguito al cambiare del numero di partecipanti funziona perfettamente. Quando eseguo un INSERT per aggiungere una qualsiasi nuova portata all'interno del menu, dopo aver mostrato il nuovo piatto, il ricalcolo NON funziona più.

Voglio sottolineare che le text box che mostrano questo ricalcolo sono completamente slegate dalla visualizzazione del menu, che si trova in un DIV specifico, popolato attraverso la chiamata javascript.
La chiamata che eseguo è di tipo XMLHTTP.

Funziona tutto, tranne per il fatto che nella pagina "madre", una volta popolato un DIV specifico per mostrare il risultato dell'INSERT, la chiamata alla funzione di ricalcolo non ne vuole sapere di eseguire quello per cui è stata scritta.

Spero di essere stato abbastanza chiaro.
Grazie in anticipo anche solo per aver letto questo post.

 

[f107]

Ciao,
Scusa ma trovo difficolta a capire il tutto...
Il problema è che non si aggiorna il calcolo al cambio delle condizioni?
Non si può vedere un po' di codice? o una demo online?
La console non ti da nessun errore?

 

[Adriano67]

Ciao e grazie dell'interessamento.

Cerco di spiegarmi nel migliore dei modi:
in una pagina PHP, ho inserito un <DIV> all'interno del quale, tramite una funzione javascript, scrivo il codice risultante da una query SQL. Per esempio, come scritto in precedenza, seleziono il nome di un piatto e clicco sul pulsante "INSERISCI". Viene scatenato un evento che richiama una funzione JAVASCRIPT che a sua volta chiama una pagina PHP per poter inserire i valori senza dover così ricaricare tutta la pagina.
All'interno della pagina che inserisce i valori selezionati, eseguo una query SQL per avere il menu aggiornato in tempo reale.
Il risultato di questa query, formattato con HTML, viene inviato al <DIV>.

Un pezzo del javascript che utilizzo è
var strTuttoIlCampo = document.getElementById("nome_prodotto").value;
var intPCS = strTuttoIlCampo.indexOf("§");
var intIdIngrediente = strTuttoIlCampo.substr(0,intPCS);
var idr = document.getElementById("id_ricetta").value;
url = "gs_ricette_dettaglio_popola_campi.php?iding="+intIdIngrediente+"&idr="+idr;
XMLHTTP = RicavaBrowser(CambioStatoRigaRicetta);
XMLHTTP.open("GET", url, true);
XMLHTTP.send(null);

La funzione CambioStatoRigaRicetta è
function CambioStatoRigaRicetta()
{
if (XMLHTTP.readyState == 4)
{
var R = document.getElementById("risultato_ingrediente");
R.innerHTML = XMLHTTP.responseText;
}
}

Nella pagina PHP eseguo delle operazioni e l'INSERT dei dati, quindi una SELECT per avere il risultato aggiornato.
Ti prego di prenderlo per buono perchè FUNZIONA. Il risultato viene visualizzato ed è corretto.

Ora, nel codice HTML che viene posto nel DIV con il comando XMLHTTP.responseText, è presente una textbox type="hidden" alla quale devo fare riferimento per poter calcolare in tempo reale il costo del pranzo: cambio il numero di invitati e sul onBlur scateno una funzione javascript che legge i valori dei campi e mi dice quanto costerà un pranzo. Piuttosto semplice.

Ora, qual è il problema? Il problema sta nel fatto che javascript NON riconosce le textbox type="hidden" scritta con il XMLHTTP.responseText. E' come se non esistesse. Ho messo degli alert per vedere i valori dei campi che mi servono e quando cerco di visualizzare quel valore specifico, il javascript non lo vede. Non lo prende in considerazione. E? come se non esistesse all'interno della pagina. E javascript esce dalla funzione senza eseguire alcun calcolo.

Spero di essermi spiegato meglio.

 

[marino51]

prima di guardare il codice, potrebbe essere un problema di cache,
se invii la stessa richiesta Ajax il risultato viene preso dalla cache
aggiungi alla richiesta Ajax il "timer" come parametro, in modo da "confonderlo" facendogli capire che è una richiesta differente dalla precedente
se poi ancora non funziona fatti vivo

 

[f107]

Ora, qual è il problema? Il problema sta nel fatto che javascript NON riconosce le textbox type="hidden" scritta con il XMLHTTP.responseText. E' come se non esistesse. Ho messo degli alert per vedere i valori dei campi che mi servono e quando cerco di visualizzare quel valore specifico, il javascript non lo vede. Non lo prende in considerazione. E? come se non esistesse all'interno della pagina. E javascript esce dalla funzione senza eseguire alcun calcolo.

Se non ho capito male risultato_ingrediente è l'id dell'input type hidden giusto?
In questo caso io cambierei questo:

R.innerHTML = XMLHTTP.responseText;

in

R.value = XMLHTTP.responseText;

Gli input usano value perché sono oggetti che possono contenere dei valori diciamo, mentre innerHTML di solito è usato per i div o per generici contenitori che possono contenere HTML.

Ovviamente anche quando richiamerai il valore dovrai usare value e non innerHTML.
Prova e fammi sapere.
Nella speranza di aver capito bene

 

[Adriano67]

Ciao e grazie della risposta.

No, "risultato_ingrediente" è l'id del DIV all'interno del quale vado a scrivere il risultato della query che eseguo dopo aver inserito i valori nel DB.

Ho provato a scrivere "R.value = XMLHTTP.responseText;" ma purtroppo non funziona. Il risultato non viene neanche mostrato a video.

La cosa ancora più frustrante è che se il DIV si trova all'interno di un form, nel momento in cui sottometto il form stesso, i valori delle textbox sia hidden che non, vengono presi in considerazione da eventuali calcoli...

Per darvi un'altra idea di quello che succede, se invio nel DIV un pulsante che fa riferimento ad un file CSS, il pulsante non viene "stilizzato". Il codice HTML è come se non esistesse all'interno della pagina, pur essendo visualizzato.

Il testo inviato al DIV è solo visualizzato e basta, non ci si può fare niente di niente a meno che, come detto, non sottometti il form. In questo caso però, non ho nessun form da sottomettere perchè non mi serve.

PER QUANTO RIGUARDA IL TIMER:
ad ogni richiesta di inserimento mi viene proposto il menu aggiornato, per cui non credo sia un problema di cache. I dati vengono inseriti nel DB, viene eseguita una query SQL e quindi il risultato mostrato a video, nel nostro bel DIV.
Vediamo i dati aggiornati e questi dati non sono presi in considerazione dal javascript presente nella pagina...

Sto diventando più matto di quanto non lo sia ogni giorno...

Credo che farò l'inserimento dati e poi eseguirò un bellissimo reload tutta la pagina...

 

[f107]

No, "risultato_ingrediente" è l'id del DIV all'interno del quale vado a scrivere il risultato della query che eseguo dopo aver inserito i valori nel DB.

Ho provato a scrivere "R.value = XMLHTTP.responseText;" ma purtroppo non funziona. Il risultato non viene neanche mostrato a video.

Allora ti chiedo scusa ho capito male e quella modifica è inutile...
ma il valore del campo hidden è un campo che hai aggiunto dinamicamente alla pagina? come cerci di prendere quel valore poi in js?

si potrebbe vedere tutto il codice front-end?

Matteo