c# - 将 IList<Model> 从 View 传递到 Controller-6ren

c# - 将 IList 从 View 传递到 Controller

转载作者：太空宇宙更新时间：2023-11-03 22:59:20

编辑 2017 年 5 月 10 日星期三 14:19 UTC

已根据要求将生成的 HTML 添加到帖子底部。我还用我的更改更新了 View 。

我正在尝试创建一个 View ，允许用户对我的数据库中的模型进行排序(更改索引)。排序是通过 JavaScript 中的拖放操作完成的，模型的 Index 会根据需要进行更新。我的问题是，当发布表单时，我模型的 IList 是空的。

型号

using System.ComponentModel.DataAnnotations;
using System.ComponentModel.DataAnnotations.Schema;
using System.Data.Entity;
using System.Web;

namespace WebApplication2.Models
{
    public class Slide
    {
        public static int CurrentIndex = 0;

        [Key]
        [Column(Order = 0)]
        public int Id
        {
            get;
            set;
        }

        [Index(IsUnique = true)]
        public int Index
        {
            get;
            set;
        }

        public string Section
        {
            get;
            set;
        }

        public string Title
        {
            get;
            set;
        }

        public string Content
        {
            get;
            set;
        }

        [Display(Name = "Image")]
        public byte[] ImageData
        {
            get;
            set;
        }

        [Display(Name = "Image Description")]
        public string ImageDescription
        {
            get;
            set;
        }

        [NotMapped]
        public HttpPostedFileBase UploadedImage
        {
            get;
            set;
        }
    }

    public class SlideDbContext : DbContext
    {
        public DbSet<Slide> Slides
        {
            get;
            set;
        }
    }
}

查看

@model IList<WebApplication2.Models.Slide>

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width"/>
    <title>Reorder</title>
    <script src="../../Scripts/jquery-3.1.1.min.js"></script>
    <script src="../../Scripts/jquery-ui-1.12.1.min.js"></script>
</head>

<body>
@using (Html.BeginForm())
{
    <table class="table grid" id="sort">
        <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.Single().Id)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Single().Index)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Single().Section)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Single().Title)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Single().Content)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Single().ImageData);
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Single().ImageDescription)
            </th>
        </tr>
        </thead>
        <tbody>
        @for (var i = 0; i < Model.Count; i++)
        {
            <tr>
                <td>
                    @Html.HiddenFor(m => Model[i].Id)
                    @Html.DisplayFor(m => Model[i].Id)
                </td>
                <td class="index">
                    @Html.EditorFor(m => Model[i].Index, new
                    {
                        htmlAttributes = new
                        {
                            name = $"slides[{i}].Index",
                            @readonly = true
                        }
                    })
                </td>
                <td>
                    @Html.HiddenFor(m => Model[i].Section)
                    @Html.DisplayFor(m => Model[i].Section)
                </td>
                <td>
                    @Html.HiddenFor(m => Model[i].Title)
                    @Html.DisplayFor(m => Model[i].Title)
                </td>
                <td>
                    @Html.HiddenFor(m => Model[i].Content)
                    @Html.DisplayFor(m => Model[i].Content)
                </td>
                <td>
                    @Html.HiddenFor(m => Model[i].ImageData)
                    <img src="@Url.Action("RenderImage", new
                              {
                                  id = Model[i].Id
                              })" alt="@Model[i].ImageDescription"/>
                </td>
                <td>
                    @Html.HiddenFor(m => Model[i].ImageDescription)
                    @Html.DisplayFor(m => Model[i].ImageDescription)
                </td>
            </tr>
        }

        </tbody>
    </table>

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

<script>
    $(function() {
        $('#sort tbody').sortable({
            stop: function(event, ui) {
                $("#sort tbody tr").each(function(index, element) {
                    var hiddenInput = $(element).children(".index").children().first();
                    hiddenInput.val(index);
                });
            }
        });
    });
</script>

</body>
</html>

Controller (相关部分)

public ActionResult Reorder()
{
    return View(_database.Slides.ToList());
}

[HttpPost]
public ActionResult Reorder(IList<Slide> slides)
{
    Debug.WriteLine(slides.Count);
    for (var i = 0; i < slides.Count; i++)
    {
        var slide = _database.Slides.Find(slides[i].Id);

        if (slide == null)
        {
            return HttpNotFound($"Slide with Id {slides[i].Id} not found.");
        }

        Debug.WriteLine(slide.Title);
        slide.Index = i;
    }

    _database.SaveChanges();

    return RedirectToAction("Index");
}

