MVC编辑和发送带有部分视图的模型视图

达拉玛

我正在使用带有复杂模型的View的项目(为简单起见,我给出此示例):

public class Person
{
    public string Name { get; set; }
    public string LastName { get; set; }
    public string Data3 { get; set; }
    public string Data4 { get; set; }
    public List<Movie> Movies { get; set; }
}

public class Movie
{
    public string Name { get; set; }
    public double Cost { get; set; }
    public double Quantity { get; set; }
}

我有一个具有两个局部视图“ _Movies”和“ _Books”的主视图人,

@Html.Partial("_Movies", Model.Movies)

@Html.Partial("_Books", Model.Books)

这些部分视图中的每个视图都有一个“添加按钮”,其中会打开一个弹出窗口,该弹出窗口会请求以下数据:

  • 电影名称
  • 成本
  • 数量

想法是,当我插入此数据时,它将显示一个网格,其中包含电影列表和输入的数据。能够编辑或删除此数据。

然后,当我按下底部的“全部保存”按钮时,它将所有模型数据发布到控制器。

但是我不知道如何处理模型数据以将其一起发送。生无可恋。

如何编辑和刷新局部视图的数据并获取其数据以将完整模型发送到控制器?

在此处输入图片说明

还有我的代码

主控制器:

public class PersonController : Controller
{
    // GET: Person
    public ActionResult Index()
    {
        return View();
    }

    public ActionResult Create()
    {
        ViewBag.Movies = new SelectList(new List<SelectListItem> {
            new SelectListItem { Text = "Lord of the rings", Value = "Lord of the rings"},
            new SelectListItem { Text = "Inception", Value = "Inception"}
        }, "Value", "Text");

        return View(new Person());
    }

    [HttpPost]
    public ActionResult Create(Person person)
    {
        try
        {
            // TODO: Add insert logic here

            return RedirectToAction("Index");
        }
        catch
        {
            return View();
        }
    }

    [ChildActionOnly]
    public ActionResult RefreshMovies(List<Movie> movies)
    {
        ViewBag.Movies = new SelectList(new List<SelectListItem> {
            new SelectListItem { Text = "Lord of the rings", Value = "Lord of the rings"},
            new SelectListItem { Text = "Inception", Value = "Inception"}
        }, "Value", "Text");

        return PartialView("~/Views/Person/_Movies.cshtml", movies ?? new List<Movie>());
    }
}

主视图:

@model MisPruebasMVC.Models.Person

@{
    ViewBag.Title = "Create";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>General Data</h2>

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            <div class="col-md-4">
                @Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label" })
                @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
            </div>

            <div class="col-md-4">
                @Html.LabelFor(model => model.LastName, htmlAttributes: new { @class = "control-label" })
                @Html.EditorFor(model => model.LastName, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.LastName, "", new { @class = "text-danger" })
            </div>
        </div>


        <div class="form-group">
            <div class="col-md-4">
                @Html.LabelFor(model => model.Data3, htmlAttributes: new { @class = "control-label" })
                @Html.EditorFor(model => model.Data3, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Data3, "", new { @class = "text-danger" })
            </div>

            <div class="col-md-4">
                @Html.LabelFor(model => model.Data4, htmlAttributes: new { @class = "control-label" })
                @Html.EditorFor(model => model.Data4, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Data4, "", new { @class = "text-danger" })
            </div>
        </div>


        @Html.Partial("_Movies", Model.Movies ?? new List<MisPruebasMVC.Models.Movie>())

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>
    </div>
}

局部视图_Movies.cshtml:

@model IEnumerable<MisPruebasMVC.Models.Movie>


<h2>Movies</h2>

<div class="form-group">
    <button id="addISPCost" type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">
        Add movie
    </button>
</div>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h3 class="modal-title" id="exampleModalLabel">New Movie</h3>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                </button>
            </div>

            <div class="modal-body">
                @{
                    var newMovie = new MisPruebasMVC.Models.Movie();
                }

                <div class="form-group">
                    @Html.LabelFor(m => newMovie.Name, "ISP *:", htmlAttributes: new { @class = "control-label col-md-3" })
                    <div class="col-md-9">
                        @Html.DropDownList("Id_ISP", new SelectList(ViewBag.Movies, "Value", "Text"), "Select a movie", new { @class = "form-control", @id = "IdISP" })
                        @Html.ValidationMessageFor(m => newMovie.Name, "", new { @class = "text-danger" })
                    </div>
                </div>

                <div class="form-group">
                    @Html.LabelFor(m => newMovie.Cost, "Cost:", htmlAttributes: new { @class = "control-label col-md-3" })
                    <div class="col-md-9">
                        @Html.EditorFor(m => newMovie.Cost, new { htmlAttributes = new { @class = "form-control", @id = "Cost" } })
                        @Html.ValidationMessageFor(m => newMovie.Cost, "", new { @class = "text-danger" })
                    </div>
                </div>

                <div class="form-group">
                    @Html.LabelFor(m => newMovie.Quantity, "Quantity:", htmlAttributes: new { @class = "control-label col-md-3" })
                    <div class="col-md-9">
                        @Html.EditorFor(m => newMovie.Quantity, new { htmlAttributes = new { @class = "form-control", @id = "MaximoDiario" } })
                        @Html.ValidationMessageFor(m => newMovie.Quantity, "", new { @class = "text-danger" })
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
                <button type="button" class="btn btn-primary" id="saveConfiguracionISP">Aceptar</button>
            </div>
        </div>
    </div>
