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

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级联筛选数据的应用)

时间: 2024-10-31 20:11:48

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

后台查到了json数据,前台ext的grid中显示不出来

前台页面 <script type="text/javascript"> Ext.onReady(function(){ Ext.QuickTips.init(); //定义列 var cm=new Ext.grid.ColumnModel([ {header:'客户编号',dataIndex:'id'}, {header:'客户姓名',dataIndex:'name'}, {header:'联系电话',dataIndex:'phone'}, {header:'房屋种类',

JSON字符串-赋张最初接触后台从map转json的方法

**************************************** json数组: ****************************************************** 后台传回前台 和 前台传回后台的都是json字符串 ****************************************************** 将java中的map,list等转成json格式 (map转成JSONObject   list转成JSONArray) 前者的类

javascript中字符串格式转化成json对象记录

什么是JSON JSON(JavaScript Object Notation)是一种优美的JavaScript对象创建方法.JSON也是一种轻量级数据交换格式.JSON非常易于人阅读与编写,同时利于机器解析与生成.JSON是在AJAX中代替XML交换数据的更佳方案. JSON格式与语法 var jsonobject= {         //对象内的属性语法(属性名与属性值是成对出现的)         propertyname:value, //对象内的函数语法(函数名与函数内容是成对出现的

当向后台插入或读取JSON数据遇见回车时

今天在项目中发现,当插入或读取JSON数据时遇见回车符,返回JSON数据格式时会报错(firebug里体现为乱码),百度了一下发现JSON不支持字符串里存在回车! 解决办法: 在向接口插入带json格式的数据之前,将回车等特殊符合替换成json接受的符号: 在向接口请求读取json格式的数据时,将回车等特殊符合替换成json接受的符号: 发送到后台 myPostStr.replace(/[\r\n]/g,"|"); //将myStr字符串里的回车和换行符替换成"|"

怎么去掉对象中的function类型元素--JSON对象学习

[问题]当一个对象中含有function,而想把它去掉的时候,怎么做简单呢? [举例] 举个例子,当有一个对象为: var o = { a: 1, b: 'xx', c: function(){}, d: true } 我想把类型为o.c的对象去掉,应该怎么做呢~~ [解决方案] 一般的想法使用for-in循环,去掉type为function来做.其实有更简单的方法,那就是使用JSON.stringify(o),这样可以直接去掉function,再使用JSON.parse()将对象转换回来就好了

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

DotNetCore的程序的配置不再完全局限于XML文件,增加更加通用的Json配置. 读取Json配置文件的类主要在Microsoft.Extensions.Configuration命名空间下,创建完对应的程序后,需要时NuGet引入该DLL文件. 1. 创建ConsoleApp程序 Vs2017中直接使用新建项中选择创建控制台应用(.NET Core). 2. 使用NuGet添加程序记引用 依赖项节点上右击,选择"管理NuGet程序包",搜索Microsoft.Extension

ajax使用json数组------前端往后台发送json数组及后台往前端发送json数组

1.引子 Json是跨语言数据交流的中间语言,它以键/值对的方式表示数据,这种简单明了的数据类型能被大部分编程语言理解.它也因此是前后端数据交流的主要方式和基础. 2.前端往后台传输json数据 第一步,先应该定义一个JSON对象或JSON数组.json对象是“var jsonObj={“name1”:“value1” , “name2”:“value2” , “name3”:“value3”,…};”的格式定义,而json数组则是以中括号"[ ]"包裹多个json对象的格式定义,如

C# 开发,将List&amp;amp;lt;Object&amp;amp;gt; 中的数组序列化转换为JSON,以便保存或传送。

一般我们在开发C#应用程序的时候时常会使用自定义的List 数组来放置我们的数据,或许有时我们会想要将List内的对象存起来以供下次程序开启时使用,但是在Win store app 或Windows Phone app 开发时提供的Local Folder 和 Roaming Folder存放数据时并不能放入List的数组只能放入简单的String int double bool 之类的变量,所以我们可以尝试将List转换为JSON的文字,以便存放在这些空间里或是传送到其他地方. 本篇文章将引导

用ajax获取后台数据,返回json数据,怎么在前台使用?

用ajax获取后台数据,返回json数据,怎么在前台使用呢? 后台 C# code ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 if (dataType == "SearchCustomer")                 {                     int ID;                     if (Int32.TryParse(CustomerID, out ID))                     {