关于c#购物车的地址的增删改查(mvc,详细注释)

就是简简单单的增删改查,也没什么特殊的或者特别难的业务逻辑,二级联动用一张表的自连接做的,注释都加在代码中了,不多说了,代码如下:

1.首先是我们的实体类数据模型层(model)

地址详情表:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace G5.Exam03.Day12.Models
{
    public class ShAddress
    {
        public int AId { get; set; }
        public string AName { get; set; }
        public string Area { get; set; }
        public string Dzhi { get; set; }
        public string hanSet { get; set; }
    }
}
ShAddress

二级联动用的区域表:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace G5.Exam03.Day12.Models
{
    public class Qy
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public int QId { get; set; }
    }
}
Qy

2.ado调用:

地址的dal层:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using G5.Exam03.Day12.Models;
namespace G5.Exam03.Day12.Dal
{
    public class AddressDal
    {
        DBHelper db = new DBHelper();
        //地址显示
        public List<ShAddress> GetList()
        {
            string sql = "select * from ShAddress";
            return db.GetToList<ShAddress>(sql);
        }
        //删除功能
        public int Del(int id)
        {
            string sql = $"delete from ShAddress where AId={id}";
            return db.ExecuteNonQuery(sql);
        }
        //添加的sql语句及方法
        public int Upt(ShAddress model)
        {
            string sql = $"Update ShAddress set AName='{model.AName}',Area='{model.Area}',Dzhi='{model.Dzhi}',hanSet='{model.hanSet}' where AId={model.AId}";
            return db.ExecuteNonQuery(sql);
        }
    }
}
AddressDal

省市及添加,反填的dal层:

这两个ado调用层其实可以写在一块的,具体看您要实现的功能及要求:

using G5.Exam03.Day12.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace G5.Exam03.Day12.Dal
{
    public class AddDal
    {
        DBHelper db = new DBHelper();
        //省市下拉
        public List<Qy> GetSsList(int qid)
        {
            string sql = $"select * from Qy where QId={qid}";
            return db.GetToList<Qy>(sql);
        }
        //添加的sql语句及方法
        public int Add(ShAddress model)
        {
            string sql = $"insert into ShAddress values ('{model.AName}','{model.Area}','{model.Dzhi}','{model.hanSet}')";
            return db.ExecuteNonQuery(sql);
        }
        //根据id查询数据进行反填
        public List<ShAddress> GetListId(int id)
        {
            string sql = $"select * from ShAddress where AId={id}";
            return db.GetToList<ShAddress>(sql);
        }
    }
}
AddDal

3.控制器(视图)如下(这里其实创建一个控制器就好,具体看要求):

using G5.Exam03.Day12.Dal;
using G5.Exam03.Day12.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Web;
using System.Web.Mvc;

namespace G5.Exam03.Day12.Controllers
{
    public class AddressController : Controller
    {
        AddressDal dal = new AddressDal();
        // GET: Address
        public ActionResult Index()
        {
            return View();
        }
        public int Del(int id)
        {
            return dal.Del(id);
        }
        [HttpGet]
        public JsonResult GetList()
        {
            return Json(dal.GetList(),JsonRequestBehavior.AllowGet);
        }

        public ActionResult Upt(int id)
        {
            ViewBag.id = id;
            return View();
        }
        [HttpPost]
        public int Upt(ShAddress model)
        {
            return dal.Upt(model);
        }
        //根据id获取地址信息->反填
        [HttpPost]
        public JsonResult GetId(int id)
        {
            AddDal add = new AddDal();
            return Json(add.GetListId(id), JsonRequestBehavior.AllowGet);
        }

    }
}
AddressController
using G5.Exam03.Day12.Dal;
using G5.Exam03.Day12.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace G5.Exam03.Day12.Controllers
{
    public class AddController : Controller
    {
        AddDal add = new AddDal();
        // GET: Add
        //为添加视图提供方法
        public ActionResult Add()
        {
            return View();
        }
        //从后台获取到我们要的数据源
        [HttpPost]//
        public int Add(ShAddress model)
        {
            return add.Add(model);
        }

        //为省市提供数据源
        [HttpGet]
        public JsonResult GetSs(int qid)
        {
            return Json(add.GetSsList(qid), JsonRequestBehavior.AllowGet);
        }
        //为区县提供数据源
        [HttpGet]
        public JsonResult GetQx(int qid)
        {
            return Json(add.GetSsList(qid), JsonRequestBehavior.AllowGet);
        }
    }
}
AddController

