我有一个addtocart按钮,其数量输入字段在我的网站上正常运行(见下图):
当我在输入字段中引入示例2并按下addtocart按钮时,我的购物车会更新2个项目。
但我想通过下拉字段更改数量输入字段,以便访问者只能在下拉列表中选择一个允许的数量。我可以正确配置下拉字段,但是当我点击addtocart按钮(见下图)时,没有任何反应。
我想我需要改变"输入"通过"选择"在javascript的某个地方。或者也许javascript中的数量或按钮没有正确传输?
经过一些试验,我无法让它运转起来。
有人可以帮我这个吗?我会很高兴(总是挣扎着javascript)
感谢。
输入字段(工作)的html代码是:
<input type="hidden" value="<?=$product['product_id']?>" size="2" name="product_id" />
<input type="hidden" value="<?=$product['gift_products_id']?>" size="2" name="gift_products_id" />
<? if($product['quantity']!==$product['total']){ ?>
<input type="text" value="1" size="2" name="quantity" />
<a class="btn btn-primary addtocart" lang="<?=$product['product_id']?>" href="javascript:void(0)" ><span><?=$_['gr_m_add_to_cart']?></span></a>
<? } ?>
&#34;选择选项&#34;的html代码字段,正确配置但无法正常工作:
<input type="hidden" value="<?=$product['product_id']?>" size="2" name="product_id" />
<input type="hidden" value="<?=$product['gift_products_id']?>" size="2" name="gift_products_id" />
<? if($product['quantity']!==$product['total']){ ?>
<select name="quantity" class="form-control_cart" id="input-quantity" value="1" >
<?php foreach (range(1, $product['quantity'], 1) as $stap) {
if ($stap == 1) {
echo "<option value='$stap' selected>$stap</option>";
} else {
echo "<option value='$stap'>$stap</option>";
}
} ?>
</select>
<a class="btn btn-default addtocart" style="margin-top:-4px" lang="<?=$product['product_id']?>" href="javascript:void(0)" data-toggle="tooltip" title="<?=$_['gr_m_add_to_cart']?>"><i class="fa fa-shopping-cart"></i></a>
<? } ?>
用于addtocart按钮的javascript代码:
$('.addtocart').click(function() {
id = $(this).attr('lang');
$.ajax({
url: 'index.php?route=checkout/cart/add',
type: 'post',
data: $('#row_'+id+' input[type=\'text\'], #row_'+id+' input[type=\'hidden\']'),
dataType: 'json',
beforeSend: function() {
//$('#button-cart').button('loading');
$('.addtocart').button('loading');
},
complete: function() {
//$('#button-cart').button('reset');
$('.addtocart').button('reset');
},
success: function(json) {
$('.alert, .text-danger').remove();
$('.form-group').removeClass('has-error');
if (json['error']) {
if (json['error']['option']) {
for (i in json['error']['option']) {
var element = $('#input-option' + i.replace('_', '-'));
if (element.parent().hasClass('input-group')) {
element.parent().after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
} else {
element.after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
}
}
}
if (json['error']['recurring']) {
$('select[name=\'recurring_id\']').after('<div class="text-danger">' + json['error']['recurring'] + '</div>');
}
// Highlight any found errors
$('.text-danger').parent().addClass('has-error');
}
if (json['success']) {
if (!Journal.showNotification(json['success'], json['image'])) {
$('.breadcrumb').after('<div class="alert alert-success success">' + json['success'] + '<button type="button" class="close" data-dismiss="alert">×</button></div>');
}
$('#cart-total').html(json['total']);
$('html, body').animate({ scrollTop: 0 }, 'slow');
$('#cart ul').load('index.php?route=common/cart/info ul li');
}
}
});
});
答案 0 :(得分:1)
你应该改变这行代码:
data: $('#row_'+id+' input[type=\'text\'], #row_'+id+' input[type=\'hidden\']'),
到:
data: $('#row_'+id+' input[type=\'text\'], #row_'+id+' input[type=\'hidden\'], #row_'+id+' select'),
只需将select元素添加到数据中,使用您想要的类或ID。