.Net 6 - 将选择的单选按钮 table 行传递给控制器

Question

我真的觉得这应该很容易，但我认为它可能已经随着 .Net 6 发生了变化。我可以使用输入“name='name'”将值传递到我的控制器，但由于某种原因我不能从我的模型中获取任何值到我的控制器中。我正在尝试 POST 我的行值到控制器。我正在使用可枚举的。我不确定我是否应该使用 a 或不。另一件事是我应该如何从模型的循环中填充我的 table 行。我想使用@Html。适用于较旧的 .net，标签助手是新方法，但我无法填充我的行。

<form method="post">
        <div id="tblPullParts" class="container justify-content-center mt-3">
       
            <table class="table table-striped">
           
                <thead>
                    <tr>
                        <th></th>
                        <th >Order #</th>
                        <th >Item</th>
                        <th >Description</th>
                        <th >Quantity</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach (var p in Model)
                    {
                        <tr>
                            <td><input type="radio" id="radio" name="radio"
                                value="@Html.DisplayFor(item => p.PartID)" /></td>
@*<td><input asp-for="Selected" type="radio" value="Selected" /></td>*@
                            <th scope="row">@Html.DisplayFor(item => p.PartID)</th>
                            <td>@Html.DisplayFor(item => p.Name)</td>
                            <td>@Html.DisplayFor(item => p.ItemLocation)</td>
                            <td>@Html.DisplayFor(item => p.PartGroup)</td>
                            <td>@Html.DisplayFor(item => p.Description)</td>
                            <td>
                                <input type="text" asp-for="@p.Name" id="txtNameN" />
                            </td>
                        </tr>
                    }
                    
                </tbody>

            </table>         
            @*<input type="text" id="@Model[0].Name" />*@
            <input type="text" id="txtName" name="txtName" value="" />
        </div>
        <div class="text-center">
            <button type="submit" class="btn btn-lg btn-success mt-3">Start Pick</button>

        </div>
     </form>

[HttpPost]
        public async Task<IActionResult> Index( PartVM model, string radio, string txtName)
        {
            
            if (model?.PartID != 0)
            {
                return View("UpdatePickQuantity", model);
            }

            if (!String.IsNullOrWhiteSpace(txtName))
            {

            }

            //Request.QueryString["radio"];
            var lstParts = await _ordersService.GetAllParts();

            return View(lstParts);
        }

Answer 1

@Html.DisplayFor()只能显示模型的值，如果要提交值，需要使用<input>，这里有一个简单的demo，我添加了hidden输入在您的表单中提交值：

@model List<PartVM>
@{
    int i = 0;
}

    <form method="post">
        <div id="tblPullParts" class="container justify-content-center mt-3">
       
            <table class="table table-striped">
           
                <thead>
                    <tr>
                        <th></th>
                        <th >Order #</th>
                        <th >Item</th>
                        <th >Description</th>
                        <th >Quantity</th>
                    </tr>
                </thead>
                <tbody>
                    
                    @foreach (var p in Model)
                    {
                    
                    <tr>
                        <td><input type="radio" id="radio" name="radio"
                                value="@Html.DisplayFor(item => p.PartID)" /></td>
@*<td><input asp-for="Selected" type="radio" value="Selected" /></td>*@
                            <th scope="row">
                                @Html.DisplayFor(item => p.PartID)
                                <input type="hidden"  asp-for="@p.PartID" name="[@i].PartID">
                            </th>                                                
                            <td>
                                @Html.DisplayFor(item => p.Name)
                                
                            </td>
                           
                            <td>
                                @Html.DisplayFor(item => p.ItemLocation)
                                <input type="hidden"  asp-for="@p.ItemLocation" name="[@i].ItemLocation">
                            </td>
                            
                            <td>
                                @Html.DisplayFor(item => p.PartGroup)
                                <input type="hidden"  asp-for="@p.PartGroup" name="[@i].PartGroup">
                            </td>
                            
                            <td>
                                @Html.DisplayFor(item => p.Description)
                                <input type="hidden"  asp-for="@p.Description" name="[@i].Description">
                            </td>
                            <td>
                                <input type="text" asp-for="@p.Name"  name="[@i].Name" id="txtNameN" />
                            </td>                         
                    </tr>
                    i++;
                }
                    
                </tbody>

            </table>         
            @*<input type="text" id="@Model[0].Name" />*@
            <input type="text" id="txtName" name="txtName" value="" />
        </div>
        <div class="text-center">
            <button type="submit" class="btn btn-lg btn-success mt-3">Start Pick</button>

        </div>
 </form>

控制器

    [HttpPost]
    public async Task<IActionResult> Index( List<PartVM> model, string radio, string txtName)
    {

         //.....
    }

