Question

我正在尝试将模型从View传递回控制器。我正在将NaborViewModel传递给View。这是一个对象列表，每个对象都有4个复选框（其中有些是随机选中的）。

型号：

public class NaborViewModel
{
    public List<WowClass> WowClasses { get; set; }
}

动作：

    [HttpGet]
    public ActionResult Nabor()
    {
        NaborViewModel viewModel = new NaborViewModel();
        DatabaseDataContext context = new DatabaseDataContext();
        viewModel.WowClasses = context.WowClasses.ToList();

        return View(viewModel);
    }

    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Nabor(NaborViewModel model)
    {
        //DB actions
        return RedirectToAction(Consts.ActionNabor);
    }

我认为我有2种形式，每种形式都不同。第一个是我创建的，可能会起作用。第二种形式是我在网上找到的方法。第一个是正确显示传递的数据（已填充复选框）。第二个甚至显示所有未选中的复选框。提交表单后，它们都将null返回给控制器操作。

查看：

        @using (Html.BeginForm(Consts.ActionNabor, Consts.ControllerAdmin, FormMethod.Post))
        {
            @Html.AntiForgeryToken()
            <table class="admin-table">
                <thead>
                    <tr>
                        <th>Class</th>
                        <th>Status</th>
                        <th colspan="3">Požadované talenty</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach (var cls in Model.WowClasses)
                    {
                        <tr>
                            @Html.HiddenFor(x => cls.Id)
                            <td>@cls.ClassName</td>
                            <td>@Html.CheckBoxFor(x => cls.Open)</td>
                            <td style="text-align: left">@Html.CheckBoxFor(x => cls.NeedTalents1) <span>@cls.Talents1</span></td>
                            <td style="text-align: left">@Html.CheckBoxFor(x => cls.NeedTalents2) <span>@cls.Talents2</span></td>
                            <td style="text-align: left">@Html.CheckBoxFor(x => cls.NeedTalents3) <span>@cls.Talents3</span></td>
                        </tr>
                    }
                </tbody>
            </table>

            <input type="submit" value="@Consts.Submit" />
        }

        <div class="horizontal-line-both"></div>

        @using (Html.BeginForm(Consts.ActionNabor, Consts.ControllerAdmin, FormMethod.Post))
        {
            @Html.AntiForgeryToken()
            <table class="admin-table">
                <thead>
                    <tr>
                        <th>Class</th>
                        <th>Status</th>
                        <th colspan="3">Požadované talenty</th>
                    </tr>
                </thead>
                <tbody>
                    @for (int i = 0; i < Model.WowClasses.Count; i++)
                    {
                        <tr>
                            <td>
                                <input type="text" value="@Model.WowClasses[i].ClassName" name="Expense[@i].Id">
                            </td>
                            <td>
                                <input type="checkbox" value="@Model.WowClasses[i].Open" name="Expense[@i].Id">
                            </td>
                            <td>
                                <input type="checkbox" value="@Model.WowClasses[i].NeedTalents1" name="Expense[@i].Id">
                            </td>
                            <td>
                                <input type="checkbox" value="@Model.WowClasses[i].NeedTalents2" name="Expense[@i].Id">
                            </td>
                            <td>
                                <input type="checkbox" value="@Model.WowClasses[i].NeedTalents3" name="Expense[@i].Id">
                            </td>
                            <td>
                                <input type="hidden" value="@i" name="Expense[@i].Id">
                            </td>
                        </tr>
                    }
                </tbody>
            </table>

            <input type="submit" value="@Consts.Submit" />
        }

Answer 1

我将其与您的两种方法结合使用。请参阅以下内容：

@for (int i = 0; i < Model.WowClasses.Count; i++)
{
    ...
    <tr>
        @Html.EditorFor(model => model.WowClasses[i].Open)
    </tr>
    ...
}

通过其索引访问List中的每个项目是关键。如果查看使用此方法生成的HTML，则每个项目的名称都包括其索引（在上面的示例中，生成的输入的名称是：name="WowClasses[0].Open"）。这就是您的控制器操作可以区分列表项的方式。

Answer 2

对于第二种形式，您可以像这样修改每个输入字段，

对于复选框，

    <ScrollView>
        <View style={{ alignItems: 'center' }}>
            <View style={styles.userRanking}>
                { 
                    (users.length > 0) ?
                    <ScrollView>
                        <FlatList
                            data={users}                                
                            renderItem={({item}) =>
                                <ListItem                                        
                                    title={item.first_name + ' ' + item.last_name}
                                    subtitle={item.count + item.amount}
                                    bottomDivider={true}
                                />
                            }
                            keyExtractor={this.keyExtractor}
                        />
                    </ScrollView>
                }
            </View>

            <View style={styles.userRanking}>
                { 
                    (teams.length > 0) ?
                    <ScrollView>
                        <FlatList
                            data={teams}                                
                            renderItem={({item}) =>
                                <ListItem                                        
                                    title={item.first_name + ' ' + item.last_name}
                                    subtitle={item.count + item.amount}
                                    bottomDivider={true}
                                />
                            }
                            keyExtractor={this.keyExtractor}
                        />
                    </ScrollView>
                }
            </View>

            <View style={styles.userRanking}>
                { 
                    (branchs.length > 0) ?
                    <ScrollView>
                        <FlatList
                            data={branchs}                                
                            renderItem={({item}) =>
                                <ListItem                                        
                                    title={item.first_name + ' ' + item.last_name}
                                    subtitle={item.count + item.amount}
                                    bottomDivider={true}
                                />
                            }
                            keyExtractor={this.keyExtractor}
                        />
                    </ScrollView>
                }
            </View>
        </View>
    </ScrollView>

对于输入字段

<input type="checkbox" id="WowClasses_@(i)_Open" name="WowClasses[@i].Open" value="true" />

您只需更改类属性提交的每个输入即可。希望这对您有所帮助

将带有复选框列表的模型从视图传递到控制器

2 个答案: