1、添加省份和城市类

//省份
public class Province
{
public int Id { get; set; } public string Name { get; set; }
} //城市
public class City
{
public int Id { get; set; } public string Name { get;set;} public int ProvinceId { get; set; }
}

2、添加控制器

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using SupermarketManagement.Models; namespace SupermarketManagement.Controllers
{
public class LinkageController : Controller
{ List<Province> provinceList = new List<Province>();
List<City> cityList = new List<City>(); //初始化城市数据
private void InitProvince()
{
provinceList.Add(new Province { Id = , Name = "河北省" });
provinceList.Add(new Province { Id = , Name = "河南省" });
provinceList.Add(new Province { Id = , Name = "广东省" }); cityList.Add(new City { Id = , Name = "石家庄", ProvinceId = });
cityList.Add(new City { Id = , Name = "邢台", ProvinceId = });
cityList.Add(new City { Id = , Name = "保定", ProvinceId = }); cityList.Add(new City { Id = , Name = "郑州", ProvinceId = });
cityList.Add(new City { Id = , Name = "安阳", ProvinceId = });
cityList.Add(new City { Id = , Name = "洛阳", ProvinceId = }); cityList.Add(new City { Id = , Name = "广州", ProvinceId = });
cityList.Add(new City { Id = , Name = "中山", ProvinceId = });
cityList.Add(new City { Id = , Name = "佛山", ProvinceId = });
} //绑定省份
public ActionResult Index()
{
InitProvince();
var pEnumrable = provinceList.Select(p => new SelectListItem { Value = p.Id.ToString(), Text = p.Name });
ViewBag.Province = pEnumrable;
return View();
} //获取城市
public ActionResult ShowCity(int provinceId)
{
InitProvince();
List<City> cList = new List<City>();
cList = cityList.Where(c => c.ProvinceId == provinceId).ToList(); return Json(cList, JsonRequestBehavior.AllowGet);
}
} }

3、添加HTML

<!DOCTYPE html>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/Content/jquery-1.8.3.min.js"></script>
<script>
$(function () {
$("#Province").bind("change", function () {
var selectProvince = $(this).val(); //除了第一个都删除
$("#City option:not(:first)").remove();
$.getJSON("@Url.Action("ShowCity","Linkage")", { provinceId: selectProvince }, function (data) { $.each(data, function (i, item) {
$("#City").append("<option value='"+item.Id+"'>"+item.Name+"</option>");
});
});
});
});
</script>
</head>
<body> 省份:@Html.DropDownList("Province", "请选择省份")<br />
城市:<select id="City">
<option value="">请选择城市</option>
</select><br />
</body>
</html>

MVC4 DropDownList (二) — 省市联动的更多相关文章

  1. Django(二十)下拉列表-省市联动实例:jquery的ajax处理前端

    一.知识点 1.jquery的ajax请求写法 <script src="/static/js/jquery-1.12.4.min.js"></script> ...

  2. select省市联动选择城市 asp.net mvc4

    本文在 http://www.cnblogs.com/darrenji/p/3606703.html(感谢博主的分享)基础上加入全国各省市,从文件中读取全国省市县,组成省市联动的选择标签 在Model ...

  3. Json 基于jQuery+JSON的省市联动效果

    helloweba.com 作者:月光光 时间:2012-09-12 21:57 标签: jQuery  JSON  Ajax  省市联动     省市区联动下拉效果在WEB中应用非常广泛,尤其在一些 ...

  4. Dynamic CRM 2013学习笔记(八)过滤查找控件 (类似省市联动)

    我们经常要实现类似省市联动一样的功能,常见的就是二个查找控件,一个选择了省后,另一个市的查找控件就自动过滤了,只显示当前省下的市,而不是所有的市.当然这是最简单的,实际工作中还有更复杂的功能要通过过滤 ...

  5. 省市联动 js

    工作中见到这个省市联动代码,虽然很简单也能写出来,还是随便把它记录下来. //省市联动 function area(obj_id, area_pId, data_call_back) { ) retu ...

  6. html css javascript 知识点总结 bom js 操作标签 文本 节点 表格各行变色 悬停变色 省市联动 正则

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  7. JavaScript基础4——省市联动

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. jquery省市联动,根据公司需求而写

    //author:guan //2015-05-25 //省市联动 //实用说明,页面引用如下js //<script src="../js/jquery-1.6.3.min.js&q ...

  9. 无废话ExtJs 入门教程十二[下拉列表联动:Combobox_Two]

    无废话ExtJs 入门教程十二[下拉列表联动:Combobox_Two] extjs技术交流,欢迎加群(201926085) 不管是几级下拉列表的联动实现本质上都是根据某个下拉列表的变化,去动态加载其 ...

随机推荐

  1. hadoop生态搭建(3节点)-09.flume配置

    # http://archive.apache.org/dist/flume/1.8.0/# ===================================================== ...

  2. 浅显易懂的Sysnchronizd用法

    <编程思想之多线程与多进程(1)——以操作系统的角度述说线程与进程>一文详细讲述了线程.进程的关系及在操作系统中的表现,这是多线程学习必须了解的基础.本文将接着讲一下Java线程同步中的一 ...

  3. Java基础—ArrayList源码浅析

    注:以下源码均为JDK8的源码 一. 核心属性 基本属性如下: 核心的属性其实是红框中的两个: //从注释也容易看出,一个是集合元素,一个是集合长度(注意是逻辑长度,即元素的个数,而非数组长度) 其中 ...

  4. 北京Uber优步司机奖励政策(11月23日~11月29日)

    用户组:人民优步"关羽组"(适用于11月23日-11月29日)奖励政策: 滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最 ...

  5. 北京Uber优步司机奖励政策(9月14日~9月20日)

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  6. 成都Uber优步司机奖励政策(3月21日)

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  7. 新版本Eclipse安装后插件都在哪里?

    201903版本的Eclipse,选择win安装,下载后的安装包大小只有48.7Mb, 双击安装会会弹出类似eclipse网页,选择需要安装的类型,一般选择Java EE版本 选择好版本后,选择安装目 ...

  8. hdu1517A Multiplication Game(巴什博弈变形)

    A Multiplication Game Time Limit: 5000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Ot ...

  9. Selenium(Python)驱动Chrome浏览器

    Chrome浏览器与chromedriver.exe驱动可以是官网上最新的, 随意! Chrome.py: from selenium import webdriverfrom selenium.we ...

  10. Swift使用AVAudioPlayer来调节游戏的背景音乐大小

    音乐文件的声音大小有时在做为游戏背景音乐时会过大,而如果我们只是简单应用SKAudioNode来加载音乐的话,是无法进行声音大小的调节的,因此我们必须使用更强大的AVAudioPlayer来进行声音大 ...