我有一个购物车和一个显示表格中所有产品的页面。我能够删除产品,但我希望能够改变它们的数量。
我的表格包含一个输入字段,您可以在点击“更新”时更改数量。下面的购物车按钮,我将产品名称和数量发送到我的PHP脚本。问题是,它总是发布第一个产品。
可能因为所有人都有相同的班级名称,我该怎么办呢?
这就是我的表格:
<div class="col-md-8">
<div class="kl-title-block clearfix text-left tbk-symbol--line tbk-icon-pos--after-title">
<h2 class="tbk__title montserrat fs-34 fw-semibold black winkelmandtitle">Uw Winkelmand</h2>
<span class="tbk__symbol ">
<span></span>
</span>
<h4 class="tbk__subtitle fs-22 fw-thin">Bent u niets vergeten?</h4>
</div>
<div class="table-responsive">
<table class="table carttable">
<thead>
<tr>
<th>Verwijder</th>
<th>Afbeelding</th>
<th>Product</th>
<th>Prijs</th>
<th>Aantal</th>
<th>Totaal</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="#" class="remove" id="Bad 13" title="Verwijder dit product">×</a></td>
<td>
<a href="baden/bad-13" class="product-title">
<img class="attachment-shop_thumbnail" src="images/defaultimage.jpg" alt="Bad 13" title="Bad 13">
</a>
</td>
<td>
<a href="baden/bad-13" class="product-title">
Bad 13
</a>
</td>
<td>€ 1500</td>
<td>
<div class="quantity">
<input type="number" step="1" min="0" name="quantity" id="Bad 13" value="1" title="Qty" class="input-text qty quantityclass text" size="4">
</div>
</td>
<td>€ 1500</td>
</tr>
</tbody>
<tbody>
<tr>
<td><a href="#" class="remove" id="Bad 14" title="Verwijder dit product">×</a></td>
<td>
<a href="baden/bad-14" class="product-title">
<img class="attachment-shop_thumbnail" src="images/defaultimage.jpg" alt="Bad 14" title="Bad 14">
</a>
</td>
<td>
<a href="baden/bad-14" class="product-title">
Bad 14
</a>
</td>
<td>€ 800</td>
<td>
<div class="quantity">
<input type="number" step="1" min="0" name="quantity" id="Bad 14" value="1" title="Qty" class="input-text qty quantityclass text" size="4">
</div>
</td>
<td>€ 800</td>
</tr>
</tbody>
<tbody>
<tr>
<td><a href="#" class="remove" id="Bad 1" title="Verwijder dit product">×</a></td>
<td>
<a href="baden/bad1" class="product-title">
<img class="attachment-shop_thumbnail" src="cms/images/bad.jpg" alt="Bad 1" title="Bad 1">
</a>
</td>
<td>
<a href="baden/bad1" class="product-title">
Bad 1
</a>
</td>
<td>€ 1000</td>
<td>
<div class="quantity">
<input type="number" step="1" min="0" name="quantity" id="Bad 1" value="1" title="Qty" class="input-text qty quantityclass text" size="4">
</div>
</td>
<td>€ 1000</td>
</tr>
</tbody>
</table>
<input type="submit" class="button updatebutton" name="update_cart" value="Wijzig winkelmand">
</div>
</div>
这是我的jquery脚本,它会触发一个ajax帖子。
//Wijzig winkelmand met het aantal producten
tpj('.cartsection').on('click', '.updatebutton', function(event) {
var $edit = tpj('.quantityclass').attr('id'),
$aantal = tpj('.quantity').find( "input[name='quantity']" ).val(),
url = 'includes/cartoverzicht.php';
var posting = tpj.post( url, { edit: $edit, aantal: $aantal} );
posting.done(function( data ) {
var content = tpj( data );
tpj( "#cartresult" ).empty().append( content );
});
});
问题是,当我查看网络时,无论我点击什么产品,都会发布此消息:
edit:Bad 13
aantal:1
我该如何解决?
我可以将所有数量发布到我的PHP脚本吗?什么是最好的解决方案?
答案 0 :(得分:1)
问题在于:
var $edit = tpj('.quantityclass').attr('id'),
您正在使用类选择器来获取值,它始终返回第一个元素值。而是使用this
见这个例子:
$(document).ready(function(){
$('.list').click(function(){
console.log( $('.list').html() );
});
$('.listing').click(function(){
console.log( $(this).html() );
});
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>
First list (It always return the first element value)
</p>
<li class="list">One</li>
<li class="list">Two</li>
<li class="list">Three</li>
<p>
Another List (It always return the clicked element value)
</p>
<li class="listing">One</li>
<li class="listing">Two</li>
<li class="listing">Three</li>
&#13;
答案 1 :(得分:1)
你正在遇到问题,因为你只是抓住了第一个选择器。您还设计了API,以便在您希望发送整个更新集时仅发送一个更新。
如果您想更新整个购物车的数量,可以采用以下方法。
$counter = count($_POST['tkt-slctr-qty-346']);
$image = '';
for($i=0; $i< $counter; $i++)
{
$data = $_POST['tkt-slctr-qty-346'][$i];
//Then Write the code that processes the data here
}