c# 电商项目购物车页面


@{
ViewBag.Title = "Cart";
}

<h2>购物车</h2>
<script src="~/Scripts/jquery-3.4.1.js"></script>
<table class="table table-bordered">
<thead style="background-color:aqua">
<tr style="text-align:center">
<td>全选<input id="ckall" onclick="ckAll()" type="checkbox" /></td>
<td>图片</td>
<td>名称</td>
<td>颜色</td>
<td>规格</td>
<td>数量</td>
<td>价格</td>
<td>操作</td>
</tr>
</thead>
<tbody id="tb">
</tbody>
</table>
<input id="Button1" onclick="searchGoods()" type="button" value="支付已选商品" />

<script>
function load() {
var i = 1;
var s = 1;
$.ajax({
url: 'http://localhost:63636/api/Good/ShowCart',
type: 'Get',
dataType: 'Json',
success: function (d) {
$("#tb").empty();
$(d).each(function () {
$("#tb").append(
'<tr style="text-align:center">' +
'<td><input class="cka" value="' + this.CId + '" type="checkbox" /></td>' +
'<td><img style="height:50px;100px" src="' + this.GImg + '" alt="" /></td>' +
'<td>' + this.GName + '</td>' +
' <td>' + this.Color + '</td>' +
'<td>' + this.Big + '</td>' +
' <td><input id="bt1'+s+'" type="button" onclick="bit(-1,'+s+')" value="-" /><span id="sp'+s+'">' + i + '</span><input id="bt2'+s+'" onclick="bit(1,'+s+')" type="button" value="+" /></td>' +
' <td><span id="ss'+s+'">' + this.CPrice + '</span><input id="hd1'+s+'" type="hidden" value="' + this.CPrice + '" /></td>' +
' <td><input id="Button1" type="button" onclick="order(' + this.CId + ')" value="支付" /><input id="Button1" type="button" onclick="del(' + this.CId + ')" value="删除" /></td>' +
'</tr>'
)
s++;
window.gid = this.GId;
})
}
});//显示购物车信息
}
function del(cid) {
if (confirm('是否删除该商品')) {
$.ajax({
url: 'http://localhost:63636/api/Good/DelCart',
data: { id: cid },
type: 'Get',
dataType: 'Json',
success: function (d) {
if (d > 0) {
alert('删除成功');
load();
}
else {
alert('删除失败');
}
}
});//删除购物车商品
}
}
//跳转订单页面
function order(cid) {
location.href = '/Default/Order?id=' + cid + ',' + window.gid;
}
//全选
function ckAll() {
if ($("#ckall").prop("checked")) {
$(".cka").prop("checked", true);
}
else {
$(".cka").each(function () {
this.checked = !this.checked;
})
}
}
function bit(a,s) {
$(("#sp"+s)).text((parseInt(($("#sp"+s)).text()) + a));
var count = $(("#sp"+s)).text();
var cprice = $(("#hd1"+s)).val();
$(("#ss"+s)).text(parseInt(count) * parseInt(cprice));
}
//支付已选商品
function searchGoods() {
var arr = [];
$(".cka:checked").each(function () {
arr.push(this.value);
})
location.href = '/Default/Orders?ids='+arr.toString();
}
load();
</script>

原文地址:https://www.cnblogs.com/rong12/p/13423105.html