magento中ajax的基本实现

时间:2013-04-26 07:55:53

标签: magento

我是magento的新手并试图实现ajax,但无法找到合适的教程。任何人都可以给我一些参考或指导我到哪里找到它吗?

1 个答案:

答案 0 :(得分:0)

不知道一个tutotial,但我可以解释一下我在一个月后在项目中实现的内容。

我创建了一个控制器,我们可以在该控制器上针对特定操作触发AJAX请求。在这种情况下,我们自定义getoptionsAction模块的IndexController中的Offerte

我的控制器中的getoptionsAction需要product_id并加载产品的选项。它在函数端构建HTML和echo。

在phtml文件中,我有以下代码来调用AJAX请求并在前端更新html-object:

function get_options(prod_id){
    var product_options = $('product_options');
    var prod_id = $('product').getValue();
    new Ajax.Updater('product_options', 
        '<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB); ?>offerte/index/getoptions', 
        { method: 'get',parameters: {prod_id: prod_id, type: 'get_regular_options' } ,
        onCreate: function(){
            $('loading-img-options').show();
        },
        onComplete: function (t) {
            $('loading-img-options').hide();
            $('product_options').show();
        }
    });
}

上面的函数使用Ajax.Updater。您还可以使用Ajax.Request来获取结果。

function stripslashes(str) {
    return str.replace(/\\'/g,'\'').replace(/\"/g,'"').replace(/\\\\/g,'\\').replace(/\\0/g,'\0');
}

function get_products(){
    product = $('product');
    cat_id = $('category').value;
    new Ajax.Request('<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB); ?>offerte/index/getproducts', 
        {method: 'get', parameters: {cat_id: cat_id, mode: 'offerte'},
        onCreate: function(){
            $('product-loading').show();
            $('product_options').hide();
        },
        onSuccess: function(t) {
            resp = jQuery.parseJSON(t.responseText);
            $('prod-container').innerHTML = resp.options ? stripslashes(resp.options) : '<?php echo $this->__('No options found') ?>';
            $('product-loading').hide();
        }
    });
}

(请注意我使用JQuery来parseJSON。你也可以使用String.evalJSON,但我在这里很懒:-) 使用Ajax.Request,您需要将控制器的结果作为JSON返回。我在我的控制器中使用下面的代码将JSON返回到我们的phtml中,以便在上面的onSuccess Callback函数中使用:

$this->getResponse()->setBody(Zend_Json::encode($result));

希望这有任何帮助