MVC5中后台提供Json,前台处理Json,绑定给Dropdownlist的例子:

前端:

我们以前在前端定义了两个控件:

<div class="row">
<div class="col-md-1">国家</div>
<div class="col-md-11">
@Html.DropDownListFor(model => model.Director.HometownID, MvcEntitiyFrameWork.ViewModels.HometownViewModel.GetHometownSelectList(), htmlAttributes: new { @class = "form-control", @style = "width:120px;" }) </div>
</div> <div class="row" style="margin-bottom:2px">
<div class="col-md-1">导演</div>
<div class="col-md-11">
@Html.DropDownListFor(model => model.DirectorID, MvcEntitiyFrameWork.ViewModels.DirectorViewModel.GetDirectorSelectList(Model.Director.HometownID.ToString()), htmlAttributes: new { @class = "form-control", @style = "width:120px;" })
@Html.ValidationMessageFor(model => model.DirectorID, "", new { @class = "text-danger" })
</div>
</div>

然后我们在脚本中执行如下代码:

特别的一点,我们在上面代码中貌似没指定控件的ID,但是运行以后在页面是可以看到控件的ID的,从而,我从运行后的界面得到ID来使用。

<script type="text/javascript">
$("#Director_HometownID").change(
function ()
{
GetDirector($(this).val());
}
);
function GetDirector(message) {
var option = {
url: '/Movies/GetDirectorList',
type: 'get',
chche: false,
dataType: 'json',
data: { _htid: message }, //发送服务器数据
success: function (data) { //成功事件
$("#DirectorID").empty(); $.each(data, function (i, item) {
$("<option></option>").val(data[i].Value).text(data[i].Text).appendTo($("#DirectorID")); });
},
error: function (XMLHttpRequest, textStatus, errorThrown) { //发送失败事件
alert(textStatus );
}
};
//进行异步传输
$.ajax(option);
} </script>

我们的后台,controller中定义如下,返回ActionResult

 public ActionResult GetDirectorList(string _htid)
{
try
{
//方法一 Ok
//var selectList = db.Directors.Where(a => a.HometownID.ToString() == _htid).Select(a => new SelectListItem
//{ // Text = a.DirectorName, // Value = a.DirectorID.ToString() //}); //return Json(selectList, JsonRequestBehavior.AllowGet);
//方法二 也Ok
List<Director> list = db.Database.SqlQuery<Director>("select DirectorID,DirectorName,HometownID from Directors where HometownID='" + _htid + "'").ToList(); SelectList pList = new SelectList(list, "DirectorID", "DirectorName"); return Json(pList, JsonRequestBehavior.AllowGet);
}
catch (Exception ex)
{
return null;
} }

前端就可以得到返回值,对dropdownlistbox数据进行绑定了(这里是dropdownlistbox级联筛选数据的应用)

MVC5中后台提供Json,前台处理Json,绑定给Dropdownlist的例子的更多相关文章

  1. 值提供器 AND 模型绑定器

    本章介绍了值提供器的作用,ASP MVC自带的5中值提供器.以及模型绑定器的作用,自定义模型绑定器并使用自定义的模型绑定器(类型上加上[ModelBinder(typeof(xx))]或者在全局模型绑 ...

  2. struts2:JSON在struts中的应用(JSP页面中将对象转换为JSON字符串提交、JSP页面中获取后台Response返回的JSON对象)

    JSON主要创建如下两种数据对象: 由JSON格式字符串创建,转换成JavaScript的Object对象: 由JSON格式字符串创建,转换成JavaScript的List或数组链表对象. 更多关于J ...

  3. EF+LINQ事物处理 C# 使用NLog记录日志入门操作 ASP.NET MVC多语言 仿微软网站效果(转) 详解C#特性和反射(一) c# API接受图片文件以Base64格式上传图片 .NET读取json数据并绑定到对象

    EF+LINQ事物处理   在使用EF的情况下,怎么进行事务的处理,来减少数据操作时的失误,比如重复插入数据等等这些问题,这都是经常会遇到的一些问题 但是如果是我有多个站点,然后存在同类型的角色去操作 ...

  4. 2.Rest Server提供数据库的Json字符串

    Delphi最大的特点是数据库操作便捷.为了能够给App提供数据,这里采用Rest Server后台,然后在用Json文件发送到APP前台. 1.后台的dataset转换为json. 这里百度后就可以 ...

  5. @requestbody---接受前端传json对象并绑定javabean

    @requestbody---接受前端传json对象并绑定javabean----https://blog.csdn.net/ljxbbss/article/details/74452326 最近代码 ...

  6. ajax提交数据到java后台,并且返回json格式数据前台接收处理值

    1.前台html页面.有一段代码如下: 账  户:  <input type="text" name="userName" id="userN& ...

  7. 前台处理json字符串的几种方法(转)

    原文地址http://www.css88.com/archives/3919 比如我有两个变量,我要将a转换成字符串,将b转换成JSON对象: var a={"name":&quo ...

  8. 一个可以将 json 字符串 直接绑定到 view 上的Android库

    android-data-binding 这是一个可以将 json 字符串 直接绑定到 view 上的库, 不用先将 json 转换为 model 类. 传送门(https://github.com/ ...

  9. DotNetCore学习-1.读取Json配置并绑定到配置类实例

    DotNetCore的程序的配置不再完全局限于XML文件,增加更加通用的Json配置. 读取Json配置文件的类主要在Microsoft.Extensions.Configuration命名空间下,创 ...

随机推荐

  1. 【转】我的技术学习方法 — Anytao

    原文作者:anytao—王涛 他的著作:<你必须知道的.Net> 关于这个问题,也有不少刚刚入行的朋友向我问起.我想可能一千个人就有一千个答案,我不能保证自己的想法适合于所有的人,但是这确 ...

  2. ASP.NET MVC 过滤器(一)

    ASP.NET MVC 过滤器(一) 前言 前面的篇幅中,了解到了控制器的生成的过程以及在生成的过程中的各种注入点,按照常理来说篇幅应该到了讲解控制器内部的执行过程以及模型绑定.验证这些知识了.但是呢 ...

  3. 使用ViewPager+Fragment实现选项卡切换效果

    实现效果 本实例主要实现用ViewPage和Fragment实现选项卡切换效果,选项卡个数为3个,点击选项卡或滑动屏幕会切换Fragment并实现选项卡下方下边框条跟随移动效果. 本程序用androi ...

  4. python数据类型详解

    目录1.字符串2.布尔类型3.整数4.浮点数5.数字6.列表7.元组8.字典9.日期 1.字符串1.1.如何在Python中使用字符串a.使用单引号(')用单引号括起来表示字符串,例如:str='th ...

  5. Security3: Schema 和 Permission

    Schema是Object的容器,授予对Schema访问的权限,就是授予对Schema下所有object的访问权限. 一,Schema 是object的container The new schema ...

  6. vue中v-bind:class动态添加class

    1.html代码 <template v-for='item in names'> <div id="app" class="selectItem&qu ...

  7. 用bootstrap实现多张图片手动轮回

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAABBoAAAJoCAIAAABHhBX4AAAgAElEQVR4nOzdZXdcV7rg8fmIM2vm3r

  8. windows下实现Git在局域网使用

    1.首先在主机A上创建一个文件夹用于存放你要公开的版本库.然后进入这个文件夹,右键->Git create repository here,弹出的窗口中勾选Make it Bare!之后将这个文 ...

  9. IOS各种集合遍历效率对比

    前言: 对于ios项目开发中总会遇见各种集合遍历,出于对各种遍历效率的好奇心,所以准备写个测试程序测试一下 首先:先声明一个NSMutableArray,测试数据量分别是1000条,10000条,10 ...

  10. Cinder 组件详解 - 每天5分钟玩转 OpenStack(47)

    本节我们将详细讲解 Cinder 的各个子服务. cinder-api cinder-api 是整个 Cinder 组件的门户,所有 cinder 的请求都首先由 nova-api 处理.cinder ...