省市区联动(MVC分布视图)
1、调用分布视图
//Html辅助方法 返回参数的值 存储在ProvinceId、CityId、DistrictId中
@{Html.RenderAction("GetProvince","Home",new{ProvinceId=Model.provinceid,CityId=Model.cityid,DistrictId=Model,districtid});}
2、实体类
//省份
public class Province
{
public int ProvinceId{get;set;}
public string ProvinceName{get;set;}
} //市
public class City
{
public int CityId{get;set;}
public string CityName{get;set;}
} //县区
public class District
{
public int DistrictId{get;set;}
public string DistrictName{get;set;}
}
3、控制器方法
//省
public PartialViewResult GetProvince(int ProvinceId=,int CityId=,int DistrictId=)
{
ViewData["provinceID"]=ProvinceId;
ViewData["cityId"]=CityId;
ViewData["districtId"]=DistrictId;
List<Province> listPro=获取到省份的方法;
Return PartialView(listPro);
} //市
public PartialViewResult GetCity(int ProvinceId=,int CityId=,int DistrictId=)
{
if(ProvinceId==)
{
ViewData["provinceID"]=;
ViewData["cityId"]=;
ViewData["districtId"]=;
Return PartialView();
}
else
{
ViewData["provinceID"]=ProvinceId;
ViewData["cityId"]=CityId;
ViewData["districtId"]=DistrictId;
List<City> listPro=获取到城市的方法(ProvinceId);
Return PartialView(listPro);
}
} //县区
public ActionResult GetDistrict(int CityId=,int DistrictId=)
{
if(CityId==)
{
ViewData["cityId"]=;
ViewData["districtId"]=;
Return PartialView();
}
else
{
ViewData["cityId"]=CityId;
ViewData["districtId"]=DistrictId;
List<District> listPro=获取到县区的方法(CityId);
Return PartialView(listPro);
}
} //省市联动(异步刷新)
///<summary>
///根据传值的省份Id加载出隶属的城市
///</summary>
[HttpPost]
public JsonResult AsynGetCity()
{
string dealType=Request["GetCity"];
string id=Request["ID"];
List<City> listC=得到城市的方法(id);
return Json(listC);
} //市县区联动(异步刷新)
///<summary>
///根据传值的城市id加载出隶属的县区
///</summary>
[HttpPost]
public JsonResult AsynGetDistrict()
{
string dealType=Request["GetDistrict"];
string id=Request["ID"];
List<District> listDis=获取到县区的方法(id);
return Json(listDis);
}
4、省份视图
@model List<Province>
<select id="ddlregions1" selectset="regions" name="ddlregions1" onchange="getValue(this[selectedIndex].value)">
<option value="">--请选择--</option>
@foreach(var item in Model)
{
if((int)ViewDate["provinceID"]==item.ProvinceId)
<option value="@ViewData["provinceID"]" selected="selected">@item.ProvinceName</option>
else
<option value="@item.ProvinceId">@item.ProvinceName</option>
}
</select>
<span>省</span>
<!--市分布视图-->
@{Html.RenderAction("GetCity","Home",new {ProvinceId=ViewData["provinceID"],City=ViewData["cityId"],DistrictId=ViewData["districtId"]});} <!--Js-->
<!--Jquery引用。。。。。。。-->
<script>
function BindData(id,controlld)
{
$("#"+controlld).empty();
$("#"+controlld).append("<option value='0'>--请选择--</option>");
$.ajax({
type:"post",
url:"AsynGetCity",
dataType:"json",
data:{"dealType":"GetCity","ID":id},
success:function(result)
{
$(result).each(function(){
$("#"+controlld).append("<option value='"+this.CityId+"'>"+this.CityName+"</option>");
})
}
})
}
$(function(){
$("#ddlRegions1").change(function(){
var id=$(this).val();
$("#ddlRegions3").empty();
$("#ddlRegions3").append("<option value='0'>--请选择--</option>");
BindData(id,"ddlRegions2");
})
})
</script>
5、城市视图
@model List<City>
<select id="ddlRegions2" onchange="getValue(this[selectedIndex].value)" selectset="regions">
@if((int)ViewData["ProvinceID"]==)
{
<option value=''>--请选择--</option>
}else
{
<option value=''>--请选择--</option>
foreach(var item in Model)
{
if((int)ViewData["cityId"]==item.CityId || (int)ViewData["cityId"]==)
<option value="@ViewData["cityId"]" selected="selected">@item.CityName</option>
else
<option value="@item.CityId">@item.CityName</option>
}
}
</select>
<span>市</span>
<!--县区-->
@{Html.RenderAction("GetDistrict","Home",new{CityId=ViewData["cityId"],DistrictId=ViewData["districtId"]});} <!--Js-->
<!--jQuery引用-->
<script>
function BindData(id,controlld)
{
$("#"+controlld).empty();
$("#"+controlld).append("<option value='0'>--请选择--</option>");
$.ajax({
type:"post",
url:"AsynGetDistrict",
dataType:"json",
data:{"dealType":"GetDistrict","ID":id}
success:function(result)
{
$(result).each(function(){
$("#"+controlld).append("<option value='"+this.DistrictId+"'>"+this.DistrictName+"</option>")
})
}
})
}
$(function(){
$("#ddlRegions2").change(function(){
var id=$(this).val();
BindData(id,"ddlRegions3");
})
})
</script>
6、县区视图
@model List<District>
<select id="ddlRegions3" name="ddlRegions3" onchange="getValue(this[selectedIndex].value)" selectset="regions">
@if((int)ViewData["cityId"]==)
<option value="">--请选择--</option>
else
<option value="">--请选择--</option>
@foreach(var item in Model)
{
if((int)ViewData["districtId"]==item.DistrictId)
<option value="@ViewData["districtId"]">@item.DistrictName</option>
else
<option value="@item.DistrictId">@item.DistrictName</option>
}
</select>
<span>县/区</span>
省市区联动(MVC分布视图)的更多相关文章
- js replace 全局替换 以表单的方式提交参数 判断是否为ie浏览器 将jquery.qqFace.js表情转换成微信的字符码 手机端省市区联动 新字体引用本地运行可以获得,放到服务器上报404 C#提取html中的汉字 MVC几种找不到资源的解决方式 使用Windows服务定时去执行一个方法的三种方式
js replace 全局替换 js 的replace 默认替换只替换第一个匹配的字符,如果字符串有超过两个以上的对应字符就无法进行替换,这时候就要进行一点操作,进行全部替换. <scrip ...
- MVC+EFCore 完整教程18 -- 升级分布视图至 View Component
之前我们详细介绍过分布视图(partial view),在有一些更加复杂的场景下,.net core为我们提供了更加强大的组件 view component, 可以认为view component是 ...
- 基于AngularJs + Bootstrap + AngularStrap 省市区联动实践
什么是 AngularJs?网上一大堆资料,没能真正说明白. AngularJs 就是一个函数库,算不上一个框架,源码2万2千多行,提供了前端MVC的开发方式, 有双向绑定,指令等特性,这是具有革命性 ...
- 【兼容写法】HttpServerUtility.Execute 在等待异步操作完成时被阻止。关键词:MVC,分部视图,异步
异常处理汇总-后端系列 http://www.cnblogs.com/dunitian/p/4523006.html MVC6之前的版本,对分部视图的异步支持不是很好 问题: 视图里面有分布视图:@{ ...
- ASP.NET MVC Razor视图(2)
昨天介绍了一些Razor的基本语法,几天接着向下说: 补成一个,上次介绍了怎么输出原样的文本,用<text></text>标签,下面再介绍一种语法: @{@:我爱北京} 这个 ...
- 使用asp.net mvc部分视图渲染html
为了提升用户体验,一般我们采用ajax加载数据然后根据数据渲染html,渲染html可以使用前端渲染和服务器端渲染. 前端渲染 使用前端模版引擎或MVC框架,例如underscore.js的templ ...
- MVC分部视图@Html.Partial
加载分布视图的方式: //1.以视图名使用当前文件夹下的视图(如果没有找到,则搜索 Shared 文件夹) @Html.Partial("_test") //加载对应文件 /Vie ...
- EF5+MVC4系列(11)在主视图中用Html.RenderPartial调用分部视图(ViewDate传值);在主视图中按钮用ajax调用子action并在子action中使用return PartialView返回分布视图(return view ,return PartialView区别)
一:主视图中使用Html.RenderPartial来调用子视图(注意,这里是直接调用子视图,而没有去调用子Action ) 在没有使用母版页的主视图中(也就是设置了layout为null的视图中), ...
- ASP.NET MVC——Razor视图引擎
Razor是MVC框架视图引擎,我们今天就来说一说Razor视图引擎. 首先还是来创建一个基础项目叫Razor来演示. 先来定义一个Model叫Product public class Product ...
随机推荐
- JqGrid TreeView使用
1.前端 <script src="@Url.Content("~/Scripts/jquery/jquery-1.9.0.min.js")" type= ...
- 解决python3 不能引入setuptools
1,原理分析: python中的setuptools因为其安全考虑需要ssl模块的支持.如果编译时没有通过ssl测试,就不能安装setuptools. 所以才会出现 Python3/dist-pack ...
- c#基础--常量(const),只读字段(readonly)
1.0:常量 常量被关键字const 所修饰 我们来看看常量的demo class Program { static void Main(string[] args) { const string n ...
- ArcGIS地图文档MXD效率慢的一点建议(二)
经常有用户询问,我的MXD图层比较多,而且配置好了相关的符号,但是我的服务器更换了一下,而且两个服务器的要素类名称都是一样的,我想配置一下新的数据源,而且我的这个MXD已经连接不到原来的数据源了,打开 ...
- wamp修改多站点配置
本文介绍如果在wamp中修改配置支持多站点. 第1步,修改httpd.conf,增加8080端口的监听 #Listen 12.34.56.78:80Listen 80Listen 8080 第2步,修 ...
- 【Shell脚本学习10】Shell运算符:Shell算数运算符、关系运算符、布尔运算符、字符串运算符等
Bash 支持很多运算符,包括算数运算符.关系运算符.布尔运算符.字符串运算符和文件测试运算符. 原生bash不支持简单的数学运算,但是可以通过其他命令来实现,例如 awk 和 expr,expr 最 ...
- mysql的 join联合查询的通俗解释
表a 1 2 3 4 aid adate 1 a1 2 a2 3 a3 表b 1 2 3 4 bid bdate 1 b1 2 b2 4 b4 两个表a.b相连接,要取出id相同的字段. 1 sele ...
- TaskUtil多线程与定时任务
package com.taoban.util; /** * 执行单次任务或定时任务工具类(用于减少new Thread()和new Timer()的使用) */ public class Tas ...
- Problem:Minesweeper Master
Google code jam Qualification Round 2014 题目链接:https://code.google.com/codejam/contest/dashboard?c=29 ...
- 使用ambari搭建Hadoop平台
1.操作系统 CentoOS Server with GUI(有GUI,有浏览器*ambari基于浏览器*推荐latest stable version)2.分区 默认 + /hadoop3.网络设置 ...