通过partialview更新不影响模型

Question

我通过PartialView更新ViewModel时遇到问题。 PartialView包含设备以及位置 ，该位置根据客户选择的DropDownList而有所不同。 （在底部，我提供了示例屏幕截图）。 问题在于，接受提交按钮后，ViewModel（FiscalizationViewModel）中的设备属性不会更新。 这是模型的例子。 我不确定我是否要尝试正确解决此问题。

namespace TestMVC.ViewModels
{
    public class FiscalizationViewModel
    {
        public int CustomerId { get; set; }
        public string FiscalizationDate { get; set; }

        public List<DevicesToFiscalizationViewModel> Devices { get; set; }

        public FiscalizationViewModel()
        {
            Devices = new List<DevicesToFiscalizationViewModel>();
        }

        public IEnumerable<DevicesToLocalization> GetSelectedIds()
        {
            return (from d in Devices where d.Selected select new DevicesToLocalization() { DeviceId = d.DeviceId, LocalizationId = d.LocalizationId }).ToList();
        }
    }

    public class DevicesToFiscalizationViewModel
    {
        public int DeviceId { get; set; }

        public string DeviceName { get; set; }
        public bool Selected { get; set; }
        public string SerialNumber { get; set; }

        public int LocalizationId { get; set; }
        public IEnumerable<Localization> Localizations { get; set; }

        public DevicesToFiscalizationViewModel()
        {
            Localizations = new List<Localization>();
        }
    }

}

这是Customer DropDownList事件调用的方法

public PartialViewResult CustomerChanged(int CustomerId)
{
    var localizations = db.Localizations.Where(i => i.CustomerId == CustomerId).ToList();

    var devicesToFsc = (from d in db.Devices
                        select new DevicesToFiscalizationViewModel()
                            {
                                DeviceId = d.DeviceId,
                                DeviceName = d.Name,
                                SerialNumber = d.SerialNumber,
                            }).ToList();
    foreach (var item in devicesToFsc)
    {
        item.Localizations = localizations;
    }

    return PartialView("~/Views/Fiscalizations/EditorTemplates/DevicesToFiscalizationViewModel.cshtml", devicesToFsc);

//--------------------------------
    $("#customerChanged").on("change", function () {
        $.ajax(
        {
            url: '/Fiscalizations/CustomerChanged?CustomerId=' + $(this).val(),
            type: 'GET',
            data: "",
            contentType: 'application/json; charset=utf-8',
            success: function (data) {
                $("#devicesToFiscalization").html(data);
            }
        });
    });

这只是视图的一部分（Fiscalization创建视图）

    @model TestMVC.ViewModels.FiscalizationViewModel
    <table class="table" id="devicesToFiscalization">
        <thead>
            ...
        </thead>
              @Html.Partial("~/Views/Fiscalizations/EditorTemplates/DevicesToFiscalizationViewModel.cshtml", Model.Devices)
    </table>

PartialView：

@model IEnumerable<TestMVC.ViewModels.DevicesToFiscalizationViewModel>
@foreach(var item in Model)
{ 
<tbody>
   <tr>
       <td style="text-align:center">
        <div class="checkbox">
            @Html.EditorFor(m => item.Selected)
        </div>
    </td>
    <td>
        @Html.DisplayFor(m => item.DeviceName)
    </td>
    <td>
        @Html.DisplayFor(m => item.SerialNumber)
    </td>
    <td>
        @Html.DropDownList("LocalizationId", new SelectList(item.Localizations, "LocalizationId", "Name"), "Select", htmlAttributes: new { @class = "form-control", style = "width: 200px;" })
    </td>
    <td>
        @Html.HiddenFor(m => item.DeviceId)
    </td>
  </tr>
</tbody>

这是单击外观的屏幕截图，这是调试器的屏幕截图，结果不好

Answer 1

根据我对您观点的低估，您的问题是对主视图和局部视图使用不同的模型。 您应该在两个模型绑定中使用完全相同的模型，这样可以在服务器端更新模型。 保留两个模型TestMVC.ViewModels.FiscalizationViewModel或IEnumerable<TestMVC.ViewModels.DevicesToFiscalizationViewModel>

Answer 2

它的工作原理是：）下面我展示了更改后的外观

主要观点：

@model TestMVC.ViewModels.FiscalizationViewModel
    <div id="devicesToFiscalization">
        @Html.Partial("~/Views/Fiscalizations/EditorTemplates/DevicesToFiscalizationViewModel.cshtml", Model)
    </div>

部分视图：

@model TestMVC.ViewModels.FiscalizationViewModel
<table class="table">
<thead>
    <tr>
        <th>
            Select
        </th>
        <th>
            Name
        </th>
        <th>
            Serial number
        </th>
        <th>
            Localization
        </th>
    </tr>
</thead>
<tbody>
    @for (int i = 0; i < Model.Devices.Count; i++)
    {
        <tr>
            <td style="text-align:center">
                <div class="checkbox">
                    @Html.EditorFor(m => m.Devices[i].Selected)
                </div>
            </td>
            <td>
                @Html.DisplayFor(m => m.Devices[i].DeviceName)
            </td>
            <td>
                @Html.DisplayFor(m => m.Devices[i].SerialNumber)
            </td>
            <td>
                @Html.DropDownListFor(m => m.Devices[i].LocalizationId, new SelectList(Model.Devices[i].Localizations, "LocalizationId", "Name"), "Select", htmlAttributes: new { @class = "form-control", style = "width: 200px;" })
            </td>
            <td>
                @Html.HiddenFor(m => m.Devices[i].DeviceId)
            </td>
        </tr>
    }
</tbody>

和CustomerChanged方法：

    public PartialViewResult CustomerChanged(int CustomerId)
    {
        var localizations = db.Localizations.Where(i => i.CustomerId == CustomerId).ToList();
        var Devices = (from d in db.Devices
                       select new DevicesToFiscalizationViewModel()
                       {
                           DeviceId = d.DeviceId,
                           DeviceName = d.Name,
                           SerialNumber = d.SerialNumber,
                       }).ToList();

        foreach (var item in Devices)
        {
            item.Localizations = localizations;
        }

        var fsc = new FiscalizationViewModel();
        fsc.Devices = Devices;

        return PartialView("~/Views/Fiscalizations/EditorTemplates/DevicesToFiscalizationViewModel.cshtml", fsc);
    }

================================================== ======================

我正在尝试使用EditorFor编写此代码，但是正确编写CustomerChanged方法（返回设备列表）并且不希望看到如下所示的EditorTemplate时遇到问题：

@model TestMVC.ViewModels.DevicesToFiscalizationViewModel

<tr>
    <td style="text-align:center">
        <div class="checkbox">
            @Html.EditorFor(m => m.Selected)
        </div>
    </td>
    <td>
        @Html.DisplayFor(m => m.DeviceName)
    </td>
    <td>
        @Html.DisplayFor(m => m.SerialNumber)
    </td>
    <td>
        @Html.DropDownListFor(m => m.LocalizationId, new SelectList(Model.Localizations, "LocalizationId", "Name"), "Select", htmlAttributes: new { @class = "form-control", style = "width: 200px;" })
    </td>
    <td>
        @Html.HiddenFor(m => m.DeviceId)
    </td>
</tr>

主视图：

    <table class="table" id="devicesToFiscalization">
         ...
        <tbody>
            @Html.EditorFor(m => m.Devices)
        </tbody>
    </table>