@Html.DropDownListFor获取用户选中的数据并传到后台

简介: 情况:一张Movie表,一张Level表当添加Movie信息的时候,属性Movie.level从Level表获取,并以DropDown的形式显示,用户填写好信息之后获取用户选中的值提交到后台,保存到数据库。

情况:

一张Movie表,一张Level表
当添加Movie信息的时候,属性Movie.level从Level表获取,并以DropDown的形式显示,用户填写好信息之后获取用户选中的值提交到后台,保存到数据库。

获取数据
** 后台MovieController **

public ActionResult Create()
        {
            MovieDBContext dbContext = new MovieDBContext();
            ViewBag.level = new SelectList(dbContext.Levels, "LevelName", "LevelName");
           //将数据库Level表的数据填充到SelectList并通过ViewBag传到前端
            return View();
        }

** 前端 展示数据**

<div class="form-group">
            <div class="control-label col-md-2">
                <b>电影等级</b>
            </div>
            <div class="col-md-10">
                @Html.DropDownListFor(Model => Model.level.LevelName,(IEnumerable<SelectListItem>)ViewBag.level)
              //因为Movie.level 保存的其实是一个Level类型的对象,但是Dropdown选中的值是一个string值,所以我们将选中的值赋给Movie.level.LevelName
            </div>
        </div>

** 后台处理数并添加到数据库 **

 [HttpPost]
        public ActionResult Create(Movie movie)
        {
            MovieDBContext dbContext = new MovieDBContext();
            Level l = dbContext.Levels.FirstOrDefault(u => u.LevelName == movie.level.LevelName);
            //通过在前端得到的LevelName属性反过来查到这个对象,并且赋给movie.level 
            movie.level = l;
            dbContext.Movies.Add(movie);
            dbContext.SaveChanges();
            return RedirectToAction("ListTemplete");
        }

** List展示数据的时候 **

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.Title)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.ReleaseTime)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Genre)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Price)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.level.LevelName) 
             //item.level.LevelName
        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new { id=item.ID }) |
            @Html.ActionLink("Details", "Details", new { id=item.ID }) |
            @Html.ActionLink("Delete", "Delete", new { id=item.ID })
        </td>
    </tr>
目录
相关文章
|
3月前
|
移动开发 前端开发 HTML5
Twaver-HTML5基础学习(20)数据容器(3)_数据的批量加载(节省性能方法)
本文介绍了Twaver HTML5中数据的批量加载方法,通过使用`box.startBatch()`可以在大量数据加载时提高性能。文章通过示例代码展示了如何在React组件中使用批量加载功能,以减少界面重绘次数并提升效率。
62 2
Twaver-HTML5基础学习(20)数据容器(3)_数据的批量加载(节省性能方法)
|
3月前
|
XML 存储 JSON
Twaver-HTML5基础学习(19)数据容器(2)_数据序列化_XML、Json
本文介绍了Twaver HTML5中的数据序列化,包括XML和JSON格式的序列化与反序列化方法。文章通过示例代码展示了如何将DataBox中的数据序列化为XML和JSON字符串,以及如何从这些字符串中反序列化数据,重建DataBox中的对象。此外,还提到了用户自定义属性的序列化注册方法。
51 1
|
7天前
|
数据采集 前端开发 数据挖掘
利用 html_table 函数轻松获取网页中的表格数据
本文介绍了如何使用 R 语言中的 `html_table` 函数结合代理 IP 技术,轻松提取网页表格数据并规避反爬机制。通过设置代理和请求头,示例代码展示了如何从 58 同城采集租房信息并保存为 CSV 文件。该方法适用于需要频繁采集数据的场景,确保数据采集的高效和稳定性。
利用 html_table 函数轻松获取网页中的表格数据
|
1月前
|
JavaScript API 开发工具
<大厂实战场景> ~ Flutter&鸿蒙next 解析后端返回的 HTML 数据详解
本文介绍了如何在 Flutter 中解析后端返回的 HTML 数据。首先解释了 HTML 解析的概念,然后详细介绍了使用 `http` 和 `html` 库的步骤,包括添加依赖、获取 HTML 数据、解析 HTML 内容和在 Flutter UI 中显示解析结果。通过具体的代码示例,展示了如何从 URL 获取 HTML 并提取特定信息,如链接列表。希望本文能帮助你在 Flutter 应用中更好地处理 HTML 数据。
121 1
|
3月前
|
XML 移动开发 JSON
Twaver-HTML5基础学习(18)数据容器(1)_增删查改、遍历数据容器、包含网元判断
本文介绍了Twaver HTML5中的数据容器(DataBox),包括如何进行增删查改操作、遍历数据容器以及判断网元是否存在于数据容器中。DataBox用于管理所有的网元对象,如ElementBox、LayerBox、AlarmBox等,并通过示例代码展示了其常用方法的使用。
50 1
Twaver-HTML5基础学习(18)数据容器(1)_增删查改、遍历数据容器、包含网元判断
|
3月前
|
移动开发 前端开发 HTML5
Twaver-HTML5基础学习(2)基本数据元素(Data)
本文介绍了Twaver HTML5中的基本数据元素,包括Data、Element、Alarm和Layer等,它们分别用来描述拓扑的网元、告警和图层。文章详细解释了Data类的基本属性和方法,并提供了如何在React组件中使用Twaver创建节点和连线的示例代码。
49 1
Twaver-HTML5基础学习(2)基本数据元素(Data)
|
3月前
|
数据采集 存储 JavaScript
如何使用Cheerio与jsdom解析复杂的HTML结构进行数据提取
在现代网页开发中,复杂的HTML结构给爬虫技术带来挑战。传统的解析库难以应对,而Cheerio和jsdom在Node.js环境下提供了强大工具。本文探讨如何在复杂HTML结构中精确提取数据,结合代理IP、cookie、user-agent设置及多线程技术,提升数据采集的效率和准确性。通过具体示例代码,展示如何使用Cheerio和jsdom解析HTML,并进行数据归类和统计。这种方法适用于处理大量分类数据的爬虫任务,帮助开发者轻松实现高效的数据提取。
如何使用Cheerio与jsdom解析复杂的HTML结构进行数据提取
|
3月前
|
移动开发 前端开发 JavaScript
Twaver-HTML5基础学习(3)基本数据元素(Data)其他功能函数以及组Group
本文介绍了Twaver HTML5中Data类的其他功能函数,如获取和操作子网元的方法,以及组(Group)的概念和使用。文章通过示例代码展示了如何在React组件中创建组、添加图元到组中,并通过toChildren函数获取满足特定条件的图元。
46 0
Twaver-HTML5基础学习(3)基本数据元素(Data)其他功能函数以及组Group
|
2月前
|
XML Web App开发 数据格式
HTML 页面显示 XML 数据
10月更文挑战第2天
|
2月前
|
机器学习/深度学习 JSON JavaScript
LangChain-21 Text Splitters 内容切分器 支持多种格式 HTML JSON md Code(JS/Py/TS/etc) 进行切分并输出 方便将数据进行结构化后检索
LangChain-21 Text Splitters 内容切分器 支持多种格式 HTML JSON md Code(JS/Py/TS/etc) 进行切分并输出 方便将数据进行结构化后检索
41 0