[ajax] div di destinazione variabile

[icyz]

ciao a tutti
ho un problema ad avere un div variabile nella quale stampare i risultati

mi spiego meglio con un esempio:

<input type="text" id="cerca" class="inputbox" onkeyup="invia_richiesta('dati.php','cerca')" />

invia_richiesta() passa il valore di CERCA alla pagina DATI.php e poi stampa tutto in un div con id="VISUALIZZA"

io vorrei che l'id visualizza fosse dinamico in modo da doverlo definire come parametro della funzione INVIA_RICHIESTA (in questo modo)

<input type="text" id="cerca" class="inputbox" onkeyup="invia_richiesta('dati.php','cerca','visualizza2')" />

vi posto anche il file ajax.js che uso per effettuare la richiesta asincrona:

                                                          
// creiamo la funzione per riconoscere il browser

function gestione_browser() {
    
   
var valorizzati;

var browser = navigator.appName;

if(browser == "Microsoft Internet Explorer"){

valorizzati = new ActiveXObject("Microsoft.XMLHTTP");

}else{

valorizzati = new XMLHttpRequest();

}

return valorizzati;

}




// valorizziamo la funzione gestione_browser()
 
var http = gestione_browser();

// creiamo la funzione per inviare i dati con alla pagina in php



function invia_richiesta(php,field) {

// preleviamo con getelementbyid il valore cerca

var cerca = document.getElementById(field).value;

// apriamo una comunicazione con dati.php inviandogli il valore di cerca

http.open('get', php+'?param='+cerca);

// stampiamo la risposta

http.onreadystatechange = stampa_risposta;

// inviamo tutto

http.send(null);

}




// creiamo la funzione per stampare i dati
 
function stampa_risposta() {

    
// caricamento   
if(http.readyState != 4) { document.getElementById('visualizza').innerHTML = "[img]images/loading.gif[/img]";  }
// se lo stato di http è 4 cioè "risposta ricevuta"    
if(http.readyState == 4) {

// valorizziamo la risposta

var risposta = http.responseText;

// usiamo innerhtml per stampare la risposta sul div

 document.getElementById('visualizza').innerHTML = risposta; 

}

}

grazie a tutti in anticipo

[cavicchiandrea]

Nella funzione invia aggiungi il 3 parametro cioè l'id del div
invia_richiesta(php,field,div)
a sula volta lo passerai alla funzione stampa
http.onreadystatechange = stampa_risposta(div);
nella funzione stampa lo passi al getElement
function stampa_risposta(div)
visualizzazione response
document.getElementById(div).innerHTML= risposta;

[icyz]

grazie per la risposta,

prima di postare comunque ho fatto proprio quello che mi hai detto tu, ma non ha funzionato
cosa puo' essere?

[Vindav]

boh, magari hai sbagliato a riportare le modifiche suggerite... posta nuovamente il codice con le ultime modifiche.

[icyz]

ho provato, ma non funziona..
praticamente appena scrivo qualcosa mi appare la gif del loader, ma poi non succede altro:

posto il codice e linko lo script

ajax.js

// creiamo la funzione per riconoscere il browser

function gestione_browser() {
    
   
var valorizzati;

var browser = navigator.appName;

if(browser == "Microsoft Internet Explorer"){

valorizzati = new ActiveXObject("Microsoft.XMLHTTP");

}else{

valorizzati = new XMLHttpRequest();

}

return valorizzati;

}




// valorizziamo la funzione gestione_browser()
 
var http = gestione_browser();

// creiamo la funzione per inviare i dati con alla pagina in php



function invia_richiesta(php,field,div) {

// preleviamo con getelementbyid il valore cerca

var cerca = document.getElementById(field).value;

// apriamo una comunicazione con dati.php inviandogli il valore di cerca

http.open('get', php+'?param='+cerca);

// stampiamo la risposta

http.onreadystatechange = stampa_risposta(div);

// inviamo tutto

http.send(null);

}




// creiamo la funzione per stampare i dati
 
