Module et appel ajax

Comment AJAX

1. il commence toujours à l'config.xml:

   1. déclarer votre routeur: utiliser le même nom de routeur que le contenu de la frontName tag

      <frontend>
          <routers>
              <carfilter>
                  <use>standard</use>
                  <args>
                      <module>BM_Sidebar</module>
                      <frontName>carfilter</frontName>
                  </args>
              </carfilter>
          </routers>
      </frontend>

   2. déclarer votre fichier de mise en page (vous n'avez qu')

2. dans votre fichier de mise en page vous avez besoin de 2 poignées: 1 pour l'init de l'état et un pour l'ajax. Les poignées correspondre à l'url que vous travaillez avec:

   <layout version="0.1.0">
       <carfilter_ajax_index>
           <reference name="head">
               <action method="addItem"><type>skin_js</type><name>js/carfilter.js</name></action>
           </reference>
           <reference name="content">
               <block type="core/template" name="carfilter" as="carfilter" template="carfilter/init.phtml" />
           </reference>
       </carfilter_ajax_index>
   
       <carfilter_ajax_ajax>
           <remove name="right"/>
           <remove name="left"/>
           <block type="core/template" name="carfilter_ajax" as="carfilter_ajax" template="carfilter/ajax.phtml" output="toHtml" />
       </carfilter_ajax_ajax>
   </layout>

   note: attention à l' output attribut dans la déclaration du bloc de l'appel AJAX

3. créer votre phtml fichiers (ceux que vous avez déclarés dans le fichier de mise en page):

   1. init.phtml: création de la div qui sera mis à jour avec le résultat de l'AJAX et de lancer l'objet javascript

      first state
      <div id="div-to-update"></div>
      <script type="text/javascript">
      //<![CDATA[
          new Carfilter('<?php echo $this->getUrl('carfilter/ajax/ajax') ?>', 'div-to-update');
      //]]>
      </script>

   2. ajax.phtml: le code html que vous voulez montrer à l'AJAX

      var Carfilter = Class.create();
      Carfilter.prototype = {
          initialize: function(ajaxCallUrl, divToUpdate) {
              this.url = ajaxCallUrl;
              this.div = divToUpdate;
              this.makeAjaxCall();
          },
      
          makeAjaxCall: function() {
              new Ajax.Request(this.url, {
                  onSuccess: function(transport) {
                      var response = transport.responseText.evalJSON();
                      $(this.div).update(response.outputHtml);
                  }.bind(this)
              });
          }
      };

4. le contrôleur: 2 actions dans cet exemple, l'index lorsque la page se charge, et l'ajax:

   <?php
   
   class BM_Sidebar_AjaxController extends Mage_Core_Controller_Front_Action
   {
   
       public function indexAction()
       {
           $this->loadLayout();
           $this->_initLayoutMessages('customer/session');
           $this->getLayout()->getBlock('head')->setTitle($this->__('Page title'));
           $this->renderLayout();
       }
   
       public function ajaxAction()
       {
           $isAjax = Mage::app()->getRequest()->isAjax();
           if ($isAjax) {
               $layout = $this->getLayout();
               $update = $layout->getUpdate();
               $update->load('carfilter_ajax_ajax'); //load the layout you defined in layout xml file
               $layout->generateXml();
               $layout->generateBlocks();
               $output = $layout->getOutput();
               $this->getResponse()->setHeader('Content-type', 'application/json');
               $this->getResponse()->setBody(Mage::helper('core')->jsonEncode(array('outputHtml' => $output)));
           }
       }
   
   }

Et pour répondre à votre question, vous n'avez pas nécessairement besoin de créer votre propre bloc (dans mon exemple je n'ai pas), mais vous voudrez probablement avoir les fonctions nécessaires dans les fichiers de modèle dans un endroit très pratique