[DOM] CloneNode avec DOM, XHR ne suit pas

Version imprimable

Voir 40 message(s) de cette discussion en une page

Citation:

Envoyé par SpaceFrog

passe l'id de destinaiton en paramètre et dans la focntion après le retour ajax attribues le innerHTML du div dont tu as l'id ...

dc là j'essaide passer le div en paramètre avec le code suggèré de E.Bzz:

Code:

1
2
3
4
 
<input name="searchq[]" id="search-q" type="input" onkeyup="javascript:searchSuggest(this.id,this.parentNode.getElementsByTagName('div')[0]);" autocomplete="off" />
 
	<div class="update" name="result" id="results" >

et donc je passe 'y' qui pointe normalement sur le div

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
function searchSuggest(x,y) {   
    // évite de lancer une recherche si une est déjà en cours 
    if (http_request.readyState == 4 || http_request.readyState == 0) { 
        var str = escape(document.getElementById(x).value); 
        http_request.open("GET", "search.php?search=" + str, true); 
        http_request.onreadystatechange = function () {  
    if (http_request.readyState == 4) { 
 
 
 
       // var ss = document.getElementById(y) ;
        y.innerHTML = ''; 
        var str = http_request.responseText.split("\n"); 
        for(i=0; i < str.length - 1; i++) { 
            var suggest = '<div onmouseover="javascript:suggestOver(this);" '; 
            suggest += 'onmouseout="javascript:suggestOut(this);" '; 
            suggest += 'onclick="javascript:setSearch(this.innerHTML);" '; 
            suggest += 'class="suggest_link">' + str[i] + '</div>'; 
            y.innerHTML += suggest; 
        } 
    }

mais y is undefined;

Citation:

Normalement, tu as dû renommer ton div, et tu devrais pouvoir "retrouver" (= recalculer) son ID pour y accéder directement ...
Ca serait encore préférable

en fait le div est renommé à chaque ajout de ligne, oui, mais tu veux dire dans quel fonction je pourrais y accèder?
@++

10/09/2008, 16h00
E.Bzz

Citation:

Envoyé par sativa808

en fait le div est renommé à chaque ajout de ligne, oui, mais tu veux dire dans quel fonction je pourrais y accèder?

Tu dois pouvoir le récupérer à partir de this.id, puisque l'id de l'input a dû être généré avec la même valeur de compteur que pour le div. Et ainsi reconstituer l'id du div ...

Sinon, as-tu essayé avec

Code:

this.parentNode.getElementsByTagName('div') // sans [0]

comme suggéré ? (cas où le parentNode ne contient qu'un seul div)

A+
10/09/2008, 16h13
SpaceFrog

EBzz .. ce sera une collection même avec un seul div dopnc [0] obligatoire ...

bon je pense avoir essayer toute ces solutions, ,je n'ai plus d erreur sous firebug mais se passe rien LOL!
Juste une erreur 'mal formé' sur </li>, et le pire c'est que je ne génére pas de liste enfin je crois pas!

Mais bon je demande pas qu on me ponde le code adequat, mais si tu a dejà mis ça en place sur un de tes sites, est ce que tu pourrais me donner un exemple concret SpaceFrog s'il te plais?

car voilà donc ou j en suis:
1- fonction searchSuggest (x,y)
2-
Code:

1 2 3 4 5 6 <p><label class="fieldset">marque</label> <input name="searchq[]" id="search-q" type="input" onkeyup='javascript:searchSuggest(this.id,this.parentNode.getElementsByTagName("div")[0]);' autocomplete="off" /> <div class="update" name="result" id="results" ></div></p>
3- var ss=y.innerHTML=''; pour ecrire la reponse.

tout à l air ok, mais non :aie:

11/09/2008, 08h34
SpaceFrog

Un exemple concret

voici un vieux site tout pourri:
http://www.sebemex.fr/Extramiante/Ca.../index.htm#SAD

au chargement de la page, un ajax va chercher un fichier texte sur le serveur et splitte le résultat puis clone un element sur la page pour le reproduire et construire le menu (moche certes mais ça j'y peux rien )
La seconde étape, au click sur une rubrique, ajax retourne chercher un autre fichier texte sur le serveur, le splitte clone un autre élément de la page pour afficher la liste des produits ....
Jette un œil sur le source de la page, tu n'y verras que les templates qui seront clonés et remplis ...
11/09/2008, 13h59
sativa808
je crois que tous se passe bien comme vous m'avez montré avec e.bzz et toi,
je dis je crois, car plus d'erreur de dom ou JS, seulement une erreur de syntaxe
Code:

1 2 3 4 5 6 Erreur*: erreur de syntaxe Fichier Source*: http://127.0.0.1/form/search.php?search=m Ligne*: 1, Colonne*: 1 Code Source*: morgan
par exemple la lettre 'm' est passé en paramétres d'url, on voit qu'il retourne même le résultat"morgan".

mais ps d'affichage ds le div

merci pr l'exemple concret!
11/09/2008, 14h15
E.Bzz
Ca correspond pas bien au message, mais :
Code:

1 2 for(i=0; i < str.length - 1; i++) { var suggest = '<div onmouseover="javascript:suggestOver(this);" ';
Sort la déclaration de la boucle. Sinon : multi-déclaration => erreur.

De plus, enlève les "Javascript:" dans tes évènements ...

A+

on diarit que 'e' n' est pas atteignable dans la deuxieme fonction, non?
est possible de declarer 'e' en parametre de autosuggest() et de l'utiliser dans la fonction plus bas dans le code ?

@++
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 function autosuggest(a,e) { // évite de lancer une recherche si une est déjà en cours if (http_request.readyState == 4 || http_request.readyState == 0) { var str = escape(document.getElementById(a).value); nocache = Math.random(); http_request.open("GET", "search.php?search="+str,true); http_request.onreadystatechange = function () { if (http_request.readyState == 4) { var str = http_request.responseText; e.innerHTML=str; //alert(str); e.style.display="block"; } } http_request.send(null); } }
Bon ce coup ci cà vient vraiment bon, affichage dans deux <div> different youpi!
vai essayer de pas tout casser sur la finition (remplir le div et faire disparaitre la liste) @+++

12/09/2008, 15h36
sativa808

:salut:

Bon je pense pas m'enflammer, mais c'est enfin pil-poil!!

dynamique à mort mais vraiment sale, lol.

1- affichage dans autant de clone possible
2- le remplissage se fait à grand coup de parentNode

:merci: à vous deux SpaceFrog et E.Bzz (je prononce bien j'éspère)!

Vive la fonction alert() maîtresse du debogage !!

j'èspér maintenant pouvoir recuperer proprement tout ça lors du POST du formulaire!

Ps: le code final est dans le "post" précédent, la fonction remplir est un peu crade, mais si ça intéresse, demandez!

@++ longue vie à JavaScript et DOM vu que je commence à capter :P

Voir 40 message(s) de cette discussion en une page