Module and ajax call

Question

I\'m trying to create an ajax call to a custom controller.

I\'ve been following: http://www.atwix.com/magento/ajax-requests-in-magento/ - which gives a brief example of

Answer 1

How To AJAX

1. it always starts at the config.xml:

   2. declare your router: use the same router name as the content of the frontName tag

      
          
              
                  standard
                  
                      BM_Sidebar
                      carfilter
                  
              
          
      
      

   3. declare your layout file (you did that)

2. in your layout file you need 2 handles: 1 for the init state and one for the ajax. The handles match the url you are working with:

   
       
           
               skin_jsjs/carfilter.js
           
           
               
           
       
   
       
           
           
           
       
   
   

   note: pay attention to the output attribute in the declaration of the block for the AJAX call

3. create your phtml files (the ones you declared in the layout file):

   6. init.phtml: create the div that will be updated with the result of the AJAX and initiate the javascript object

      first state
      
      
      

   7. ajax.phtml: the html you want to show with the 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. the controller: 2 actions in this example, the index when the page loads, and the ajax:

   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)));
           }
       }
   
   }
   

And for answering your question, you don't necessarily need to create your own block (in my example I haven't), but you will probably want to to have the functions needed in the template files in a handy place