演示：

你的第二个问题可以参考这个github issue.

编辑============================

如果只想传递选中radio的那一行，需要js来实现。参考这个：

创建视图模型

public class PartvmViewModel
{
    public int PartID { get; set; }
    public string Name { get; set; }
    public string ItemLocation { get; set; }
    public string PartGroup { get; set; }
    public string Description { get; set; }
    public string? txtName { get; set; }
}

控制器

public IActionResult Display()

{
    List<PartvmViewModel> viewmodel = new List<PartvmViewModel>();

//pass data from PartVM to PartvmViewModel
    foreach (var item in PartVms)
    {
        viewmodel.Add(new PartvmViewModel()
        {
            PartID = item.PartID,
            Description = item.Description,
            ItemLocation = item.ItemLocation,
            Name = item.Name,
            PartGroup = item.PartGroup
        });
    }
    return View(viewmodel);
}


[HttpPost]
public IActionResult Display([FromBody]PartvmViewModel model)
{
      //because the value of radio is equal to PartID，SO i don't write it as parameter here
      //.........
            
}

查看

@model List<PartvmViewModel>
@{
    int i = 0;
}

<form method="post">
    <div id="tblPullParts" class="container justify-content-center mt-3">
       
        <table class="table table-striped">
           
            <thead>
            <tr>
                <th></th>
                <th >Order #</th>
                <th >Item</th>
                <th >Description</th>
                <th >Quantity</th>
            </tr>
            </thead>
            <tbody>
                    
            @foreach (var p in Model)
            {
                    
                <tr>
                    <td><input type="radio"  name="radio" onclick="Method(this)" 
                               value="@Html.DisplayFor(item => p.PartID)" /></td>
                    @*<td><input asp-for="Selected" type="radio" value="Selected" /></td>*@
                    <th scope="row">
                        @Html.DisplayFor(item => p.PartID)
                        <input type="hidden"  asp-for="@p.PartID" name="[@i].PartID" id="PartID">
                    </th>                                                
                    <td>
                        @Html.DisplayFor(item => p.Name)
                                
                    </td>
                           
                    <td>
                        @Html.DisplayFor(item => p.ItemLocation)
                        <input type="hidden"  asp-for="@p.ItemLocation" name="[@i].ItemLocation" id="ItemLocation">
                    </td>
                            
                    <td>
                        @Html.DisplayFor(item => p.PartGroup)
                        <input type="hidden"  asp-for="@p.PartGroup" name="[@i].PartGroup" id="PartGroup">
                    </td>
                            
                    <td>
                        @Html.DisplayFor(item => p.Description)
                        <input type="hidden"  asp-for="@p.Description" name="[@i].Description" id="Description">
                    </td>
                    <td>
                        <input type="text" asp-for="@p.Name"  name="[@i].Name" id="txtNameN" />
                    </td>                         
                </tr>
                i++;
            }
                    
            </tbody>

        </table>         
        @*<input type="text" id="@Model[0].Name" />*@
        <input type="text" id="txtName" name="txtName" value="" />
    </div>
    <div class="text-center">
        <button  class="btn btn-lg btn-success mt-3" onclick="Submit()">Start Pick</button>

    </div>
</form>

@section Scripts
{
    <script>
    
    var Data;
    
        function Method(obj){
            
            
             this.Data = {
                
                "PartID":$(obj).val(),
                
                "ItemLocation" : $(obj).parent().parent().find('td:eq(2)').find(':input').val(),
                
                "PartGroup" : $(obj).parent().parent().find('td:eq(3)').find(':input').val(),
                
                "Description" : $(obj).parent().parent().find('td:eq(4)').find(':input').val(),
                
                 "Name" : $(obj).parent().parent().find('td:eq(4)').find(':input').val(),
            }        
        }
        
        function Submit(){          
            Data.txtName = $("#txtName").val();           
           $.ajax({
                url : '/Home/Display',
                type : 'post',
                data : JSON.stringify(Data),
                contentType : 'application/json'
           });
        }
    </script>
}

我的看法==========================

其实在我看来，通过数据列表就可以了。因为我注意到你将 radio 的值传递给控制器，你可以只使用：

[HttpPost]
    public async Task<IActionResult> Index( List<PartVM> model, string radio, string txtName)
    {
     
        var item = model.Where(i => i.PartID == int.Parse(radio)).FirstOrDefault();
         //.....
    }

获取选中的行，比用js更简单；

.Net 6 - 将选择的单选按钮 table 行传递给控制器

.Net 6 - Passing a radio button selected table row to a controller

asp.net-mvc

asp.net-core

.net-6.0