调试行是我检查 IList 中项目数量的地方，无论数据库中有多少项目(因此被传递到 View 中)，它都是 0。

加载后的 View 如下所示: 然后在我重新排序后像这样: 但是当我点击“保存”按钮时，更改没有正确发布。

我在别处读到，列表问题通常是由于没有对列表项使用连续索引引起的，但我使用了带索引器的循环，所以这不应该是问题所在。此外，我拥有所有模型属性，因此表单应该能够发布正确的 Slide 对象。

生成的 HTML

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width"/>
    <title>Reorder</title>
    <script src="../../Scripts/jquery-3.1.1.min.js"></script>
    <script src="../../Scripts/jquery-ui-1.12.1.min.js"></script>
</head>

<body>
<form action="/Slide/Reorder" method="post">    <table class="table grid" id="sort">
        <thead>
        <tr>
            <th>
                Id
            </th>
            <th>
                Index
            </th>
            <th>
                Section
            </th>
            <th>
                Title
            </th>
            <th>
                Content
            </th>
            <th>
                Image;
            </th>
            <th>
                Image Description
            </th>
        </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    <input data-val="true" data-val-number="The field Id must be a number." data-val-required="The Id field is required." name="[0].Id" type="hidden" value="1" />
                    1
                </td>
                <td class="index">
                    <input class="text-box single-line" data-val="true" data-val-number="The field Index must be a number." data-val-required="The Index field is required." name="[0].Index" readonly="True" type="number" value="0" />
                </td>
                <td>
                    <input name="[0].Section" type="hidden" value="Colors" />
                    Colors
                </td>
                <td>
                    <input name="[0].Title" type="hidden" value="Red" />
                    Red
                </td>
                <td>
                    <input name="[0].Content" type="hidden" value="This is the color red." />
                    This is the color red.
                </td>
                <td>
                    <input name="[0].ImageData" type="hidden" value="/9j/4AAQSkZJRgABAQEAYABgAAD/4QAiRXhpZgAATU0AKgAAAAgAAQESAAMAAAABAAEAAAAAAAD/2wBDAAIBAQIBAQICAgICAgICAwUDAwMDAwYEBAMFBwYHBwcGBwcICQsJCAgKCAcHCg0KCgsMDAwMBwkODw0MDgsMDAz/2wBDAQICAgMDAwYDAwYMCAcIDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAz/wAARCABkAGQDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD5rooor8DP9oAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigD/2Q==" />
                    <img src="/Slide/RenderImage/1" alt="Red"/>
                </td>
                <td>
                    <input name="[0].ImageDescription" type="hidden" value="Red" />
                    Red
                </td>
            </tr>
            <tr>
                <td>
                    <input data-val="true" data-val-number="The field Id must be a number." data-val-required="The Id field is required." name="[1].Id" type="hidden" value="2" />
                    2
                </td>
                <td class="index">
                    <input class="text-box single-line" data-val="true" data-val-number="The field Index must be a number." data-val-required="The Index field is required." name="[1].Index" readonly="True" type="number" value="1" />
                </td>
                <td>
                    <input name="[1].Section" type="hidden" value="Colors" />
                    Colors
                </td>
                <td>
                    <input name="[1].Title" type="hidden" value="Green" />
                    Green
                </td>
                <td>
                    <input name="[1].Content" type="hidden" value="This is the color green." />
                    This is the color green.
                </td>
                <td>
                    <input name="[1].ImageData" type="hidden" value="/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAIBAQIBAQICAgICAgICAwUDAwMDAwYEBAMFBwYHBwcGBwcICQsJCAgKCAcHCg0KCgsMDAwMBwkODw0MDgsMDAz/2wBDAQICAgMDAwYDAwYMCAcIDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAz/wAARCABkAGQDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDLooor8XP4DCiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKAP/Z" />
                    <img src="/Slide/RenderImage/2" alt="Green"/>
                </td>
                <td>
                    <input name="[1].ImageDescription" type="hidden" value="Green" />
                    Green
                </td>
            </tr>
            <tr>
                <td>
                    <input data-val="true" data-val-number="The field Id must be a number." data-val-required="The Id field is required." name="[2].Id" type="hidden" value="3" />
                    3
                </td>
                <td class="index">
                    <input class="text-box single-line" data-val="true" data-val-number="The field Index must be a number." data-val-required="The Index field is required." name="[2].Index" readonly="True" type="number" value="2" />
                </td>
                <td>
                    <input name="[2].Section" type="hidden" value="Colors" />
                    Colors
                </td>
                <td>
                    <input name="[2].Title" type="hidden" value="Orange" />
                    Orange
                </td>
                <td>
                    <input name="[2].Content" type="hidden" value="This is the color orange." />
                    This is the color orange.
                </td>
                <td>
                    <input name="[2].ImageData" type="hidden" value="/9j/4AAQSkZJRgABAQEAYABgAAD/4QAiRXhpZgAATU0AKgAAAAgAAQESAAMAAAABAAEAAAAAAAD/2wBDAAIBAQIBAQICAgICAgICAwUDAwMDAwYEBAMFBwYHBwcGBwcICQsJCAgKCAcHCg0KCgsMDAwMBwkODw0MDgsMDAz/2wBDAQICAgMDAwYDAwYMCAcIDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAz/wAARCABkAGQDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD2yiiiv89z/RwKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooA//9k=" />
                    <img src="/Slide/RenderImage/3" alt="Orange"/>
                </td>
                <td>
                    <input name="[2].ImageDescription" type="hidden" value="Orange" />
                    Orange
                </td>
            </tr>
            <tr>
                <td>
                    <input data-val="true" data-val-number="The field Id must be a number." data-val-required="The Id field is required." name="[3].Id" type="hidden" value="5" />
                    5
                </td>
                <td class="index">
                    <input class="text-box single-line" data-val="true" data-val-number="The field Index must be a number." data-val-required="The Index field is required." name="[3].Index" readonly="True" type="number" value="3" />
                </td>
                <td>
                    <input name="[3].Section" type="hidden" value="Colors" />
                    Colors
                </td>
                <td>
                    <input name="[3].Title" type="hidden" value="Blue" />
                    Blue
                </td>
                <td>
                    <input name="[3].Content" type="hidden" value="This is the color blue." />
                    This is the color blue.
                </td>
                <td>
                    <input name="[3].ImageData" type="hidden" value="/9j/4AAQSkZJRgABAQEAYABgAAD/4QAiRXhpZgAATU0AKgAAAAgAAQESAAMAAAABAAEAAAAAAAD/2wBDAAIBAQIBAQICAgICAgICAwUDAwMDAwYEBAMFBwYHBwcGBwcICQsJCAgKCAcHCg0KCgsMDAwMBwkODw0MDgsMDAz/2wBDAQICAgMDAwYDAwYMCAcIDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAz/wAARCABkAGQDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD5Pooor/RA+DCiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKAP/2Q==" />
                    <img src="/Slide/RenderImage/5" alt="Blue"/>
                </td>
                <td>
                    <input name="[3].ImageDescription" type="hidden" value="Blue" />
                    Blue
                </td>
            </tr>
            <tr>
                <td>
                    <input data-val="true" data-val-number="The field Id must be a number." data-val-required="The Id field is required." name="[4].Id" type="hidden" value="6" />
                    6
                </td>
                <td class="index">
                    <input class="text-box single-line" data-val="true" data-val-number="The field Index must be a number." data-val-required="The Index field is required." name="[4].Index" readonly="True" type="number" value="5" />
                </td>
                <td>
                    <input name="[4].Section" type="hidden" value="Colors" />
                    Colors
                </td>
                <td>
                    <input name="[4].Title" type="hidden" value="Yellow" />
                    Yellow
                </td>
                <td>
                    <input name="[4].Content" type="hidden" value="This is the color yellow" />
                    This is the color yellow
                </td>
                <td>
                    <input name="[4].ImageData" type="hidden" value="/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAIBAQIBAQICAgICAgICAwUDAwMDAwYEBAMFBwYHBwcGBwcICQsJCAgKCAcHCg0KCgsMDAwMBwkODw0MDgsMDAz/2wBDAQICAgMDAwYDAwYMCAcIDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAz/wAARCABkAGQDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD9aKKKK/wTP2gKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooA//9k=" />
                    <img src="/Slide/RenderImage/6" alt="Yellow"/>
                </td>
                <td>
                    <input name="[4].ImageDescription" type="hidden" value="Yellow" />
                    Yellow
                </td>
            </tr>

        </tbody>
    </table>
    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Save Order" class="btn btn-default" name="slides"/>
        </div>
    </div>
