首页 > 解决方案 > Mvc Razor 在同一视图中列出和编辑每个列表项的提交按钮

问题描述

我是 MVC Razor 的新手,请帮我实现这个,我有 MVC Razor 视图我需要在同一个视图中实现列表和编辑在视图中,有一个列表将列出集合中的记录

@foreach (var item in Model.IncidentListmodel). 

该列表包含每个记录的 TextArea、Button。

@Html.TextAreaFor(modelItem => item.Note, 2, 20, new { maxlength = 50 })

<input type="button" title="Save" value="Save" onclick="location.href='@Url.Action("Updateinc", "Incident", new { id = item.Id, name = item.Name, note = item.Note})'" />

我的目的是对于每个列表项记录,用户应该能够编辑填充在文本区域中的内容并修改内容,并且可以使用相应的按钮保存(该特定记录)。

更多细节:

下面是我正在尝试实现的详细信息每个列表项都包含一个文本区域(此处正确列出数据)和每个列表项的按钮。点击按钮时,文本区域中的新内容(我从 UI 修改)应该更新(我可以编写更新代码)。但是在点击按钮时,在更改文本区域的内容后,控制器只会获取旧值。

看法:

<table>
    @foreach (var item in Model.IncidentListmodel)
    {
        string class1 = item.Id % 2 == 0 ? "orangeRaw" : "blueRaw";
        <tr class="@class1">
            <td>@Html.DisplayFor(modelItem => item.Name)</td>
            <td>@Html.DisplayFor(modelItem => item.Title)</td>
            <td>
                @Html.TextAreaFor(modelItem => item.Note, 2, 20, new { maxlength = 50 })
            </td>
            <td>
                <input type="button" title="Save" value="save" onclick="location.href='@Url.Action("Updateinc", "Incident", new { id = item.Id, name = item.Name, note = item.Note})'" />
            </td>
        </tr>
    }
</table>

控制器:

public ActionResult Updateinc(int id,string name,string note,int? status )
{
    return View();
}

标签: c#asp.net-mvcrazor

解决方案


正如斯蒂芬穆克所说,你需要form标签才能做到这一点。诀窍是要么使用for 循环生成正确的Ids,要么创建Partial ViewHttpPost

我喜欢使用局部视图,因为它更干净一些。

在此处输入图像描述

在此处输入图像描述

楷模

public class SampleViewModel
{
    public IList<IncidentListmodel> IncidentListmodel = new List<IncidentListmodel>();
}

public class IncidentListmodel
{
    public int Id { get; set; }
    public string Name { get; set; }
    public string Title { get; set; }
    public string Note { get; set; }
}

看法

@model AspNetMvc.Models.SampleViewModel

@foreach (var item in Model.IncidentListmodel)
{
    @Html.Partial("_UpdatePartial", item)
}

局部视图 (_UpdatePartial.cshtml)

@model AspNetMvc.Models.IncidentListmodel

@using (Html.BeginForm("Updateinc", "Home"))
{
    @Html.HiddenFor(m => m.Id)
    @Html.HiddenFor(m => m.Name)

    @Html.DisplayFor(m => m.Name)
    @Html.DisplayFor(m => m.Title)

    @Html.TextAreaFor(m => m.Note, 2, 20, new { maxlength = 50 })

    <button type="submit">Update</button>
}

控制器

public class HomeController : Controller
{
    public ActionResult Updateinc()
    {
        var model = new SampleViewModel
        {
            IncidentListmodel = new List<IncidentListmodel>
            {
                new IncidentListmodel {Id = 1, Name = "One", Note = "Sample text"},
                new IncidentListmodel {Id = 2, Name = "Two"},
                new IncidentListmodel {Id = 3, Name = "Three"},
            }
        };
        return View(model);
    }

    [HttpPost]
    public ActionResult Updateinc(IncidentListmodel viewModel)
    {
        // Rediret to different page.
        return RedirectToAction("Index");
    }
}

推荐阅读