为什么列表没有传递给 IActionResult

Question

为什么列表newsletterSubComponents 没有传递给IActionResult。任何人都可以帮忙吗？我知道有一个选项BindProperty，但我不能使用它，因为这个列表来自部分视图。我只能修改正在传递给 partial_view 的模型内部的列表。

模型列表

List<NewsletterSubComponents> newsletterSubComponents = {get; set;}

部分视图

  @{

    Model.newsletterSubComponents.Add(new Models.NewsletterSubComponents() { NewPlantArticleId = 0 });
    Model.newsletterSubComponents.Add(new Models.NewsletterSubComponents() { NewPlantArticleId = 2 });

}

@for (var i = 0; i < Model.newsletterSubComponents.Count; ++i)
{
    <select class="form-control Shoplist News-plant-select_1 mt-2" data-search="true" asp-for="@Model.newsletterSubComponents[i].NewPlantArticleId">
        <option value="0">Bitte auswählen</option>
    </select>
}

控制器

 public IActionResult OnPostUpdateComponent(NewsletterComponents component, int? newsId, int? shortArticleId,
        List<NewsletterSubComponents> newsletterSubComponents, int? newPlant1, int? newPlant2, int? newPlant3)
    {
        var dbComponent = _context.NewsletterComponents.Find(component.NewsletterComponentId);
        if (dbComponent == null)
        {
            return RedirectToPage("./Index");
        }
        dbComponent.NewsId = newsId;
        dbComponent.ShortArticleId = shortArticleId;
        dbComponent.newsletterSubComponents = component.newsletterSubComponents;
        dbComponent.NewsletterMoreLink = component.NewsletterMoreLink;
        dbComponent.CustomLinkText = component.CustomLinkText;
        dbComponent.NewsleterComponentText = component.NewsleterComponentText;
        dbComponent.NewsletterComponentHeadline = component.NewsletterComponentHeadline;
        dbComponent.EditedBy = User.Identity.Name;
        dbComponent.EditedDate = DateTime.Now;
        _context.Update(dbComponent);
        _context.SaveChanges();
        UpdateNewsletterHtml((int)dbComponent.BelongsToNewsletterId);

        return RedirectToPage(new { id = dbComponent.BelongsToNewsletterId });
    }

调试时newsletterSubComponents参数为空！

Answer 1

我已经更新了通过javascript传递列表的方法，你可以参考下面的例子。

在局部视图中，我注入了页面模型并模拟了一些数据。

@model projectname.Pages.IndexModel
@{

Model.newsletterSubComponents.Add(new Models.NewsletterSubComponents() { NewPlantArticleId = 0 });
Model.newsletterSubComponents.Add(new Models.NewsletterSubComponents() { NewPlantArticleId = 2 });

}

<form>
    @for (var i = 0; i < Model.newsletterSubComponents.Count; ++i)
    {
         <select class="form-control Shoplist News-plant-select_1 mt-2" data-search="true" onchange="changeVal(event)" asp-for="@Model.newsletterSubComponents[i].NewPlantArticleId">
            <option value="0">Bitte auswählen</option>
        </select>
    }
    @Html.AntiForgeryToken()
    <button type="button" onclick="send()">btn</button>
</form>

使用 javascript 传递此列表。

@section Scripts{
<script>
    var SubComponents = [];
    var s = '@Model.newsletterSubComponents.Count()'
    for (var i = 0; i < s; i++) {
        SubComponents[i] = { "NewPlantArticleId": $("#newsletterSubComponents_" + i + "__NewPlantArticleId").val() }
    }
     function changeVal(e) {
        let nid = e.target.id
        let k = nid.replace(/[^0-9]/ig,"")
        SubComponents[k]={ "NewPlantArticleId": $("#newsletterSubComponents_" + k + "__NewPlantArticleId").val() }
    }
    function send() {
        $.ajax({
            url: '/?handler=UpdateComponent',
            method: 'post',
            headers: {
                RequestVerificationToken: $('input:hidden[name="__RequestVerificationToken"]').val()
            },
            data: {
                newsletterSubComponents: SubComponents
            },
            success: function (data) {
                console.log(data)
            },
            error: function () {
                console.log('ee')
            }
        })
    }
</script>
}

然后，访问后端。