为什么我的部分视图无法加载正确的内容?

时间:2019-04-01 15:55:00

标签: c# asp.net asp.net-mvc razor partial-views

我的局部视图包含

@model List<Destination>
    @for (var i = 0; i < Model.Count; i++)
    {
       @Html.HiddenFor(model => model[i].Id)
       <div class="form-row">
           <div class="form-group col-md-10">
                <label>@Html.LabelFor(model => model[i].Path) ( @(i + 1) )</label>
                <input type="text" value=@Model[i].Path/>  
                @Html.TextBoxFor(model => model[i].Path, new { @class = "form-control", required = "required" , title = "My custom error message")

            @Html.ValidationMessageFor(model => model[i].Path)
        </div>
        <button class="btn btn-outline-danger" onclick="deleteField(event, 
        '@Model[i].Id');">
                    <i class="fas fa-trash-alt"></i>
                </button>
    }

我添加了包含值@Model[i].Path的输入,因为我收到一个列表,因此可以在列表上进行添加和删除。如果我在删除index i=1时有3个项目的列表,它将始终删除最后一个索引,因此也会删除最后一个项目。为了测试接收输入是否正确,我添加了输入,是的,该值是正确的,但是在textboxfor中,该值未重新加载并包含旧值。

第二点,即使是自定义的消息错误,对于列表的第一个输入也不会重新加载为新的自定义消息,对于列表中添加的元素,该消息也是自定义的。

我该如何解决这两个问题,在发送模型的服务器和填充部分视图的时间之间似乎有些问题。这些对象都是正确的。

编辑:要更新部分视图,例如删除元素

public ActionResult SupprimerChampDestination(Destinations model, int idToDelete)
        {
            model.Path.RemoveAll(elementToDelete => elementToDelete.Id == idToDelete);
            ViewData.TemplateInfo.HtmlFieldPrefix = Constante.PrefixPartialViewDestination;
            return PartialView(Vues.Paths.Destination, model.Path);
        }

还有JS:

function deleteField(event, clickedId) {
            event.preventDefault();
            var model = $("#Form").serialize();
            debugger;
            $.ajax({
                type: 'POST',
                url: '@Url.Action("SupprimerChampDestination", "PathsController")',
                data: model + "&idToDelete=" + clickedId,
                success: function (response) {
                    debugger;
                    console.log(response);
                    $("#destinationMultiple").html(response);

                },
                error: function(xhr, textStatus, error) {
                    console.log(xhr.statusText);
                    console.log(textStatus);
                    console.log(error);
                }
            });
        }

$(“#destinationMultiple”)是包含我加载结果的局部视图的div。

谢谢

0 个答案:

没有答案