ASP.NET MVC 下拉框的传值的两种方式

以前使用WebForm变成时,下拉框传值只需直接在后台绑定代码就可以了。现在我们来看看在MVC中DropDownList是如果和接受从Controller传过来的值的。

第一种:使用DropDownList

控制器代码:

        public ActionResult Index()
        {

            //1.1查询YzSeriesEntity的数据
            List<Model.YzSeriesEntity> seriesList = seriesBLL.LoadEnities().ToList();
            //1.2将YzSeriesEntity的数据封装到 SelectList中,制定要生成下拉框选项的value和text属性
            SelectList selList1 = new SelectList(seriesList, "SerialName", "SerialName");

            //2.1查询YzDivisionEntity的数据
            List<Model.YzDivisionEntity> divisionList = divisionBLL.LoadEnities().ToList();
            //2.2讲YzDivisionEntity的数据封装到 SelectList中,制定要生成下拉框选项的value和text属性
            SelectList selList2 = new SelectList(divisionList, "DivisionName", "DivisionName");

            //3.调用Selectlist的As方法,自动生成SelectListItem集合,并存入ViewBag中
            ViewBag.selList1 = selList1.AsEnumerable();
            ViewBag.selList2 = selList2.AsEnumerable();

            return View();
        }

视图代码:

        <!-------------- 添加对话框-------------->
        <div id="addDiv">
            @using (Ajax.BeginForm("Add", new AjaxOptions() { OnSuccess = "afterAdd" }))
            {
                <table>
                    <tr>
                        <td>编号:</td>
                        <td>
                            @Html.TextBox("StaffID")
                        </td>
                    </tr>
                    <tr>
                        <td>姓名:</td>
                        <td>@Html.TextBox("StaffName")</td>
                    </tr>
                    <tr>
                        <td>性别:</td>
                        <td>
                            <input type="radio" id="GenderM" name="Sex" value="男" />男
                            <input type="radio" id="GenderF" name="Sex" value="女" checked />女
                        </td>
                    </tr>
                    <tr>
                        <td>所在系列:</td>
                        <td>
                            @Html.DropDownList("SerialName", ViewBag.selList1 as IEnumerable<SelectListItem>)
                        </td>
                    </tr>
                    <tr>
                        <td>科室或年级组:</td>
                        <td>
                            @Html.DropDownList("DivisionName", ViewBag.selList2 as IEnumerable<SelectListItem>)
                        </td>
                    </tr>
                    <tr>
                        <td>任课学科:</td>
                        <td>
                            @Html.TextBox("Subjects")
                        </td>
                    </tr>
                    <tr>
                        <td>聘任日期:</td>
                        <td>
                            @Html.TextBox("EngageDate")
                        </td>
                    </tr>
                    <tr>
                        <td>参加工作日期:</td>
                        <td>
                            @Html.TextBox("WorkDate")
                        </td>
                    </tr>
                    <tr>
                        <td>职称:</td>
                        <td>
                            @Html.TextBox("jobQualification")
                        </td>
                    </tr>
                    <tr>
                        <td>身份证号:</td>
                        <td>
                            @Html.TextBox("IdentityCard")
                        </td>
                    </tr>

                </table>
            }

        </div>

效果显示:

第二种:使用<select></select>

视图代码:

        <!--选择权重-->
        <div>
            <span>@Html.Label("请选择权重:")</span>
            <span>
                <select id="cc" class="easyui-combobox" name="dept"
                       data-options="valueField:'ID',textField:'Weight',url:'/SettingEvaluation/ListOption'" />
            </span>
        </div>

控制器代码:

        //下拉框对应的列表
        public ActionResult ListOption()
        {
            //2.1.查询出weight实体,并将其转成DTO类型
            List<Model.DTO.YzWeightEntityDTO> weightList =
                weightBLL.LoadEnities().ToList().Select(s => s.ToDto()).ToList();
            //2.2返回json
            return Json(weightList, JsonRequestBehavior.AllowGet);

        } 

效果显示:

总结:

两种传值方式的比较:

第一种是控制器通过ViewBag传值,前台通过@Html.DropDownList接收;第二种是通过Json传值,前台通过url绑定valueField和textField的值来获取数据。两者没有什么太大的不同,但是由于传值使用<select></select>接收的,使用的是HTML标签,所以还可以用来绑定其他的js事件,所以如果有功能需要的话,后者要比前者灵活些。

时间: 2024-10-10 13:47:07