</div>

<table class="table">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.Name)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Cost)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Quantity)
        </th>
        <th></th>
    </tr>

    @foreach (var item in Model)
    {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.Name)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Cost)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Quantity)
            </td>
        </tr>
    }

</table>

_Books局部视图与_Movies局部视图相同。

我试图将部分文件与主要文件放在同一目录中,并通过以下方式调用它们

@Html.Partial("_Movies", Model.Movies ?? new List<MisPruebasMVC.Models.Movie>())

我也尝试过

@Html.Action("RefreshMovies", Model.Movies)

调用此动作

[ChildActionOnly]
public ActionResult RefreshMovies(List<Movie> movies)
{
    ViewBag.Movies = new SelectList(new List<SelectListItem> {
        new SelectListItem { Text = "Lord of the rings", Value = "Lord of the rings"},
        new SelectListItem { Text = "Inception", Value = "Inception"}
    }, "Value", "Text");

    return PartialView("~/Views/Person/_Movies.cshtml", movies ?? new List<Movie>());
}

甚至我尝试将它们移动到EditorTemplates共享文件夹内的文件夹,并通过以下方式调用它们:

@ Html.EditorFor(m => m.Movies,“ _ Movies”)@ Html.EditorFor(m => m.Books,“ _ Books”)

但是我不知道如何将部分视图中的电影和书籍列表添加到父视图模型中,以通过BeginForm中的提交将它们发送到控制器。

任何想法?

达拉玛

我已经实现了将MoviesBooks属性中部分视图的数据发送到控制器

对于我所看到的,仅当视图从控制器接收数据时才获取模型,然后将其解释为HTML,并且仅将表单数据发送至控制器,我已如下解决:

Person实体添加了属性MoviesRequestBooksRequest类型为string实体在这里,我将收到两个JSON格式的数组,分别解析为MoviesBooks属性,使Person类保持如下:

public class Person
{
    public string Name { get; set; }
    public string LastName { get; set; }
    public string Data3 { get; set; }
    public string Data4 { get; set; }
    public List<Movie> Movies { get; set; }
    public List<Book> Books { get; set; }
    public string MoviesRequest { get; set; }
    public string BooksRequest { get; set; }
}

另一方面,在父视图中,我添加了两个隐藏字段,它们引用了这两个新属性:

@Html.HiddenFor(m=> m.MoviesRequest, new { id = "hiddenMovies" })
@Html.HiddenFor(m=> m.BooksRequest, new { id = "hiddenBooks" })

在局部视图中,_Books我在javascript中有一个全局变量books,它在document.ready中的设置如下:

books = @Html.Raw(Json.Encode(Model));

每次修改books数组时,都会更新隐藏字段,并为其分配:

$("#hiddenBooks").val(JSON.stringify(books));

相同形式的局部视图_Movies

然后,在表单发布的控制器中,我要做的就是通过这种方式将它们解析为其原始属性:

[HttpPost]
public ActionResult Create(Person person)
{
    try
    {
        person.Books = JsonConvert.DeserializeObject<List<Books>>(person.BooksRequest);
        person.Movies = JsonConvert.DeserializeObject<List<Movies>>(person.MoviesRequest);
        
        // TODO: Add insert logic here

        return RedirectToAction("Index");
    }
    catch
    {
        return View();
    }
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

具有多个模型的MVC部分视图

MVC中的视图和部分视图有什么区别

将分页添加到包含部分视图和视图模型的视图(Razor、MVC)

具有继承,嵌套viewModels和部分视图的MVC Complex模型绑定

我可以使用部分视图在ASP.NET MVC中编辑多个模型吗?

具有加载和表单模型的MVC视图

如何生成带有临时子视图的组合视图模型?

Java MVC游戏中的视图和模型

MVC视图模型和linq查询

具有验证的MVC嵌套视图模型

添加没有模型MVC的视图5

MVC 索引使用新的(增强的视图模型)进行编辑

在MVC编辑视图中将模型值设置为CKeditor

MVC 可重用控制/跨所有视图的部分视图

返回带有模型的MVC视图时,可以添加json响应吗?

带有IEnumerable <T>模型的MVC视图来自Linq To Entities-对象处理错误

带有 Html.Checkboxfor lambda 的 Asp.Net Core MVC 视图组件(覆盖模型)

ASP.NET Core MVC-带有视图的故障返回模型

Sitecore MVC返回带有Viewmoldel的视图

带有部分视图的AJAX MVC 4 ASP.net C#

在父页面上显示带有错误的MVC部分视图

如何在管理MVC 4应用程序中重用模型和视图以进行添加和编辑

MVC-使用AutoMapper发送集合视图模型

编辑和删除列表中的特定视图模型

部分视图和视图之间有什么区别?

在多个视图中编辑模型

将部分视图模型发布到同一MVC页面

如何使用模型在MVC 4的部分视图中绑定dropdownlist?

使用模型C#MVC4返回部分视图