La requête Ajax utilisant mootools ne fonctionne pas

Question

J'essaye de charger le contenu dans un div avec le tutoriel this. Malheureusement, cela charge simplement le fichier HTML en tant que nouvelle page.

C'est le javascript qui devrait faire le travail

window.addEvent('domready', function() { 

     $('runAjax').addEvent('click', function(event) { 
         event.stop(); 
         var req = new Request({ 
             method: 'get', 
             url: $('runAjax').get('href'), 
             data: { 'do' : '1' }, 
             onRequest: function() { alert('The request has been made, please wait until it has finished.'); }, 
        onComplete: function(response) { alert('Response received.); $('container').set('html', response); } 
         }).send(); 
$('runAjax').removeEvent('click'); 
     }); 
}); 

c'est le lien qui devrait lancer la fonction

<a href="about.html" id="runAjax" class="panel">Profil</a> 

et c'est la structure div-de index.html. Je veux que le contenu soit chargé dans le « conteneur » -div

<div id="view"> 
    <div id="sidebar"> 
     mib 
    </div> 

    <div id="container"> 
     <div id="logo"> 
      <!--img src="img/logo.png"--> 
     </div> 

     <div align="center" id="tagline"> 
      content 
     </div> 
    </div> 
</div> 

Je ne se soucient vraiment ce script que j'utilise aussi longtemps que son compatible avec MooTools 1.2, parce que j'ai besoin pour un panneau supérieur coulissant et il serait être beaucoup plus de travail pour le changer en un panneau jquery par exemple.

Answer 1

Il y a un «manque ici:

alert('Response received.); 

Answer 2

Vous rendre les choses plus compliquées que vous avez besoin. Essayez ceci:

window.addEvent('domready', function(){ 
    function loadPage(url) { 
     $('container').load(url); 
    } 

    $('runAjax').addEvent('click', function(e) { 
     e.stop(); 
     loadPage(this.get('href')); 
     this.removeEvent('click', loadPage); 
    }); 
}); 

Si cela ne fonctionne pas, démarrez Firebug et voyez quelles erreurs Javascript sont enregistrées. Voici la référence pour le raccourci Element.load():

http://mootools.net/docs/core/Request/Request.HTML#Element:load

Answer 3

Vous n'êtes pas l'arrêt de l'événement click comme recommandé.

au lieu de:

event.stop();

faire:

new Event(event).stop();