[AJAX] Javascript non interprété dans fonction Ajax

Version imprimable

Bonjour,

J'ai un petit souci dans un formulaire que j'ai developpé.
En fait j'ai créé des formulaires qui peuvent s'appeler directement, ou être chargé en Ajax dans une page "Récapitulatif" afin de pouvoir éditer chaque étape du formulaire sur la page de récapitulatif.
J'ai un petit bout de Javascript dans le formulaire, tout marche très bien quand on l'appel directement, en revanche, lorsque le formulaire est appelé en Ajax, les onClick ne sont plus interprété.

J'ai une fonction loadTypeIntervention :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 function loadTypeIntervention(idParent) { if (idParent == 16) { var otherId = 1; } else { var otherId = 16; } document.getElementById("imgInterv" + idParent).style.border = "2px solid green"; document.getElementById("imgInterv" + otherId).style.border = "none"; document.getElementById("tdCheck" + idParent).innerHTML = "<img src=\"' . $global_web_site . $global_rep_image_contenu_page . '/graphisme_global/picto-check.gif\" />"; document.getElementById("tdCheck" + otherId).innerHTML = ""; document.getElementById("interv" + idParent + "-1").style.display = "table-cell"; document.getElementById("interv" + otherId + "-1").style.display = "none"; document.getElementById("interv" + otherId + "-2").style.display = "none"; document.getElementById("interv" + otherId + "-3").style.display = "none"; }
Si j'appel cette fonction juste après dans la balise script, elle marche dans les 2 cas (appel direct du formulaire ou appel en ajax), mais pas sur mon onClick :
Code:

1 2 <a href="javascript:void(0)" onClick="loadTypeIntervention(16)">
Dans ce cas la fonction marche bien quand le formulaire est appelé directement, en revanche quand je l'appel en Ajax j'ai une erreur :

Citation:

loadTypeIntervention is not defined

Quelqu'un sait de quoi cela peut venir car la je suis en train de m'arracher les cheveux 8O

26/08/2011, 10h22
Torgar

Bonjour,

C'est parce que ton javascript n'est pas évalué lorsqu'il est chargé par AJAX.

Je pense que cet article de la FAQ AJAX t'aideras à trouver la réponse.

Voir ICI

Redis-nous ce que ça donne.

Cordialement,

Citation:

Envoyé par Torgar

Bonjour,

C'est parce que ton javascript n'est pas évalué lorsqu'il est chargé par AJAX.

Je pense que cet article de la FAQ AJAX t'aideras à trouver la réponse.

Voir ICI

Redis-nous ce que ça donne.

Cordialement,

Salut et merci de ta réponse,
J'ai essayé d'ajouter un eval lors de mon appel Ajax, mais cela n'a pas l'air de fonctionner non plus, voici le code de l'appel Ajax :
Code:

1 2 3 4 5 6 7 8 9 10 11 function editStep(numStep) { switchDiv("step" + numStep + "Recap", "", ""); ShowPage("step" + numStep + "Edit", "' . ClassLien_CalculLien_Ajax("page_custom", "fichier=ajax&which_frame=recap_edit") . '&demandeId=' . $demandeId . '&numStep=" + numStep, "GET", ""); switchDiv("step" + numStep + "Edit", "", ""); var mesScripts = document.getElementById("step" + numStep + "Edit").getElementsByTagName("script"); for (var i = 0; i < mesScripts.length; i++) { eval(mesScripts[i].innerHTML); } }
La fonction ShowPage effectue un getXhr classique et place le responseText dans la div passé en paramètre (dans le cas présent, la div step1Edit).

EDIT : Quand je fait un alert(mesScripts.length), j'obtient 0, il n'a donc pas l'air de détecter les scripts présents dans ma fonction Ajax

26/08/2011, 11h26
Torgar

Tu peux nous montrer ce qu'affiche ta fonction AJAX s'il te plait ?

Parce que si ta fonction loadTypeIntervention n'est pas chargée via l'AJAX entre des balises <script> c'est normal qu'il ne se passe rien. C'est ce que j'avais compris au départ. Il semblerait que je me sois trompé :oops:

Oui voila le contenu chargé dans le div step1Edit :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
 
/* Pleins de balises meta */
 
<script type="text/javascript">
  function loadTypeIntervention(idParent)
  {
    if (idParent == 16) {
      var otherId = 1;
    } else {
      var otherId = 16;
    }
 
    document.getElementById("imgInterv" + idParent).style.border = "2px solid green";
    document.getElementById("imgInterv" + otherId).style.border  = "none";
    document.getElementById("tdCheck" + idParent).innerHTML = "<img src=\"/graphisme_global/picto-check.gif\" />";
    document.getElementById("tdCheck" + otherId).innerHTML  = "";
    document.getElementById("interv" + idParent + "-1").style.display = "table-cell";
    document.getElementById("interv" + otherId + "-1").style.display  = "none";
    document.getElementById("interv" + otherId + "-2").style.display  = "none";
    document.getElementById("interv" + otherId + "-3").style.display  = "none";
  }
 
  function addInterv(idIntervention, numIntervention, parentInterventionId)
  {
    if (numIntervention != "3") {
      var newIntervNum = Math.round(numIntervention) + 1;
      document.getElementById("interv" + parentInterventionId + "-" + newIntervNum).style.display = "block";
    }
    ShowPage("placebo", "index.php?l_nr=page_custom.php&l_nr_c=5a2d09bf49ab76f2ecb5f19a404b7772&fichier=ajax&which_frame=form1_add_intervention&affiche_contenu_uniquement=true&demandeId=1&interventionId=" + idIntervention + "&numIntervention=" + numIntervention, "GET", "");
  }
 
  function validStep()
  {
    if (document.getElementById("intervention16-1").value != "" || document.getElementById("intervention1-1").value != "") {
      validEditRecap("1");	
    } else {
      alert("Merci de choisir au moins une intervention.");
      return false;
    }
  }
</script>
 
/* Contenu HTML */

Les scripts sont pourtant biens placés dans une balise script :(

26/08/2011, 12h30
Torgar

Et si tu mets ces fonctions dans un fichier functions.js (par exemple), que tu charge dans ton en-tête html, est-ce que ça marche ?

Je continu de regarder pourquoi le code n'est pas évalué (dans mes test en local non plus d’ailleurs).
26/08/2011, 13h01
amoiraud

Citation:

Envoyé par Torgar

Et si tu mets ces fonctions dans un fichier functions.js (par exemple), que tu charge dans ton en-tête html, est-ce que ça marche ?

Je continu de regarder pourquoi le code n'est pas évalué (dans mes test en local non plus d’ailleurs).

En fait je n'ai pas accès à tout le système, je ne peut pas externaliser mes scripts JS :?
26/08/2011, 14h23
Torgar

Et tout simplement mettre tes fonctions dans la page qui exécute l'ajax ?
26/08/2011, 14h41
amoiraud

Citation:

Envoyé par Torgar

Et tout simplement mettre tes fonctions dans la page qui exécute l'ajax ?

Pour l'étape 1 c'est faisable, mais pour les 3 autres j'ai des tableaux et des boucles PHP que je ne peut pas utiliser dans la page qui exécute l'ajax