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. php源码建博客4--实现MVC结构微型框架

    主要: 常量优化路径 自动加载类 优化入口文件 安全访问项目目录 --------------文件结构:-------------------------------------- blog├─App ...

  2. 大数据学习--day08(hnapp 后台系统开发、面向对象)

    hnapp 后台系统开发.面向对象 利用前面所学的知识,写一个控制台登陆注册后台界面 package sy180918.hnapp.array; import java.util.Arrays; im ...

  3. 用 wait-notify 解决生产者-消费者问题

    //生产者 package com.mzj.test; import java.util.Vector; import java.util.logging.Level; import java.uti ...

  4. Java核心技术36讲----------Exception和Error有什么区别

    1.异常知识点学习实例 代码如下: package fromnet; /** * 参考链接:https://blog.csdn.net/qq_18505715/article/details/7319 ...

  5. Python学习笔记八:文件操作(续),文件编码与解码,函数,递归,函数式编程介绍,高阶函数

    文件操作(续) 获得文件句柄位置,f.tell(),从0开始,按字符数计数 f.read(5),读取5个字符 返回文件句柄到某位置,f.seek(0) 文件在编辑过程中改变编码,f.detech() ...

  6. pyhton 下 使用getch(), 输入字符无需回车

    原代码来自 https://code.activestate.com/recipes/134892-getch-like-unbuffered-character-reading-from-stdin ...

  7. Linux C语言编程基本原理与实践

    Linux C语言编程基本原理与实践(2018-06-16 19:12:15) Linux C语言编程基本原理与实践 高效的学习带着目的性: 是什么 -> 干什么 -> 怎么用 重识C语言 ...

  8. axios请求封装和异常统一处理

    前端网络请求封装前端采用了axios来处理网络请求,为了避免在每次请求时都去判断各种各样的网络情况,比如连接超时.服务器内部错误.权限不足等等不一而足,我对axios进行了简单的封装,这里主要使用了a ...

  9. 北京Uber优步司机奖励政策(12月27日)

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

  10. ORB代码框架梳理

    这里从单目入手,画了一个框架图: