一直试图解决这个问题几个小时,但无法让它发挥作用!
我跟随this tutorial使用Ajax和CakePHP实现简单的购物车功能
在CartsController中,我们必须设置:$ this-> autoRender = false;因为Ajax调用不需要加载“ADD”。视图。但是,当我点击“添加到购物车”时按钮,它返回一个具有正确数量编号的空白页面。如果我返回页面并刷新它,那么我可以看到该项目已添加到购物车中。
如何从加载中禁用此空白页面(带有数量)并让Ajax更新购物车计数器?
CakePHP的:
public function add() {
$this->autoRender = false;
if ($this->request->is('post')) {
$this->Cart->addProduct($this->request->data['Cart']['product_id']);
}
echo $this->Cart->getCount();
}
供参考:
的Ajax:
<script>
$(document).ready(function(){
$('#add-form').submit(function(e){
e.preventDefault();
var tis = $(this);
$.post(tis.attr('action'),tis.serialize(),function(data){
$('#cart-counter').text(data);
});
});
});
</script>
仅供参考,我在default.ctp中引用了jQuery:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
答案 0 :(得分:0)
请检查是否在自定义javascript代码之前添加了jQuery。如果没有,则不会加载$
变量,并且根本不会执行您的ajax调用。
答案 1 :(得分:0)
$('#add-form').submit(function(e){
e.preventDefault();
var tis = $(this);
$.post(tis.attr('action'),tis.serialize(),function(data){
$('#cart-counter').text(data);
});
return false;
});
在表单提交功能中输入return false,因为表单提交将重定向到页面,您必须阻止原始表单提交,因为您发布请求操作。