【发布时间】：2021-02-17 19:50:05
【问题描述】：
我的主页上有这个
每次客户点击Add to cart都会变成这个，数据会插入到我的数据库中
我使用 AJAX 来防止页面重新加载/刷新
<script type="text/javascript">
$(document).ready(function(){
$('#Insert_form').submit(function(){
event.preventDefault();
var that = $(this);
$.ajax({
url: "{% url 'batchaddtocartHomepage' %}",
type: 'POST',
data: that.serialize()
,success: function(data){
console.log('Success!');
}
});
return false;
});
});
</script>
我的意见.py
def batchaddtocartHomepage(request):
.....
insert = CustomerPurchaseOrderDetail(
....
)
insert.save()
data = {}
data['success'] = True
return HttpResponse(json.dumps(data), content_type="application/json")
这是我的html
{% for product in bought_item %}
<div class="col-sm-4">
<div class="product-image-wrapper">
<div class="single-products">
<div class="productinfo text-center">
<img src="{{product.image.url}}" style="width:250px;height:250px;" alt="" />
<form method="POST" id="Insert_form" enctype="multipart/form-data">{% csrf_token %}
<span style="text-decoration: line-through;">₱ {{product.price}}</span>
<h2><span >{{product.other_discount_price_formula|floatformat:'2'|intcomma}}</span></h2>
<div style="height: 65px;"><p>{{product.product}}</p></div>
<div id="qty" style="display:none;">
<div class="quantity buttons_added" style="width: 30%;">
<input type="submit" value="-" class="minus" formaction="/updatecart_index/">
<input type="number" step="1" min="1" max="99" name="quantity" value="1" title="Qty" class="divshow input-text qty text" size="4" pattern="" inputmode="">
<input type="submit" value="+" class="plus" formaction="/updatecart_index/">
</div>
</div>
<input type="submit" value="Add to cart" id="btn" onclick="myFunction()" class="btn btn-default add-to-cart">
</form>
</div>
</div>
<div class="choose">
<ul class="nav nav-pills nav-justified">
<li><a href="{% url 'Vegetables' %}?id={{product.id}}"><i class="fa fa-plus-square"></i>View Product 1</a></li>
</ul>
</div>
</div>
</div>
{% endfor %}
我的脚本
<script>
function myFunction() {
var x = document.getElementById("qty");
var btn = document.getElementById("btn");
if (x.style.display === "none") {
x.style.display = "none";
} else {
x.style.display = "block";
}
}
</script>
问题我遇到了，只有刷新页面时按钮才会改变。
这是我想在我自己的网站https://www.landers.ph/ 上做的事情（请尝试点击landers.ph 网站的按钮）我希望它能让您了解我想要什么功能。
更新我删除了script，并在我的ajax中添加了一些代码
<script type="text/javascript">
$(document).ready(function(){
$('#Insert_form').submit(function(){
event.preventDefault();
var that = $(this);
$.ajax({
url: "{% url 'batchaddtocartHomepage' %}",
type: 'POST',
data: that.serialize()
,success: function(data){
console.log('Success!');
var x = document.getElementById("qty");
var btn = document.getElementById("btn");
x.style.display = "block";
btn.style.display = "none";
}
});
return false;
});
});
</script>
我的问题是当我点击大鸡蛋（1 个托盘）Add to cart 时，Papaya Solo Ripe（1 个）按钮发生了变化
【问题讨论】：
-
你的意思是
remove按钮？那个按钮在哪里？我在你的代码中没有看到那个按钮。 -
当用户点击我使用的
Add to cartinput type submit时删除 -
那么，您需要更改该按钮以删除按钮吗？但是你的js代码是为了隐藏那个按钮？另外，请详细说明您面临的问题。我看到您的网站在刷新后显示了
remove按钮。但刷新后我没有看到任何按钮，也只有数量 div 显示在产品下方。跨度> -
如果用户点击
<input type="submit" value="Add to cart" id="btn" onclick="myFunction()" class="btn btn-default add-to-cart">，它将变为quantity +/- -
我只想将landers.ph 的功能添加到我的网站