4.视图层:(view)

地址显示视图:

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>
<input type="button" onclick="Add()" name="name" value="新增收获地址" />
<div id="divMain">
    
</div>
<script>
    //文档就绪函数
    $(function () {
        Show();
    })
    //显示函数
    function Show() {
        $.ajax({
            url: "/Address/GetList",//地址
            dataType: "json",//返回到后台的数据格式
            type: "get",//获取到数据的方式
            success: function (d) {//成功就继续执行后面的代码
                //清空原有的旧数据
                $("#divMain").empty();
                //each遍历显示数据库的数据
                $(d).each(function () {
                    //字符串拼接
                    var str = '<div style="border:solid;color:lightpink;">';
                    str += '收货人:' + this.AName;
                    str += '<img src="../Img/228c96645e893848a8bd68a66c84777f.png" onclick="Del(' + this.AId + ')" Title="删除"  style="float:right;cursor:pointer;"/></br>';
                    str += '所在地区:' + this.Area +'</br>';
                    str += '地址:' + this.Dzhi + '</br>';
                    str += '手机:' + this.hanSet + '<a href="javascript:Edit(' + this.AId +')" style="float:right;cursor:pointer;">编辑</a>';
                    str += '</div></br >';
                    //在div最后面添加要拼接上去的内容
                    $("#divMain").append(str);
                })
            }
        })
    }
    //删除功能实现
    function Del(id) {
        //弹框提示是否要删除
        if (confirm('确认删除吗?')) {
            $.ajax({
                url: "/Address/Del",//地址
                dataType: "json",//返回到后台的数据格式
                data: { id: id },//要向数据库后台发送的数据,前面是你的控制器名称,后面是你发送的值定义好的名称(我这里发送值的名称与控制器名称是一样的)
                type: "post",//获取到数据的方式 post是发送命令到数据库中,get是从数据库获取到数据
                success: function (d) {//成功就继续执行后面的代码
                    if (d > 0) {
                        alert("删除成功!");
                        //调用显示函数进行刷新页面
                        Show();
                    }
                    else {
                        alert("删除失败!");
                    }
                }
            })
        }
        else {
            return false;//选择否,返回false;
        }
        
    }
    //编辑按钮要跳转到编辑页面
    function Edit(id) {
        location.href = '/Address/Upt?id=' + id;
    }
    //添加
    function Add() {
        location.href = '/Add/Add';
    }
</script>
Index.cshtml

地址修改视图:

@{
    ViewBag.Title = "Upt";
}
    <script src="~/Scripts/jquery-3.4.1.min.js"></script>
<h2>Upt</h2>
<table class="table table-bordered">
    <tr>
        <td>收货人:</td>
        <td>
        <input  type="hidden" id="aid"/>
        <input id="aName" type="text" name="name" /></td>
    </tr>
    <tr>
        <td>所在地区:</td>
        <td>
            省市:<select id="Ss" onfocus="BandQ(this.value)"></select>
            区:<select id="q"></select>
        </td>
    </tr>
    <tr>
        <td>地址:</td>
        <td><input id="Dzhi" type="text" name="name" /></td>
    </tr>
    <tr>
        <td>手机:</td>
        <td><input id="hanSet" type="text" name="name" /></td>
    </tr>
    <tr>
        <td colspan="2"><input type="button" onclick="Xg()" name="name" value="修改" /></td>
    </tr>