function stampa_risposta(div) {

    
// caricamento   
if(http.readyState != 4) { document.getElementById(div).innerHTML = "[img]images/loading.gif[/img]";  }
// se lo stato di http = 4 cioe¨ "risposta ricevuta"    
if(http.readyState == 4) {


// valorizziamo la risposta

var risposta = http.responseText;

// usiamo innerhtml per stampare la risposta sul div

 document.getElementById(div).innerHTML = risposta; 

}

}

index.html

  <input type="text" id="cercax" class="inputbox" onkeyup="invia_richiesta('dati.php','cercax','visualizza2')" />
  <div id="visualizza2"></div>
  
  
    <input type="text" id="cercaz" class="inputbox" onkeyup="invia_richiesta('dati.php','cercaz','visualizza3')" />
  <div id="visualizza3"></div>

dati.php

<?php  echo "param: ".$_GET['param'];  ?>

link per vedere l'effetto
http://vobisvaldarno.it/ajax2/


grazie ancora,
Andrea

[Vindav]

prova cosi:

http.onreadystatechange = function(div) {
// caricamento   
if(http.readyState != 4) { document.getElementById(div).innerHTML = "[img]images/loading.gif[/img]";  }
// se lo stato di http = 4 cioe¨ "risposta ricevuta"    
if(http.readyState == 4) {
// valorizziamo la risposta
var risposta = http.responseText;
// usiamo innerhtml per stampare la risposta sul div
 document.getElementById(div).innerHTML = risposta; 
}
}

[icyz]

provato così ma niente da fare

function invia_richiesta(php,field,div) {

// preleviamo con getelementbyid il valore cerca

var cerca = document.getElementById(field).value;

// apriamo una comunicazione con dati.php inviandogli il valore di cerca

http.open('get', php+'?param='+cerca);

// stampiamo la risposta

    

http.onreadystatechange = stampa_risposta(div);

// inviamo tutto

http.send(null);

}




// creiamo la funzione per stampare i dati
 
function stampa_risposta(div) {

http.onreadystatechange = function(div) {
// caricamento   
if(http.readyState != 4) { document.getElementById(div).innerHTML = "[img]images/loading.gif[/img]";  }
// se lo stato di http = 4 cioe¨ "risposta ricevuta"    
if(http.readyState == 4) {
// valorizziamo la risposta
var risposta = http.responseText;
// usiamo innerhtml per stampare la risposta sul div
 document.getElementById(div).innerHTML = risposta; 
}
}
}

[Vindav]

non era quello che intendevo, avrei dovuto spiegarmi meglio... intendevo cosi:

function invia_richiesta(php,field,div) {

// preleviamo con getelementbyid il valore cerca

var cerca = document.getElementById(field).value;

// apriamo una comunicazione con dati.php inviandogli il valore di cerca

http.open('get', php+'?param='+cerca);

// stampiamo la risposta

    

http.onreadystatechange = function() {
// caricamento   
if(http.readyState != 4) { document.getElementById(div).innerHTML = "[img]images/loading.gif[/img]";  }
// se lo stato di http = 4 cioe¨ "risposta ricevuta"    
if(http.readyState == 4) {
// valorizziamo la risposta
var risposta = http.responseText;
// usiamo innerhtml per stampare la risposta sul div
 document.getElementById(div).innerHTML = risposta; 
}
}

// inviamo tutto

http.send(null);

}

[icyz]

direi che ci siamo quasi, grazie mille

ho uploadato su ftp quello che fa lo script dopo la tua modifica:

http://www.vobisvaldarno.it/ajax2/index.html

sembra che funzioni, pero' appena lascio il campo interessato torna il loading

if(http.readyState != 4) { document.getElementById(div).innerHTML = "[img]images/loading.gif[/img]";  }

ma lo stato non dovrebbe essere 4 quando "non lavora"?

[Vindav]

pero' appena lascio il campo interessato torna il loading

a me non succede affatto quello che dici: su explorer funziona bene, su firefox invece da qualche problema, sembra che l'immagine di loading venga applicata ad entrambi i div invece che al div specificato. La prima cosa da fare è sicuramente cambiare il nome a quella variabile. Dagli un nome piu specifico perche "div" è una parola chiave e potrebbe dare problemi.