私はマジェントの初心者で、ajaxを実装しようとしていますが、従うべき適切なチュートリアルが見つかりません。誰かが私に参照を提供したり、私がそれを見つけることができる場所に案内してくれませんか?
1 に答える
チュートリアルはわかりませんが、1 か月前にプロジェクトで実装したことを少し説明できます。
特定のアクションで AJAX リクエストを発行できるコントローラーを作成しました。この場合、getoptionsAction
カスタムIndexController
モジュールのOfferte
です。
getoptionsAction
私のコントローラーの は、product_id
製品のオプションを取得してロードします。HTML を構築し、関数の最後に this をエコーします。
phtmlファイルには、AJAXリクエストを呼び出してフロントエンドでhtmlオブジェクトを更新する次のコードがあります。
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 を使用して JSON を解析していることに注意してください。String.evalJSON も使用できますが、ここでは怠惰でした :-) Ajax.Request を使用すると、コントローラーからの結果を JSON として返す必要があります。コントローラーで以下のコードを使用して JSON を phtml に返し、上記の onSuccess Callback 関数で使用します。
$this->getResponse()->setBody(Zend_Json::encode($result));
これが役に立てば幸いです