Probleme pour faire interpreter du JavaScript à une page chargée via AJAX

Question

Bonjour,

Je m'explique : Je développe actuellement un site en AJAX, il se décompose en 2 parties.
 A Gauche mon menu qui est composé de liens et lorsque je clique sur 1 de ces liens la page voulue se charge dans la partie de droite (Seule cette partie se met a jour le reste reste fixe - C'est le but d'AJAX ^^)
 Jusqu'ici aucun problème tout fonctionne parfaitement sauf qu'avec 1 de mes liens je charge une page contenant du JavaScript et étant donné que cette page est chargée via AJAX le JavaScript n'est bien entendu pas interprêté !!! Donc ma question est : Comment peut on faire interpréter du JavaScript à une page chargée par AJAX ???
 Si quelqu'un avait une solution pour me faire avancer car là je l'avoue je suis bloqué !!!

En vous remerciant par avance...

PS : J'espère avoir posté au bon endroit

cs_bultez · Answer

bonjour,
>>Comment peut on faire interpréter du JavaScript à une page chargée par AJAX ???
t'as pas du chercher bien longtemps !
problème récurent, poser de trsè nombreuses fois 

primo : t'es sûr d'avoir besoin de charger du javascript avec ajax ?
           ça peut servir à quoi ? c'est toujours ( ou presque ) inutile :
           mettre le javascript dans la page appelante et tout est résolu !

