[AJAX / javascript] Element ID doorgeven??

Pagina: 1
Acties:

  • divvid
  • Registratie: Februari 2006
  • Laatst online: 10-02 16:10
Ik ben sinds kort bezig met een site die AJAX gebruikt voor het updaten van content in een pagina. Hiervoor gebruik ik een scriptje van de volgende website
http://aleembawany.com/we...jax_instant_tutorial.html maar daarmee kan ik alleen op 1 bepaalde plek iets kan wijzigen in de site. Ik wil graag de plek waar iets gewijzigd kan worden meegeven in de link, kortom Hoe kan ik een 'elementID' meegeven aan de xmlhttp.onreadystatechange = triggered functie in de onderstaande code??

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function loadurl(dest) {
 try {
   xmlhttp = window.XMLHttpRequest?new XMLHttpRequest():
        new ActiveXObject("Microsoft.XMLHTTP");
 }
 catch (e) { /* do nothing */ }
 
 xmlhttp.onreadystatechange = triggered;
 xmlhttp.open("GET", dest);
 xmlhttp.send(null);
}

function triggered() {
  if ((xmlhttp.readyState == 4) && (xmlhttp.status == 200))
    document.getElementById("output").innerHTML =xmlhttp.responseText;
}


Deze code word getriggered door een link waarna de tekst in een divje wijzigd. b.v.
code:
1
2
3
<a href="javascript:loadurl('/ajax/getInfo.php')" >klik hier om de info op te halen</a>
......
 <div id="output">hier komt de info te staan na een klik</div> </body>


Ik heb het volgende geprobeerd waarbij target_id naar verschillende div secties kan wijzen , maar dat werkt dus niet. Target_id komt wel aan in de loadurl functie, maar wordt niet doorgegeven aan de triggered functie. Ik hoop dat iemand mij verder kan helpen:
code:
1
2
3
4
5
<a href="javascript:loadurl('/ajax/getInfo.php','target_01')" >klik hier om de info in target_01 te zetten</a>
<a href="javascript:loadurl('/ajax/getInfo.php','target_02')" >klik hier om de info in target_02 te zetten</a>
......
 <div id="target_01"></div>
 <div id="target_02"></div>

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function loadurl(dest,target) {
 try {
   xmlhttp = window.XMLHttpRequest?new XMLHttpRequest():
        new ActiveXObject("Microsoft.XMLHTTP");
 }
 catch (e) { /* do nothing */ }
 
 xmlhttp.onreadystatechange = triggered(target);
 xmlhttp.open("GET", dest);
 xmlhttp.send(null);
}

function triggered(target) {
  if ((xmlhttp.readyState == 4) && (xmlhttp.status == 200))
    document.getElementById(target).innerHTML =xmlhttp.responseText;
}

  • RickyHeijnen
  • Registratie: Maart 2005
  • Laatst online: 30-04-2025
Je kunt van de dest url via /ajax/getInfo.php?id=target_1 meegeven. En als je zorgt dat die ook op de getInfo.php pagina weergegeven wordt, dan kun je hem in triggered weer parsen.

Doe dan bijv. output|Hier de tekst die geoutput moet worden.
code:
1
2
3
4
function triggered(){
     results = r.responseText.split('|');
     document.getElementById(results[0]).innerHTML = results[1];
}

[ Voor 38% gewijzigd door RickyHeijnen op 20-03-2006 11:30 ]


Verwijderd

zou zo idd moeten werken (wat de ts zegt iig, wat hierboven staat klopt niet), denk alleen dat target een reserved name is, probeer eens een andere variabele naam. - ik lees niet goed, zie hieronder

Waarom AJAX btw? waarom niet gewoon pagina's of desnoods een iframe. AJAX is erg leuk, maar overhyped, vaak overbodig en nog veel vaker niet erg accessible toegepast.

[ Voor 17% gewijzigd door Verwijderd op 20-03-2006 12:10 ]


  • Michali
  • Registratie: Juli 2002
  • Laatst online: 09-12-2025
JavaScript:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
function loadurl(dest,target) {
 try {
   xmlhttp = window.XMLHttpRequest?new XMLHttpRequest():
          new ActiveXObject("Microsoft.XMLHTTP");
 }
 catch (e) { /* do nothing */ }
 
 xmlhttp.onreadystatechange = function() {
    if ((xmlhttp.readyState == 4) && (xmlhttp.status == 200))
      document.getElementById(target).innerHTML =xmlhttp.responseText;
  }
  xmlhttp.open("GET", dest);
 xmlhttp.send(null);
}

Zo kan het wel. Dit heet closure en het houd in dat als je een functie maakt dat hij toegang heeft tot alle variabelen binnen de scope van de code waarin hij gemaakt wordt. Oftewel, hij heeft toegang tot xmlhttp, desc en target, ook al wordt hij op een totaal andere plek aangeroepen.

Noushka's Magnificent Dream | Unity


  • divvid
  • Registratie: Februari 2006
  • Laatst online: 10-02 16:10
Ah, dank je wel, dit laatste werkt, top.
Waarom AJAX: just to learn, en omdat ik hiermee uiteindelijk een bergje option boxes wil vullen die van elkaars geselecteerde waarden afhankelijk zijn. Dat werkt nu met elke keer reloaden van de php pagina en dat vind ik zelf minder fraai.