模块和ajax调用

Question

我正在尝试创建一个自定义控制器的ajax调用.

我一直在关注:http://www.atwix.com/magento/ajax-requests-in-magento/ - 它提供了一个如何创建的简短示例.

所以我有以下文件:

app/etc/moudles/BM_Sidebar.xml

<?xml version="1.0"?>
<config>
  <modules>
    <BM_Sidebar>
        <active>true</active>
        <codePool>local</codePool>
    </BM_Sidebar>
  </modules>
</config>

app/code/local/BM/Sidebar/controllers/IndexController.php

class BM_Sidebar_IndexController extends Mage_Core_Controller_Front_Action {

    public function indexAction() {
        echo "test data";
    }
}

app/code/local/BM/Sidebar/controllers/etc/config.xml

<?xml version="1.0"?>
<config>
  <modules>
    <BM_Sidebar>
      <version>0.1.0</version>
    </BM_Sidebar>
  </modules>
  <frontend>
    <routers>
      <sidebar>
        <use>standard</use>
        <args>
          <module>BM_Sidebar</module>
          <frontName>carfilter</frontName>
        </args>
      </sidebar>
    </routers>
    <layout>
      <updates>
        <sidebar>
          <file>sidebar.xml</file>
        </sidebar>
      </updates>
    </layout>
  </frontend>
</config>

我正在努力弄清楚我需要投入什么 sidebar.xml

我需要创建一个块类吗？

谢谢

Answer 1

如何AJAX

1. 它始终从config.xml开始:

   2. 声明您的路由器:使用与frontName标记内容相同的路由器名称

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

   3. 声明你的布局文件(你这样做了)

2. 在布局文件中,您需要2个句柄:1表示init状态,1表示ajax.句柄与您正在使用的URL匹配:

   <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>
   

   注意:注意outputAJAX调用的块声明中的属性

3. 创建您的phtml文件(您在布局文件中声明的文件):

   6. init.phtml:创建将使用AJAX结果更新的div并启动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>
      

   7. ajax.phtml:你想用AJAX显示的html

      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. 控制器:此示例中的2个操作,页面加载时的索引以及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)));
           }
       }
   
   }
   

并且为了回答你的问题,你不一定需要创建自己的块(在我的例子中我没有),但你可能希望在一个方便的地方拥有模板文件中所需的功能