ASP.NET MVC 下拉框的传值的两种方式的相关文章

MVC下拉框的传值的两种方式

http://www.cnsendblog.com/index.php/?p=137GPS平台.网站建设.软件开发.系统运维,找森大网络科技!http://cnsendnet.taobao.com 以前使用WebForm变成时,下拉框传值只需直接在后台绑定代码就可以了.现在我们来看看在MVC中DropDownList是如果和接受从Controller传过来的值的. 第一种:使用DropDownList 控制器代码: 1. public ActionResult Index() 2. { 3. 4

ASP.NET MVC 下拉框级联

这个是效果图 首先分析下,我们需要两个下拉框 首先要动态绑定班级的,这个很好实现,怎么让学生下拉框也出来,并显示请选择学生呢? public ActionResult Index() { ViewData["class"] = getByItem(); ViewData["stu"] = new List<SelectListItem>() { new SelectListItem {Text = "请选则学生", Value = &

ASP.NET MVC 下拉框传值方式

在MVC中使用DropDownList接受从Controller传过来的值的方式: 控制器代码:  public ActionResult Index()         {             dk.bll.edu.EduBll<dk.model.edu.SetupRecord> setUpBll = new dk.bll.edu.EduBll<dk.model.edu.SetupRecord>();             List<dk.model.edu.Setu

EF5(7) 后台使用SelectListItem传值给前台显示Select下拉框;mvc后台Action接收浏览器传值的4种方式; 后台Action向前台View视图传递数据的四种方式

一:后台使用SelectListItem 传值给前台显示Select下拉框 我们先来看数据库的订单表,里面有3条订单,他们的用户id对应了 UserInfo用户表的数据,现在我们要做的是添加一个Order控制器,显示订单列表,并且在修改订单的时候,把用户的id 用 select 下拉框显示出来,并且可以提交修改数据   1.1 我们通过比较原始的方法,来把数据 传递到前台后,前台使用  循环来显示 select 并且显示是哪个元素被选中 我们在前台的cshtml中,使用 @model 命令 指定

ASP.NET MVC之下拉框绑定四种方式(十)

前言 上两节我们讲了文件上传的问题,关于这个上传的问题还未结束,我也在花时间做做分割大文件处理以及显示进度的问题,到时完成的话再发表,为了不耽误学习MVC其他内容的计划,我们今天开始好好讲讲关于MVC中下拉框中绑定枚举的几种方式. 话题引入 一般在下拉框中绑定数据的话,分为几种情况. (1)下拉框中的数据是写死的,我们直接给出死代码即可. (2)下拉框中的数据从数据库中读取出来,从而进行显示. (3)下拉框中直接用枚举显示. (4)下拉框中一个选择的值改变另外一个下拉框中的值. 关于下拉框中绑定

mvc 下拉框赋值

以前使用WebForm变成时,下拉框传值只需直接在后台绑定代码就可以了.现在我们来看看在MVC中DropDownList是如果和接受从Controller传过来的值的. 第一种:使用DropDownList 控制器代码: public ActionResult Index() { //1.1查询YzSeriesEntity的数据 List<Model.YzSeriesEntity> seriesList = seriesBLL.LoadEnities().ToList(); //1.2将YzS

获取下拉框的值并通过拼接方式添加到td后面

html:<tr> <td class="Hint"><span class="color-red">*</span>选择分组:</td> <td width="40%"> <select id="groupId2" style="width: 80%;height: 30px"> <option th:if=&quo

ASP.NET Web API接受AngualrJS的QueryString的两种方式

ASP.NET Web API如何接受来自AngualrJS的QueryString呢?本篇体验两种方式. 第一种方式:http://localhost:49705/api/products?search=GDN 这种方式是QueryString原生的格式. 首先,把当前的域名和端口号放到一个自定义的module中去. 1 (function () { 2 "use strict"; 3 4 angular.module("custommodule", ["

菜鸟学习Spring——SpringMVC注解版前台向后台传值的两种方式

一.概述. 在很多企业的开法中常常用到SpringMVC+Spring+Hibernate(mybatis)这样的架构,SpringMVC相当于Struts是页面到Contorller直接的交互的框架也是界面把信息传输到Contorller层的一种架构,通过这个架构可以让我们把页面和Contorller层解耦,使得开发人员的分工更加明确. 二.代码演示. 1.首先配置SpringMVC环境. 1.1导入jar. 值得注意的是红色标记的commons-logging这个jar包一定得引入进去不然会