</form>
<script>
    $(function() {
        $('#sort tbody').sortable({
            stop: function(event, ui) {
                $("#sort tbody tr").each(function(index, element) {
                    var hiddenInput = $(element).children(".index").children().first();
                    hiddenInput.val(index);
                });
            }
        });
    });
</script>


<!-- Visual Studio Browser Link -->
<script type="application/json" id="__browserLink_initializationData">
    {"appName":"Firefox","requestId":"3cb43da0b95a4e85b5516b7a9fd604d5"}
</script>
<script type="text/javascript" src="http://localhost:63777/83db435e9ea240748a606c667677694e/browserLink" async="async"></script>
<!-- End Browser Link -->

</body>
</html>

最佳答案

HttpPost 上的模型将使用表单中提交的值进行填充。在您的情况下，您似乎没有生成任何输入字段来标识行。

您应该在每一行中为 Id 设置一个隐藏字段，为 Index 设置一个隐藏字段。

DisplayFor 只为您生成标签，标签不会随表单一起提交。除了每个 Label(DisplayFor)，还生成一个 Hidden 字段 (HiddenFor)，如果不是所有其他字段，至少为 Id 和 Index。

除此之外，问题出在设置为“幻灯片”的提交按钮的名称上。这也是您的 POST 操作中的参数名称。更改按钮的名称或更改 Action

