如何在 ASP.NET Core Razor 页面中绑定复杂列表

Posted 2023-03-31

【中文标题】如何在 ASP.NET Core Razor 页面中绑定复杂列表

【英文标题】：How can I bind complex Lists in ASP.NET Core RazorPages

【发布时间】：2018-10-19 10:03:33

【问题描述】：

我是 ASP.NET Core Razor 页面的新手。我尝试通过 POST 从页面中检索 List。如果我绑定原始数据类型，我没有遇到任何问题。但是，如果我想将数据从我的页面传递到服务器，其中包含一个列表，我遇到了麻烦。我能够将数据从服务器传递到客户端，但不能返回。

这是我的代码的摘录：

剃刀页面：

<form method="post">
    <table class="table">
        <thead>
            <tr>
                <th>
                    @html.DisplayNameFor(model => model.Positions[0].Number)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Positions[0].IsSelected)
                </th>
            </tr>
        </thead>
        <tbody>
            @if (!(Model.Positions is null))
            
                @foreach (var item in Model.Positions)
                
                    <tr>
                        <td>
                            @Html.DisplayFor(modelItem => item.Number)
                        </td>
                        <td>
                            @Html.CheckBoxFor(modelItem => item.IsSelected)
                        </td>
                    </tr>
                
            
        </tbody>
    </table>
    <input type="submit" />

后端 C# 文件：

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Threading.Tasks;
using Project.Models;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using Microsoft.AspNetCore.Mvc.Rendering;
using Microsoft.EntityFrameworkCore;

namespace Project.Pages

    public class TestModel : PageModel
    
        private readonly DBContext _context;


        [FromRoute]
        public int? Id  get; set; 
        public List<SelectListItem> CustomerOrder  get; set;  = new List<SelectListItem>();
        [BindProperty]
        public string SelectedNumber  get; set; 
        [BindProperty]
        public List<Position> Positions  get; set; 
        public TestModel(Project.Models.DBContext context)
        
            _context = context;
        
        public void OnGet()
        
            if (!(Id is null))
            
                _context.CustomerOrder.Select(co => co.OrderNumber).Distinct().ToList().ForEach(y => CustomerOrder.Add(new SelectListItem(text: y, value: y)));
            
        

        public async Task OnPostAsync()
        
            if (!(SelectedNumber is null))
            
                string s = $@"
                select * from Table1 xyz where xyz.Column1 in (
                    SELECT distinct Column1
                    FROM Table1
                    where value = '" + SelectedNumber + "') and xyz.name = 'SLLZ'";

                var res = await _context.Table1.FromSql(s).Select(x => x.ValueDescription).Distinct().OrderBy(x => x).ToListAsync();

                Positions = new List<Position>();
                foreach (var item in res)
                
                    Positions.Add(new Position  Number = item );
                


            
            _context.CustomerOrder.Select(co => co.OrderNumber).Distinct().ToList().ForEach(y => CustomerOrder.Add(new SelectListItem(text: y, value: y)));

        
    
    public class Position
    
        public string Number  get; set; 
        public bool IsSelected  get; set; 
    

如果我在 OnPost 方法的开头设置断点，我希望列表中填充与复选框中用户输入相关的 IsSelected-Property，但事实并非如此。

【参考方案1】：

复杂对象绑定的关键是确保将方括号中的顺序索引添加到表单字段的名称属性中，例如 [0].IsSelected 或 Positions[0].IsSelected 在您的情况下。您可以使用 for 循环和标签助手非常轻松地输出正确的 HTML。

您可以在此处阅读有关校长的更多信息：https://www.learnrazorpages.com/razor-pages/model-binding#binding-complex-collections。然后你应该能够将它应用到你的应用程序中。