MVC和WebForm 中国省市区三级联动

MVC和WebForm是微软B/S端的两条腿,两种不同的设计理念,相对来说MVC更优于WebForm对于大数据的交互,因为WebForm是同一时间传输所有数据,而MVC它只是传输所用到的数据,更精确,传输量少等待数据传输的响应时间就短.但是WebForm也有他的优点,比如说设计起来更像Winform容易理解.

SQL表如下:MVC和WebForm 中国省市区三级联动

根据ParentAreaCode=0001可以查出省级地市,MVC和WebForm 中国省市区三级联动 对应的省级地市有AreaCode

根据不同的AreaCode输入在ParentAreaCode中可以查出省级地市中的市级地市MVC和WebForm 中国省市区三级联动ParentAreaCode=37

同理,对应的AreaCode输入在ParentAreaCode中可以查出市级地市的区县MVC和WebForm 中国省市区三级联动ParentAreaCode=370303

________________________________________________________我是华丽的分割线________________________________________________

MVC:

M:Models, 模型层:可以放方法,类等处理数据.

V:Views,视图层:HTML页面,把数据装饰然后显示到页面给用户.

C:Controller,控制层:负责动作交互,从视图层获取信息给模型层,Vice versa.

新建项目MVC和WebForm 中国省市区三级联动ASP.NET.MVC 4 Web 应用程序MVC和WebForm 中国省市区三级联动选择空窗体,一个空的MVC空网页就有了.MVC和WebForm 中国省市区三级联动

首先在Models里面添加LinQ to SQL类 添加模型,选好数据库来源MVC和WebForm 中国省市区三级联动,拖入表

MVC和WebForm 中国省市区三级联动然后在Models里面添加一个空的类用来写代码.

 public class ChinaBF
{
private ChinaStatesDataContext _context = new ChinaStatesDataContext(); //LinQ查询数据库
public List<ChinaStates> Select(string AreaCode) //省
{
var query = _context.ChinaStates.Where(P => P.ParentAreaCode == AreaCode);
return query.ToList();
}
}

Controller:

 public class HomeController : Controller
{ [HttpGet] //刚开始加载页面的时候
public ActionResult Index()
{
List<ChinaStates> listpro = new ChinaBF().Select(""); //0001查省份
ViewBag.databb = new SelectList(listpro, "AreaCode", "AreaName");
List<ChinaStates> list1 = new ChinaBF().Select(""); //市
ViewBag.datacc1 = new SelectList(list1, "AreaCode", "AreaName");
List<ChinaStates> list2 = new ChinaBF().Select("");//区
ViewBag.datacc= new SelectList(list2, "AreaCode", "AreaName");
return View();
}
[HttpPost] //当页面提交后
public ActionResult Index(string pro,string city,string sub)
{
List<ChinaStates> listpro = new ChinaBF().Select("");
ViewBag.databb = new SelectList(listpro, "AreaCode", "AreaName",pro);
List<ChinaStates> list1 = new ChinaBF().Select(pro);
ViewBag.datacc1 = new SelectList(list1, "AreaCode", "AreaName",city);
var b = list1.Exists(P => P.AreaCode == city) ? city : list1[].AreaCode;
List<ChinaStates> list2 = new ChinaBF().Select(b);
ViewBag.datacc= new SelectList(list2, "AreaCode", "AreaName");
return View();
} }

Views:

视图要在Controller里面代码快区域右键 添加视图 MVC和WebForm 中国省市区三级联动

用razor视图方法来写Views,@{} 里面写C#代码,他会自动判定HTML和C# 当遇到<>自动转译到Html.

@using China.Models;
@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
@{
SelectList bb = ViewBag.databb;
SelectList cc = ViewBag.datacc;
SelectList cc1 = ViewBag.datacc1;
}
@using (Html.BeginForm("Index", "Home", FormMethod.Post))
{
<div>
省份: @Html.DropDownList("pro",bb,new { onchange="document.forms[0].submit();"})
市辖:@Html.DropDownList("city",cc1,new { onchange="document.forms[0].submit();"})
市区:@Html.DropDownList("sub",cc)
</div>
}
</div>
</body>
</html>

________________________________________________________我是华丽的分割线________________________________________________

WebForm:

public class ChinaStatesDA
{
private ChinaThreeDataContext context;
public ChinaStatesDA()
{
context = new ChinaThreeDataContext();
}
public List<ChinaStates> Ch(string ParentAreaCode)
{
return context.ChinaStates.Where(p => p.ParentAreaCode == ParentAreaCode).ToList();
}
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls; public partial class Home : System.Web.UI.Page
{ protected void Page_Load(object sender, EventArgs e)
{
if(!IsPostBack) //因为每一次提交页面就会刷新, IsPostBack就判断是否重复刷新
{
bind();
}
} public void bind()
{
List<ChinaStates> list = new ChinaStatesDA().Ch("");
foreach (ChinaStates data in list)
{
ListItem li = new ListItem(data.AreaName,data.AreaCode);
DropDownList1.Items.Add(li);
}
}
public void bindDrop()
{
List<ChinaStates> list =new ChinaStatesDA().Ch("");
DropDownList1.DataSource = list;
DropDownList1.DataTextField = "AreaName";
DropDownList1.DataValueField = "AreaCode";
DropDownList1.DataBind();
}
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
ListItem li = new ListItem("请选择");
string a = DropDownList1.SelectedItem.Value;//DropDownList1.SelectedValue.ToString();
List<ChinaStates> list=new ChinaStatesDA().Ch(a);
DropDownList2.DataSource = list;
DropDownList2.DataTextField = "AreaName";
DropDownList2.DataValueField = "AreaCode";
DropDownList2.DataBind();
DropDownList3.DataTextField = li.Text;
}
protected void DropDownList2_SelectedIndexChanged(object sender, EventArgs e)
{
string a = DropDownList2.SelectedItem.Value;//DropDownList1.SelectedValue.ToString();
List<ChinaStates> list = new ChinaStatesDA().Ch(a);
DropDownList3.DataSource = list;
DropDownList3.DataTextField = "AreaName";
DropDownList3.DataValueField = "AreaCode";
DropDownList3.DataBind();
}
}

MVC和WebForm 中国省市区三级联动

DropDownList 要选 AutoPostBack=True;这样list里面更改数据后他会自动提交

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Home.aspx.cs" Inherits="Home" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div style="height: 218px"> <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
</asp:DropDownList>
省<asp:DropDownList ID="DropDownList2" runat="server" AutoPostBack="True" OnSelectedIndexChanged="DropDownList2_SelectedIndexChanged">
</asp:DropDownList>
市<asp:DropDownList ID="DropDownList3" runat="server" OnSelectedIndexChanged="DropDownList3_SelectedIndexChanged">
</asp:DropDownList>
区</div>
</form>
</body>
</html>

MVC和WebForm 中国省市区三级联动

上一篇:NOIp 2016 总结


下一篇:MVC与WebForm的简单的比较