上的 IList 参数的名称

你的 View 应该是这样的:

@model IList<WebApplication2.Models.Slide>

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width"/>
    <title>Reorder</title>
    <script src="../../Scripts/jquery-3.1.1.min.js"></script>
    <script src="../../Scripts/jquery-ui-1.12.1.min.js"></script>
</head>

<body>
@using (Html.BeginForm())
{
    <table class="table grid" id="sort">
        <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.Single().Id)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Single().Index)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Single().Section)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Single().Title)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Single().Content)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Single().ImageData)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Single().ImageDescription)
            </th>
        </tr>
        </thead>
        <tbody>
        @for (var i = 0; i < Model.Count; i++)
        {
            <tr>
                <td>
                    @Html.DisplayFor(m => Model[i].Id)
                    @Html.HiddenFor(m => Model[i].Id)
                </td>
                <td class="index">
                    @Html.EditorFor(m => Model[i].Index, new
                    {
                        htmlAttributes = new
                        {
                            @readonly = "true"
                        }
                    })
                </td>
                <td>
                    @Html.DisplayFor(m => Model[i].Section)
                </td>
                <td>
                    @Html.DisplayFor(m => Model[i].Title)
                </td>
                <td>
                    @Html.DisplayFor(m => Model[i].Content)
                </td>
                <td>
                    <img src="@Url.Action("RenderImage", new
                              {
                                  id = Model[i].Id
                              })" alt="@Model[i].ImageDescription"/>
                </td>
                <td>
                    @Html.DisplayFor(m => Model[i].ImageDescription)
                </td>
            </tr>
        }

        </tbody>
    </table>

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

<script>
    $(function() {
        $('#sort tbody').sortable({
            stop: function(event, ui) {
                $("#sort tbody tr").each(function(index, element) {
                    var hiddenInput = $(element).children(".index").children().first();
                hiddenInput.val(index);
                });
            }
        });
    });
</script>

</body>
</html>

关于c# - 将 IList<Model> 从 View 传递到 Controller ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43893832/

文章推荐： node.js - 与 Dat 的双向数据流

文章推荐： c++ - 如何知道焦点窗口的名称/ID

文章推荐： node.js - 无法将数据推送/更新到现有的 mongo 对象中

