后台代码,获取数据如下:

/// <summary>
2 /// 获取省份
3 /// </summary>
4 public JsonResult GetProvincelist()
5 {
6 return Json(db.Province.ToList(),JsonRequestBehavior.AllowGet);
7 }
8 /// <summary>
9 /// 获取城市
10 /// </summary>
11 /// <param name="pid"></param>
12 /// <returns></returns>
13 public JsonResult GetCitylist(int pid)
14 {
15 List<CityModel> list=db.City.Where(c => c.Province.PID == pid).ToList();
16 List<SelectListItem> item = new List<SelectListItem>();
17 foreach (var City in list)
18 {
19 item.Add(new SelectListItem { Text = City.CityName, Value = City.CID.ToString() });
20 }
21 return Json(item, JsonRequestBehavior.AllowGet);
22 }

定义两个下拉框:

1 <span>省份:</span>
2 <select id="Province" >
3 <option>请选择</option>
4 </select>
5
6 <span>市:</span>
7 <select id="City">
8 <option>请选择</option>
9 </select>

使用jquery获取控制器里返回的值加载到下拉框中:

<script type="text/javascript">
2 $(function () {
3 GetProvince(); //加载省份
4 $("#Province").change(function () {
5 GetCity();
6 });
7 });
8 function GetProvince() {
9 // $("#Province").empty();
10 $.getJSON(
11 "/Home/GetProvincelist",
12 function (data) {
13 alert(data);
14 $.each(data, function (i, item) {
15 $("<option></option>").val(item["PID"]).text(item["ProvinceName"]).appendTo($("#Province"));
16 })
17 });
18 // GetCity();
19 }
20 function GetCity() {
21 $("#City").empty();
22 $.getJSON(
23 "/Home/GetCitylist",
24 { pid: $("#Province").val() },
25 function (data) {
26 $.each(data, function (i, item) {
27 $("<option></option>").val(item["Value"]).text(item["Text"]).appendTo($("#City"));
28
29 })
30 });
31 }
32 </script>

MVC 二级联动 可以试试的更多相关文章

  1. MVC二级联动使用$.ajax方法获取后端返回的字符串

    在"MVC二级联动使用$.getJSON方法"中使用$.getJSON()获取后端返回的JSon. 本篇使用jQuery的$.ajax()获取后端返回的字符串,实现二级联动.   ...

  2. MVC二级联动使用$.getJSON方法

    本篇使用jQuery的$.getJSON()实现二级联动.   □ View Models 1: namespace MvcApplication1.Models 2: { 3: public cla ...

  3. MVC 二级联动

    后台代码,获取数据如下: /// <summary> /// 获取省份 /// </summary> public JsonResult GetProvincelist() { ...

  4. asp.net mvc jQuery 城市二级联动

    页面效果图: 数据库表结构: 首先在数据库中创建省级.城市的表,我的表如下:我用了一张表放下了省级.城市的数据,用level划分省份和城市,parentId表示该城市所在省份的id 主要文件有:ind ...

  5. Spring MVC中Ajax实现二级联动

    今天写项目遇到了二级联动,期间遇到点问题,写个博客记录一下. 后台Controller: @RequestMapping("/faultType") @ResponseBody p ...

  6. C# MVC LayUI实现下拉框二级联动

    一.layui.use 1.LayUI的官方使用文档:https://www.layui.com/doc/ 2.layui的内置模块不是默认就加载好的,必须要执行启动模块的这种方法后模块才会加载: 3 ...

  7. Javascript中二级联动

    主要使用到到了地址JSON格式,来做,没有涉及数据库的读取. <!DOCTYPE html><html><head> <meta charset=" ...

  8. JavaScript日历控件开发 C# 读取 appconfig文件配置数据库连接字符串,和配置文件 List<T>.ForEach 调用异步方法的意外 ef 增加或者更新的习惯思维 asp.net core导入excel 一个二级联动

    JavaScript日历控件开发   概述 在开篇之前,先附上日历的代码地址和演示地址,代码是本文要分析的代码,演示效果是本文要实现的效果代码地址:https://github.com/aspwebc ...

  9. iOS开发之"省市"二级联动的数据组织(PHP版)以及PickerView的实现与封装

    之所以要发表这篇博客,还源于最近的开发工作所实现的一个小的Demo, 当然这个Demo不会涉及工作中App的一些内容,下方要实现的Demo是通用的.因为项目需求的迭代,要求在银行卡绑定中添加支行所在的 ...

随机推荐

  1. 利用python生成图形验证码

    validCode.py import random from io import BytesIO from PIL import Image, ImageDraw, ImageFont def ge ...

  2. 虚拟机中配置SQL SERVER2008R2远程访问

    VM虚拟机中配置数据库访问 选择虚拟机设置--硬件--网络适配器,选择桥接模式:直接连接物理网络 不可选用主机模式(与主机共享专用网络) 数据库远程配置,转自:http://jingyan.baidu ...

  3. Bubblesort冒泡算法

    最简单的算法,大家都知道两层for循环,中间加一个过渡用来交换数据 小例子: package com.neuedu.algorithm;//算法 public class Bubblesort { / ...

  4. String使用方法详解

    标准c++中string类函数介绍 注意不是CString 之所以抛弃char*的字符串而选用C++标准程序库中的string类,是因为他和前者比较起来,不必 担心内存是否足够.字符串长度等等,而且作 ...

  5. 6、python中的元组

    元组(tuple)是python中有序.不可变的数据结构.元组还是python四种数据结构中唯一一种不可变的数据结构. 一.前言 元组在很多方面都变现得跟列表一样,除了列表储存得对象是可变得,而元组储 ...

  6. 安装 Windows Server 2012 Active Directory 只读域控制器 (RODC)(级别 200)

    安装 Windows Server 2012 Active Directory 只读域控制器 (RODC)(级别 200) 适用对象:Windows Server 2012 本主题介绍如何创建分步的 ...

  7. Asp.net自定义控件开发任我行(4)-ViewState保存控件状态

    摘要 上一篇我们实现了下拉框的效果,此章的目的主要是保存控件属性状态 内容 我们先来看一个例子,后台代码不变,我们只改UI页面的代码,先在页面上拖放两个控件,一个是我们现在要开发的这个控件,另一个是按 ...

  8. Memcached相关内容总结

    1.Memcached常用命令总结 Memcached命令格式一般为: command 其中描述如下: 参数 描述 command 操作命令,一般为set/add/replace/get/delete ...

  9. DNS(转载)

    最近帮朋友注册域名配置主机,碰到一些DNS上的一些概念,惭愧于有一些东西已经忘记是啥意思,于是决定重新学习一下DNS方面的基本概念. 常用概念: TTL: TTL为Time to live的缩写,网络 ...

  10. jquery对象与js对象

    对于已经是一个 DOM 对象,只需要用 $() 把DOM对象包装起来,就可以获得一个 jQuery 对象了,使用[index]和.get(index)可以转为DOM对象 jQuery 对象是通过 jQ ...