添加购物车 jquery preventDefault 不适用于 cakephp 中的多产品

Question

我在这里尝试为多个产品进行购物车选择

<?php foreach ($diagnosis as $diagnosi): ?>
    <td class="actions">
            <?php echo $this->Form->create('Cart',array('id'=>'add-form','url'=>array('controller'=>'carts','action'=>'add')));?>
                <?php echo $this->Form->hidden('product_id',array('value'=>$diagnosi['Diagnosi']['id']))?>
                <?php echo $this->Form->submit('Add',array('class'=>'btn-success btn btn-lg'));?>
                <?php echo $this->Form->end();
            ?>
            </td>
<?php endforeach; ?>

这是我的 jquery 代码

$('#add-form').submit(function(e){
                e.preventDefault();
                var tis = $(this);
                $.post("<?php echo  Router::url(array('controller'=>'carts','action'=>'add'));?>",tis.serialize(),function(data){
                    $('#cart-counter').text(data);
                });
                alert(tis.serialize());
            });

这里的问题是它在搜索产品后对第一个产品有效，但是当我要点击第二个产品时 preventDefault();不管用。这是像这样的输出

Answer 1

问题是 id 在 HTML 文档中必须是唯一的，但是您正在创建多个具有相同 id 的表单元素。尝试使用 class 名称代替：

<?php foreach ($diagnosis as $diagnosi): ?>
<td class="actions">
    <?php echo $this->Form->create('Cart',array('class'=>'add-form','url'=>array('controller'=>'carts','action'=>'add')));?>
    <?php echo $this->Form->hidden('product_id',array('value'=>$diagnosi['Diagnosi']['id']))?>
    <?php echo $this->Form->submit('Add',array('class'=>'btn-success btn btn-lg'));?>
    <?php echo $this->Form->end(); ?>
</td>
<?php endforeach; ?>

而 JS 代码将使用 class 选择器将提交事件绑定到每个表单：

$('.add-form').submit(function(e) {
    // ...
});

添加购物车 jquery preventDefault 不适用于 cakephp 中的多产品

Add cart jquery preventDefault not working for multi product in cakephp

jquery

cakephp