prototypeJS interaction DOM et AJAX

J'ai une question conceptuelle DOM - j'espère que c'est logique.prototypeJS interaction DOM et AJAX

Ma page (appelez-la 'Main') a le prototypeJS AJAX Updater dessus, je sélectionne un enregistrement à éditer et qui appelle une 'page B' (une partie) dans un div sur la page 'Main' . Quand je clique sur le formulaire dans le partial, il appelle la fonction sur le 'Main' - cependant le Updater est "Supposed To" mettre à jour un div sur le partiel ... mais il ne le fait jamais. Je suis assez sûr que les DOM ne peuvent pas le trouver parce qu'il a été rendu ou apporté dans le principal ...

Comment puis-je résoudre ce ???

MAIN

<script> 
// pulls page B into Main div 
function getItem(id) { 
    var url = 'itemDetails.php'; 
    var pars = { id:id }; 
    var myAjaxOpts = new Ajax.Updater('itemDetail', url, { 
      method:'post' 
      ,parameters:pars 
      ,evalScripts:true 
     }); 
} 

// post form and expects messages in 2 places (1) the upated div (on page B) and the message div on Main 
// Only main showing up 
function assignItem(frm) { 
    var url = 'assignItem.php'; 
    var pars = Form.serialize(frm); 
    var myAjaxOpts = new Ajax.Updater('subMessage', url, { 
      method:'post' 
      ,parameters:pars 
      ,evalScripts:true 
      ,onSuccess: function(response){ 
       //console.log('request ready to be made'); 
       $('mainMessage').update(response); 
      } 
     }); 
} 
</script> 

<!-- page A - Main --> 
<div id="mainMessage"></div> 
<ul> 
    <li><a onClick="getItem(1);">item 1</a></li> 
    <li><a onClick="getItem(2);">item 2</a></li> 
    <li><a onClick="getItem(3);">item 3</a></li> 
</ul> 
<div id="itemDetail"></div> 
<!-- end page A -->

Page B (la partie)

<!-- page B - Partial --> 
<div id="subMessage"></div> 
<form> 
    -- edit record --- 
<input type="button" onClick="assignItem(this.form);" ></form> 
<!-- end page B -->

BTW - il convient de noter que c'est un échantillon 'réduit' (et peut avoir des fautes de frappe), Je récupère les données comme prévu, il n'y a pas de problèmes avec l'AJAX, c'est simplement que le div dans le partiel ne semble pas être disponible pour la fonction sur le Main.

Thx

Source

2013-05-24 jpmyob

Avez-vous essayé sans envelopper la page partielle dans une balise '' ? juste sortir le div "nu"? Parce que cela place une balise '' au milieu de la page, son code HTML invalide et le javascript peuvent apparaître sur cette balise. –

sry Geek ... qui est là juste comme exemple - je vais l'enlever - mais actuellement - c'est juste une table qui est retournée ... – jpmyob

Y at-il des messages d'erreur? Veuillez déboguer votre application pour savoir quelle partie de celle-ci ne fonctionne pas. Est-ce que 'assignItem' est appelé? La deuxième requête ajax est-elle envoyée et reçue? Le rappel 'onSuccess' est-il exécuté? A quoi ressemble le DOM à ce moment? Est-ce que cela fonctionne sans le premier ajax updater? – Bergi

Modifiez simplement l'ID de la mise à jour.

changer ceci: $('mainMessage').update(response);

par: $('subMessage').update(response);

Source

2013-05-25 16:10:00

prototypeJS interaction DOM et AJAX

Répondre

Questions connexes