controller - 从另一个 Controller 调用另一个模块中的 Controller
Yii::$app->runAction('new_controller/new_action', $params); 我相信这可以用来从另一个 Controller 调用 Controller Ac
controller - 如何从子 Controller 访问父成员 Controller
这个问题类似于 this ，但我需要访问父成员(不是控制)。我不知道是否可以不使用依赖注入(inject)。例如，我有一个父级，有一个成员调用用户，我需要从子 Controller 访问用户。最佳
controller - 访问另一个 Controller 类中的 Controller
我有包含 2 个布局的根布局:- 选项面板- 绘制区域我正在尝试的是访问 OptionsPaneController 中的 DrawAreaController 以调用其绘制方法。下面是 Optio
iphone - 在 View Controller -> Tab Bar Controller -> Navigation Controller -> View Controller 层次结构中旋转 View Controller
我的应用程序的 View Controller 层次结构设置如下: UIViewController | UITabBarController | UINavigationCo
iphone - 在选项卡栏 Controller -> 导航 Controller -> View Controller 的层次结构中旋转 View Controller
我的应用程序的 View Controller 层次结构设置如下: UITabBarController | UINavigationController | | |
ios - 为什么在导航 Controller 中嵌入 View Controller ，然后在选项卡栏 Controller 中将导航栏附加到选项卡栏 Controller ？
当我第一次为我目前在 Storyboard 中开发的应用程序创建基础布局时，我分两步完成: 选择我的 View Controller 并使用 Editor->Embed In->Navigation
ios - 导航 Controller 内的选项卡栏 Controller ，如何将新的 View Controller 推送到选项卡 Controller ？
设计要求: 显示用户可以选择的项目列表选择一个项目后，使用后退按钮将用户带到一个新 View 。新 View 应在底部包含第一个屏幕中不存在的选项卡列表单击选项卡中的项目时，应出现一个带有后退按钮
angularjs - 获取子 Controller 中的父 Controller ，所有子 Controller 都使用 'controller as vm' 表示法
将父 Controller 设置为“parentCtrl as vm”，并将子 Controller 设置为“childCtrl as vmc”，以避免名称冲突，并且效果良好。如何在子 Contro
ios - Swift 尝试以模态方式呈现事件 Controller [当前 View Controller ]，即使呈现的 Controller 是另一个 Controller
我已经阅读了一些答案，例如关闭当前的 ViewController，但我的情况有所不同，因为我正在展示另一个 ViewController。虽然我无法访问它的属性，但此代码显示了带有导航 Contr
controller - Yii无法实例化 Controller
如我所见，如果我们要实例化一个Model(例如，名为Post)，我们只需调用: $post = new Post(); 现在，我还想实例化一个Controller(例如，名为Post，并为此 Cont
controller - JMeter Controller
我已经疯狂地在整个网络上搜索解决我的问题的方法，但目前还没有。我的问题是我必须检查是否在 HTTP 请求中获得特定文本，该请求在一个 while 循环中，如果我这样做了，那么我应该离开循环并继续线程，
controller - Ember.js 如何获取嵌套 Controller 名称的 Controller
我想用this.get('controllers.pack.query');要得到App.PackQueryController在 App.PackController ，但失败了。我认为问题是 E
controller - 如何在目录中组织 Controller ？
我刚开始使用 Laravel。当我使用 codeigniter 或 zend 框架时，我可以将我的 Controller 组织到一个单独的目录中。例如，我可以创建“user/permission.ph
controller - Emberjs - 如何从另一个 Controller 访问一个 Controller 的方法'
在 emberjs 前 2 我们可以从另一个 Controller 访问 Controller 或 Controller 中的任何方法以下方式: App.get('router').get('nav
ios - 通过 View Controller 、标签栏 Controller 、导航 Controller 和 View Controller 传递数据
这可能是非常简单的实现，但我是 iOS 编程的新手，我似乎被卡住了。所以，基本上，我有一个选项卡式应用程序。我决定除了标签栏之外还需要一个导航栏。为此，我放置了标签栏 Controller ，然后添
jquery - Angularjs Controller : how to call a controller in another controller?
我有这个列表 Controller ， define([ 'jquery', 'app' ], function ($,app) { app.controller("ListC
swift - 从一个 Controller 导航到另一个 Controller ，它们之间有一个根 Controller
我有 3 个 Controller :RootController、FirstController 和 SecondController。我想从 RootController -> FirstCont
ruby-on-rails - Controller 测试 : RuntimeError: @controller is nil. 如果 Controller 在子文件夹中，如何引用 Controller ？
我有以下 Controller : /controllers/api/base_controller.rb /controllers/api/v1/articles_controller.rb 当为文
javascript - 类型错误 : $controller is not a function + Controller inside controller
我是 Angular JS 的新手，尝试在另一个 Controller 中调用一个 Controller ，但出现以下错误。 ionic.bundle.js:21157 TypeError: $con
ios - 当我从一个 View Controller 展开到另一个作为选项卡栏 Controller 子级的 View Controller 时，如何显示选项卡栏 Controller ？
我有一个标签栏 Controller 和它的 3 个 child ，我还有另一个 View ，我制作了一个从 child 到 View Controller 的自定义转场，还有一个从 View Con

太空宇宙

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

c# - 将 IList 从 View 传递到 Controller

编辑 2017 年 5 月 10 日星期三 14:19 UTC

型号

查看

Controller (相关部分)

生成的 HTML