ASP.Net 订单

@{
    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>
View Code
@{
    ViewBag.Title = "Detail";
}

<h2>商品详情</h2>
<script src="~/Scripts/jquery-3.4.1.js"></script>
<div id="d1" style="float:left">
    @*显示商品*@
</div>

<div id="d2" style="float:left">
    @*显示商品类别信息*@
    <table>
        <tr>
            <td>价格:<span id="s1"></span></td>
        </tr>
        <tr id="t1">
            <td></td>
        </tr>
        <tr>
            <td>浅蓝<input id="rd1" name="color" value="浅蓝" onclick="hehe()" type="radio" /></td>
        </tr>
        <tr id="t2">
            <td></td>
        </tr>
    </table>
    <input id="Button1" onclick="save()"    type="button" value="加入购物车" />
</div>

<script>
    function hehe() {
        alert('目前没有货');
        $("#d2").append(
            '<input id="bt1" onclick="lala()" type="button" value="到货通知" />'
        );
        $("#Button1").attr("disabled", true);
    }
    function lala() {
        $("#bt1").css("color","red");
    }
    function load() {
        $.ajax({
            url: 'http://localhost:63636/api/Good/ShowGood',
            data: {id:@ViewBag.ls},
            type: 'Get',
            dataType: 'Json',
            success: function (d) {
                $("#d1").empty();
                $(d).each(function () {
                    $("#d1").append(
                        '<table style="float:left">' +
                        '<tr style="text-align:center">' +
                        '<td><img style="height:600px;400px" src="' + this.GImg + '" alt="" /></td>' +
                        ' </tr>' +
                        '<tr style="text-align:center">' +
                        '  <td>价格:2000</td>' +
                        '</tr>' +
                        ' <tr style="text-align:center">' +
                        '  <td>' + this.GName + '</td>' +
                        '  </tr>' +
                        '  </table>'
                    )
                })
            }
        });//显示商品图片信息

        $.ajax({
            url: 'http://localhost:63636/api/Good/ShowColor',
            data: {gid:@ViewBag.ls},
            type: 'Get',
            dataType: 'Json',
            success: function (d) {
                $("#t1").empty();
                $("#t1").append('颜色:');
                $(d).each(function () {
                    $("#t1").append(
                        '<td><input id="rd1" name="color" value="' + this.VName + '" type="radio" />' + this.VName + '</td>'
                    )
                })
            }
        });//显示商品图片信息
        $.ajax({
            url: 'http://localhost:63636/api/Good/ShowBig',
            data: {gid:@ViewBag.ls},
            type: 'Get',
            dataType: 'Json',
            success: function (d) {
                $("#t2").empty();
                $("#t2").append('规格:');
                $(d).each(function () {
                    $("#t2").append(
                        '<td><input id="rd2" value="' + this.VName + '" onclick="price(' + this.VId + ')" name="big" type="radio" />' + this.VName + '</td>'
                    )
                })
            }
        });//显示商品图片信息
    }

    function price(id) {
        $.ajax({
            url: 'http://localhost:63636/api/Good/ShowPrice',
            data: { gid:@ViewBag.ls, vid: id },
            type: 'Get',
            dataType: 'Json',
            success: function (d) {
                $("#s1").empty();
                $(d).each(function () {
                    $("#s1").append(this.Price)
                })
            }
        });//显示价格
    }

    function save() {
        var obj = {};
        obj.Color = $("#rd1:checked").val();
        obj.GId =@ViewBag.ls;
        obj.Big = $("#rd2:checked").val();
        obj.CPrice = $("#s1").text();
        $.ajax({
            url: 'http://localhost:63636/api/Good/Cart',
            data:  obj ,
            type: 'Post',
            dataType: 'Json',
            success: function (d) {
                if (d > 0) {
                    alert('添加成功');
                }
                else {
                    alert('添加失败');
                }
            }
        });//添加购物车
    }
    load();
</script>
View Code
@{
    ViewBag.Title = "Order";
}

<h2>支付订单</h2>
<script src="~/Scripts/jquery-3.4.1.js"></script>


<div id="dd">
    
</div>


<script>
    var i;
    function load() {
        i = 1;
        $.ajax({
            url: 'http://localhost:63636/api/Good/ShCart',
            data: {id:@ViewBag.id},
            type: 'Get',
            dataType: 'Json',
            success: function (d) {
                $("#dd").empty();
                $(d).each(function () {
                    $("#dd").append(
                          '<table class="table table-bordered">'+
                        '<tr style="text-align:center">' +
                                    '<td>图片:</td>'+
                                   ' <td><img style="height:30px;40px" src="' + this.GImg + '" alt="" /></td>'+
                              '  </tr>'+
                                '<tr style="text-align:center">'+
                        '  <td>名称:</td>' +
                        '  <td>' + this.GName + '</td>' +
                               ' </tr>'+
                                '<tr style="text-align:center">'+
                        '   <td>颜色:</td>' +
                        '   <td>' + this.Color + '</td>' +
                              '  </tr>'+
                               ' <tr style="text-align:center">'+
                                 '   <td>规格:</td>'+
                               '     <td>'+this.Big+'</td>'+
                               ' </tr>'+
                               ' <tr style="text-align:center">'+
                        '  <td>数量:</td>' +
                        '   <td><input id="bt1" type="button" onclick="bit(-1)" value="-" /><span id="sp">' +i+ '</span><input id="bt2" onclick="bit(1)" type="button" value="+" /></td>' +
                               ' </tr>'+
                                '<tr style="text-align:center">'+
                        '  <td>价格:</td>' +
                        '    <td><span id="ss">' + this.CPrice + '</span><input id="hd1" type="hidden" value="' + this.CPrice + '" /></td>' +
                        '  </tr>' +
                        '<tr style="text-align:center">'+
                        '  <td>付款人:</td>' +
                        ' <td>' + this.UName + '</td>' +
                        '  </tr>' +
                        ' <tr style="text-align:center">'+
                                  '<td>地址:</td>'+
                                   ' <td><input id="txt1" type="text" /></td>'+
                        ' </tr>'+
                        ' <tr style="text-align:center">'+
                                  '  <td>手机号:</td>'+
                                   ' <td><input id="txt2" type="text" /></td>'+
                               ' </tr>'+
                               ' <tr style="text-align:center">'+
                                  '  <td></td>'+
                                   ' <td><input id="Button1" type="button" onclick="pay()" value="付款" /></td>'+
                               ' </tr>'+
                           ' </table>'
                    )
                })
                window.price = this.CPrice;
            }
        });//显示商品图片信息
    }


    function bit(a) {
        $("#sp").text((parseInt($("#sp").text()) + a));
        var count = $("#sp").text();
        var cprice = $("#hd1").val();
        $("#ss").text(parseInt(count) * parseInt(cprice));
    }

    function pay() {
        var obj = {};
        obj.GNum = $("#sp").text();
        obj.GPrice = $("#ss").text();
        obj.Sites = $("#txt1").val();
        obj.Phone = $("#txt2").val();
        obj.IsPub = 0;
        obj.CId =@ViewBag.id;
        obj.GId=@ViewBag.gid;
        $.ajax({
            url: 'http://localhost:63636/api/Good/AddOrder',
            data:  obj ,
            type: 'Post',
            dataType: 'Json',
            success: function (d) {
                if (d > 0) {
                    alert('添加成功');
                    location.href = '/Default/ShowOrder';
                }
                else {
                    alert('添加失败');
                }
            }
        });//添加订单
    }
    load();
</script>
View Code
原文地址:https://www.cnblogs.com/XJNB/p/13424315.html