</table>
<script>
    //文档就绪函数
    $(function () {
        //绑定二级联动的函数
        var id = @ViewBag.id;
        $("#aid").val(id);
        Ft(id);
        BandSel();
    })
    function Ft(id) {
        $.ajax({
            url: "/Address/GetId",
            data: {id:id},
            dataType: "json",
            type: "post",
            success: function (d) {
                // console.log(d);
                alert(d.AId);
                $("#aid").val(d.AId);
                $("#aName").val(d.AName);
                $("#Dzhi").val(d.Dzhi);
                //$("#Ss option:selected").text() + $("#q option:selected").text();
                $("#hanSet").val(d.hanSet);
            }
        })
    }
    //修改函数
    function Xg() {
        var obj = {};
        obj.AId = $("#aid").val();//勿忘我
        obj.AName = $("#aName").val();
        obj.Area = $("#Ss option:selected").text() + $("#q option:selected").text();
        obj.Dzhi = $("#Dzhi").val();
        obj.hanSet = $("#hanSet").val();
        $.ajax({
            url: "/Address/Upt",
            data: { model:obj },
            dataType: "json",
            type: "post",
            success: function (d) {
                if (d > 0) {
                    alert("修改成功!");
                    location.href = '/Address/Index';
                }
                else {
                    alert("修改失败!");
                }
            }
        })
    }
    //绑定下拉 省市绑定
    function BandSel() {
        $.ajax({
            url: "/Add/GetSs",
            data: { qid:0},
            dataType: "json",
            type: "get",
            success: function (d) {
                $("#Ss").empty();
                $(d).each(function () {
                    var str = '<option value="' + this.Id + '">' + this.Name + '</option>';
                    $("#Ss").append(str);
                })
            }
        })
    }
    function BandQ() {
        $.ajax({
            url: "/Add/GetQx",
            data: { qid: $("#Ss").val() },
            dataType: "json",
            type: "get",
            success: function (d) {
                $("#q").empty();
                $(d).each(function () {
                    var str = '<option value="' + this.Id + '">' + this.Name + '</option>';
                    $("#q").append(str);
                })
            }
        })
    }
</script>
Upt.cshtml

地址添加视图:

@{
    ViewBag.Title = "Add";
}

<h2>Add</h2>
<table class="table table-bordered">
    <tr>
        <td>收货人:</td>
        <td><input id="aName" type="text" name="name" value="" /></td>
    </tr>
    <tr>
        <td>所在地区:</td>
        <td>
            省市:<select id="Ss" onfocus="BandQ(this.value)"></select>
            区:<select id="q"></select>
        </td>
    </tr>
    <tr>
        <td>地址:</td>
        <td><input id="Dzhi" type="text" name="name" value="" /></td>
    </tr>
    <tr>
        <td>手机:</td>
        <td><input id="hanSet" type="text" name="name" value="" /></td>
    </tr>
    <tr>
        <td colspan="2"><input  type="button" onclick="Tj()" name="name" value="添加到地址" /></td>
    </tr>
</table>
<script>
    //文档就绪函数
    $(function () {
        //绑定二级联动的函数
        BandSel();
    })
    //添加函数
    function Tj() {
        var obj = {};
        obj.AName = $("#aName").val();
        obj.Area = $("#Ss option:selected").text() + $("#q option:selected").text();
        obj.Dzhi = $("#Dzhi").val();
        obj.hanSet = $("#hanSet").val();
        $.ajax({
            url: "/Add/Add",
            data: { model:obj },
            dataType: "json",
            type: "post",
            success: function (d) {
                if (d > 0) {
                    alert("添加成功!");
                    location.href = '/Address/Index';
                }
                else {
                    alert("添加失败!");
                }
            }
        })
    }
    //绑定下拉 省市绑定
    function BandSel() {
        $.ajax({
            url: "/Add/GetSs",
            data: { qid:0},
            dataType: "json",
            type: "get",
            success: function (d) {
                $("#Ss").empty();
                $(d).each(function () {
                    var str = '<option value="' + this.Id + '">' + this.Name + '</option>';
                    $("#Ss").append(str);
                })
            }
        })
    }
    function BandQ() {
        $.ajax({
            url: "/Add/GetQx",
            data: { qid: $("#Ss").val() },
            dataType: "json",
            type: "get",
            success: function (d) {
                $("#q").empty();
                $(d).each(function () {
                    var str = '<option value="' + this.Id + '">' + this.Name + '</option>';
                    $("#q").append(str);
                })
            }
        })
    }
</script>
Add.cshtml

5.还望大佬们多多提一些修改意见,我会努力慢慢去改正的.

posted @ 2020-08-02 19:44  rookiexwang  阅读(500)  评论(1编辑  收藏  举报