Компонент представления некорректно отображается через AJAX

Я создал сайт, на котором пользователи могут изменять различные типы данных с помощью нескольких компонентов представления. Когда я вызываю эти компоненты представления при начальной загрузке страницы, все работает нормально. Однако, когда я пытаюсь обновить компонент представления с помощью вызова ajax, любые списки в этих компонентах представления повторяют один элемент несколько раз, и мои функции jquery перестают работать.

Вот мой основной взгляд:

@model ContractModel
@using Portal.ViewComponents

@{
    ViewData["Title"] = "Contract View";
}

...

<div id="ResultModel_Scope_Facplan">
   @await Component.InvokeAsync("ContractPart", new { contractPartName = "Model_Scope_Facplan", projectName = Model.ProjectName })
</div>

Мой аякс:

@section Scripts {

    <script>
        $.ajaxSetup({ cache: false });


                $(".PartialButton").click(function (event) {
            event.preventDefault();
            var ElementID = event.target.id.split("-");
            var contractPart = ElementID[0];
            var contractAction = ElementID[1];
            var actionValue = ElementID[2];
            console.log($("#Form" + contractPart + actionValue).serialize() + "&ProjectName=@(Model.ProjectName)&contractAction=" + contractAction);
            console.log(ElementID);
            $.ajax({
                url: "@(Url.Action(""))/" + contractPart,
                type: "POST",
                data: $("#Form" + contractPart + actionValue).serialize()+"&ProjectName=@(Model.ProjectName)&contractAction=" + contractAction,
                success: function (data) {
                    //Fill div with results
                    alert(data);
                    //debugger;
                    $("#Result" + contractPart).html(data);
                },
                error: failedSearch(contractPart)
            });
        });


        function failedSearch(ElementID) {
           // alert(ElementID + " failed!");
          //  $("#Result"+ElementID).html = "There was a problem in the search. Please try again later.";
        }
    </script>
}

Мой фактический вызов компонента представления довольно прост (просто отправляет нужные данные в нужное представление).

public IViewComponentResult Invoke(string contractPartName, string projectName)
{
    return View(contractPartName, FindContractPart(contractPartName, projectName));

}

И шаблон компонента представления:

@model IEnumerable<Model_Scope_Facplan>

@if (@Model != null)
{
    <div class="row">
        Care Provider &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Payer

    </div>

                @for (int i = 0; i < Model.Count(); i++)
                {
                    <form id="FormModel_Scope_Facplan@(i)" action="">
                        <div class="form-horizontal">
                                <div class="col-md-3">
                                    <input [email protected](i).CareProviderID class="form-control" />
                                </div>
                                <div class="col-md-3">
                                    <input [email protected](i).PayerID  class="form-control" />
                                </div>
                            <span class="glyphicon glyphicon-minus DeleteItem PartialButton" style="color:blue;" id="Model_Scope_Facplan-Delete-@(i)"></span>
                        </div>
                   </form>
                   <br/>
                }
    <form id="FormModel_Scope_Facplan@(Model.Count())" action="">
        <div class="form-horizontal">
            <div class="col-md-3">
                <input name=CareProviderID class="form-control" />
            </div>
            <div class="col-md-3">
                <input name=PayerID class="form-control" />
            </div>
            <span class="glyphicon glyphicon-plus AddItem PartialButton" style="color:blue;" id="Model_Scope_Facplan-Create-@(Model.Count())"></span>

        </div>
    </form>
}

Компонент представления возвращает правильный шаблон представления, и при отладке я вижу, что ViewComponentResult.ViewData.Model включает в себя соответствующие записи в списке. Однако страница, обновленная после вызова ajax, снова и снова включает только один элемент. Что я делаю неправильно?


person user6780396    schedule 20.07.2017    source источник


Ответы (1)


Похоже, мой цикл for в представлении сломался - я предполагаю, что функция ElementAt (i) по какой-то причине не работала после вызова ajax. В итоге я переключился на цикл foreach, и теперь все работает.

person user6780396    schedule 20.07.2017
comment
кроме того, использование foreach имеет то преимущество, что каждый раз, когда вам нужен i-й элемент, вам не нужно повторять IEnumerable снова. В примере вы делаете это дважды. - person tchelidze; 20.07.2017