si tu y tiens à tous prix ( mais pour moi c'est une erreur de conception )
          regarde du coté de eval ( si le serveur retourne uniquement du javascript ),
          ou regarde comment font les framework qui tous le proposent 
         ou un ch'tiot exemple ici avec GAG  

vous ( tu n'es pas le seul ), essayez de réinventer le dialogue entre le serveur  et javascript
       pour moi ajax n'est pas là pour ça. dans le cadre d'ajax le script sur le serveur
       ne devrait retourner que des données, pas un page html et encore moins du js

Cordialement

           Bul [mon Site] [M'écrire]

XtremDuke · Answer

Certaines personnes vont te dire que ton Javascript ne devrait pas figurer dans ta page d'appel et d'autres te diront que le but original de Ajax est de traiter des flux XML enfin bref... Voilà une fonction qui devrait palier à ton problème : function evalScripts(sourceHtml){ var aReturn = []; var allScripts = new RegExp(']*>([\S\s]*?)', 'img'); var oneScript = new RegExp(']*>([\S\s]*?)', 'im'); var scripts = this.match(allScripts) || []; for(var i=0; i < scripts.length; i++){ var script = scripts[i].match(oneScript) || null; if(script) eval(script); }; }

XtremDuke · Answer

Mince alors, aurais-je des talents de voyant ?

cs_bultez · Answer

nickel ce que nous montre XTremDuke ( bien entendu )

je persiste à croire que ce doit être exceptionnel
    et qu'on ne devrait utiliser qu'à bon escient.

          Bul [mon Site] [M'écrire]

nickadele · Answer

idem !

Nickadele
----------------------------------------------
non, ma belle ne s'appel pas Adèle
Mon Blog

nicomilville · Answer

Bon ba il me reste plus qu'a approuver aussi ! lol !

Intervenant++

PS : ce doit être très lourd de charger toute une page en ajax, d'autres solutions existes.

Si la réponse vous convient, pensez : Réponse acceptée !

XtremDuke · Answer

Oula, voilà ce que c'est de traduire à la vas-vite : function evalScripts(sourceHtml){ var allScripts = new RegExp(']*>([\S\s]*?)', 'img'); var oneScript = new RegExp(']*>([\S\s]*?)', 'im'); var scripts = sourceHtml .match(allScripts) || []; for(var i =0; i < scripts.length; i++){ var script = scripts[i].match(oneScript) || null; if(script) eval(script); }; } Attention, il faut bien connaître les limitations dues à l'utilisation de la fonction eval() .

Projet en cours : Joof

prozenproses · Answer

Merci pour vos réponse mais mon problème n'est pas résolu ou alors je me sers mal de votre fonction.
En fait la page que j'essaie de charger est en PHP et le script JavaScripts qu'elle contient est un menu ( en onglet) codé en AJAX ( librairie prototpe) et je voudrais que ce menu soit "décrypter par AJAX".

J'avais déjà trouvé la réponse que vous m'avez donné mais pour moi ce n'est pas ce qu'il me faut, je me trompe peut être
Merci encore

XtremDuke · Answer

Je penses que tu as mal posé ta question qui, je te le rappelles, était :

Comment peut on faire interpréter du JavaScript à une page chargée par AJAX ???

"la page que j'essaie de charger est en PHP"

>> Qu'elle soit en Php ne change rien, le flux que tu récupères est de l'Html.

Puisque tu utilises Prototype, va jeter un œil sur la lib : http://prototypejs.org/api/ajax/options
Regarde plus précisément l'option onSuccess qui est le callback d'une requête réussie.

<hr size="2" width="100%" />Projet en cours : Joof

prozenproses · Answer

Je vais être plus précis en vous montrant le code nécessaire à la "bonne" compréhension de mon attente : _____________________________________________________________________ Exemple d'un lien de mon fichier index.php : [ma_page_a_charger Ma page] _____________________________________________________________________ ma_page_a_charger.php (elle ressemblerais à cela) : PS : l'appel à prototype.js et onglet.js (script de création des mes onglets) est fait dans mon index _____________________________________________________________________

prozenproses · Answer

Merci XtremDuke je regarde ca et je vous re-contacte ensuite

nickadele · Answer

Si ce que ta page php renvoie n'est que du javascript un simple eval() du résultat suffit, et je pense même que les  balises script sont inutiles !

Nickadele
----------------------------------------------
non, ma belle ne s'appel pas Adèle
Mon Blog

prozenproses · Answer

ce qu'elle revoie n'est que du javascript oui mais honnetement je ne vois pas comment utilisé eval() ici ou plutot ou l'utiliser. Dans mon index.php? ou dans la page que je charge via AJAX?

nickadele · Answer

Dans la page qui charge le résultat de Ajax.
eval (ce_que_renvoie_ajax);

Nickadele
----------------------------------------------
non, ma belle ne s'appel pas Adèle
Mon Blog

nickadele · Answer

Essaye en renvoyant avec ta page php un simple alert('coucou');

Nickadele
----------------------------------------------
non, ma belle ne s'appel pas Adèle
Mon Blog

prozenproses · Answer

ok merci de ton aide je m'absente je reviens je pars du taf j'ai de la route je me reconnecte après. J'essaie ce que tu ma dit et je te recontacte en conséquence encore merci

prozenproses · Answer

j'ai deja essayé, ma page n'interprete pas le javascript elle est blanche

prozenproses · Answer

enfin pas blanche elle m'écrit simplement alert('coucou'); ce qui revien au meme elle n'interprete pas le js

nickadele · Answer

Met le script qui réceptionne la réponse pour voir où se situe ton problème.

Nickadele
----------------------------------------------
non, ma belle ne s'appel pas Adèle
Mon Blog

cs_bultez · Answer

pourquoi faire retourner ce javascript la par du php ? 
ça ne sert strictement à rien !
var oOnglet = new Onglet ("calqueracine", "cssonglet");
oOnglet.addOngletUrl ("Lister", "lister_produits.php");
oOnglet.addOngletUrl ("Ajouter", "ajouter_produits.php");
oOnglet.addOngletUrl ("Modifier", "modifier_produits.php");
oOnglet.addOngletUrl ("Supprimer", "supprimer_produits.php");
oOnglet.setFocus (1);
???

met ça dans une fonction de ta page appelante !!!!
ce sera quand même plus simple,  ça évitera un échange, ...
et appelle la quand tu veux !

          Bul [mon Site] [M'écrire]

prozenproses · Answer

merci Bultez j'y est pensé mais cela revient au meme non? si je le charge dans ma page appelante il faudra quand meme que j'appelle mon script dans la page appelée non?

cs_bultez · Answer

>>cela revient au meme non?
pas du tout.
comme ça tu es dans le standard, tu appelles une fonction "normalement".
de l'autre manière tu vas devoir ajouter : 
l'extraction du js ( et c'est pas si simple ), 
son exécution ( eval par exemple et c'est très gourmand déjà )....

          Bul [mon Site] [M'écrire]

cs_bultez · Answer

et je n'ai pas répondu à >>il faudra quand meme que j'appelle mon script dans la page appelée
à priori pas nécessaire... l'appel depuis la page appelante ça doit le faire
et même, ça ne poserait pas de souci particulier. 

Cordialement

Bul[mon Site][M'écrire]

cs_bultez · Answer

2 ch'tiot exemples ? demo2.htm ( appel dans appelante ) demo2.htm demo2.php demo3.htm ( appel dans appelée ) demo3.htm demo3.php onclick="appel();" value="test" /> j'ai "simplifié au maxi" les appels ajax ( synchrone, aucun contrôle ... ) Bul [mon Site] [M'écrire]

prozenproses · Answer

Re Bultez je pense que ta solution est certes bonne mais je ne vois pas comment la mettre en place. Voici une simplification (pour une bonne lecture) de mon index.php // tous mes liens vers mes javascripts nécessaire // image située en haut du site (fixe) // fond du menu de gauche (fixe) // le menu de gauche

[# Un lien]

/* C'est ici que sont chargées mes pages appelées via mes liens et chaque page dispose d'un menu différent qui est donc en javascript. Il me faut donc pouvoir l'interprêter. */ Un des menu qui devra s'afficher dans la DIV "pageencours" (ici c'est le code SANS AJAX) : Merci pour toutes les réponses que vous m'avez déjà données. Je cherche depuis presque 2 semaines (je sais ce n'est pas énorme) ; en général je ne met pas si longtemps à règlé un probleme mais la je me frotte à une réelle difficulté et n'étant pas du genre à lacher l'affaire je ne m'arreterais pas de si tot mais je ne compte pas non plus y passé 100ans (en même temps ca risque d'etre difficile ^^). Je me suis mit à AJAX il y a trois semaines et j'ai comprit pourquoi s'en servir et comment (de facon simple) mais la ca devient compliqué! On me fournit toujours la même solution et le GROS probleme est que je n'arrive même pas à afficher un simple "alert(le javascript s\'affiche);" après un clic sur un des liens du menu.

prozenproses · Answer

oups  j'écrivais en meme temps, je vais mettre tout ca a part et voir comment cela fonctionne.
Merci pour ton aide Bultez

cs_bultez · Answer

tu utilises prototype !?!
    il a tout ce qu'il faut, de base, pour gérer ce genre de choses
    ( même si je continue à penser qu'il vaudrait mieux pas ! )

en menu en javascript ? 
    à notre époque html+css suffisent largement le js est inutile
    ( sauf vieilles versions de certains navigateurs ie6 pour ne pas citer par exemple,
      en général ce n'est qu'un "souci de présentation", laid, mais pas bloquant )
    rien n'empêche d'appeler la fonction nécessaire avec des paramètres
        en fonction de la page chargée...
    ...

          Bul [mon Site] [M'écrire]

prozenproses · Answer

donc je pourrais créer un menu en onglet en css??? ca serais idéal et beaucoup plus simple

Pour répondre à tes questions, oui j'utilise prototype mais si je le charge dans mon index il fais buguer mon menu (du moins il le déroule entièrement, chose non voulu, mais le laisse utilisable tous les liens fonctionnent). Donc j'aurais aimé le chargé uniquement dans mes page appelées (ca risque de compliquer encore + les choses ...) donc si une autre solution m'est proposée je suis preneur.

En fait si je veux créer un deuxième menu dans ma page appelée c'est uniquement pour ne pas surcharger l'autre menu (celui de mon index) qui se verrait alors composé de 4 liens de plus pour chaque élément. Peut être qu'une autre solution serais possible mais je ne vois pas.

prozenproses · Answer

ba voila si je sortais un peu de mon code j'aurais pu y pensé avant, je peux tout simplement rajouté un niveau à mon menu (de l'index) et voila un gros probleme de règlé !!!

Pourquoi se casser le crâne sur quelque chose que l'on peut faire plus simplement??? Je crois que c'est un défaut que je dois travailler quand j'ai une optique je ne cherche pas à en trouver une autre et la j'viens de perdre deux semaine sur mon projet pour "rien" enfin presque

prozenproses · Answer

En tout cas merci pour tout Bultez, mais je me permet de t'embeter une derniere fois.
Ce n'est pas vraiment primordial mais y'a t-il une arborescence "type" ou plutot optimisée lorsque travaille avec AJAX :

prozenproses · Answer

j'essaierais quand meme de faire exécuter du javascript par ajax mais pas dans ce projet juste pour une culture perso (un ptit défi !!!)

cs_bultez · Answer

>>faire exécuter du javascript par ajax 
ah... pour culture personnelle, là c'est autre chose et intéressant

déjà : tu as le script de xtremduke
         tu as les sources des framework
         tu as un lien vers "mon" ch'tiot exemple ( gag )

ou alors met dans un div et exploite ?
            div.innerHTML=xml.responseText;
            var scrajx = d.getElementsByTagName('script');
            for( var i in scrajx )
            {    eval(scrajx[i].text);    }
si plusieurs balises <script> possible

doit bien y avoir encore 23658 pistes

          Bul [mon Site] [M'écrire]

XtremDuke · Answer

Si ça peut t'éclairer sur le sujet (épineux) d'Ajax :

http://www.journaldunet.com/developpeur/client-web/tutoriel-pratique/08/0123-bonnes-pratiques-ajax.shtml

<hr size="2" width="100%" />Projet en cours : Joof

prozenproses · Answer

Merci Bultez et XtremDuke pour ces pistes je me replonge dans mon projet mais je n'abandonne pas!
AJAX est vraiment un outil intéressant et je compte bien le maitriser...
Bonne fin de journée et bone continuation et encore merci de m'avoir donné de votre temps

xanata · Answer

L'usage de javascript peut être utile lors de validation de formulaire appelés en ajax (dialogiue modal) et dont les contrôles sont effectués uniquement en ajax. Dans ce cas, il est difficile d'embarquer tout le code dans la 1ere page, car les procédure appelées sont souvent spécifiques au moments de l'appel. Mais on peut trouver un meilleur des duex monde, car il est vrai qu'un eval sur plusieur dixaine voire centaines de lignes est groumand !!, alors pour ma part j'insére le code principal dans la 1ere page (par ex: ma classe de controle formulaire, etc), puis en ajax je n'appelle que le minimum (var frm108 =  new ControlForm(myform) ). Mais il reste un problèmen la variable local à ajax (  frm108  dans ce cas) n'est pas tjs visible, alors je la stocke dans une variable globale (var sysGlobal) définie dans la 1ere page (soit sysGlobal.frm108 =new CrontrolForm(myform)). ou alors lors de l'appel à eval du code ajax, on peut écrire sys_global.eval(texte) avec la meme variable.
Ces deux techniques m'ont permi de résourdre tous mes prob. de JS en ajax....

Probleme pour faire interpreter du JavaScript à une page chargée via AJAX

35 réponses

Votre réponse

Discussions similaires