Question

我在列表中使用了Html.RadioButtonFor进行项目选择，但它导致名称属性冲突。这是我的样本模型

public class DataList {
     public List<Videos> { set; get;}
}

public class Videos {
    public int isSelected {set; get;}
    public int id {set; get;}
    public string Title { set; get;}
    ---
}

查看模板将如下所示

@for (var i = 0; i <= Model.DataList.Count - 1; i++)
{
       <label class="radio">@Html.RadioButtonFor(m =>Model.Videos[i].isSelected, Model.Videos[i].id)</label>
}

但是这会导致名称属性冲突（选择多个选项而不是单个）

任何人都可以帮我解决这个问题。

Answer 1

我的问题通过将isSelected属性从列表移动到模型来解决，因为一次只选择一个选项，因此无需在列表中使用。

修改后的模型将如下所示。

public class DataList {
     public int isSelected {set; get;}
     public List<Videos> Videos { set; get;}
}

public class Videos {
    public int id {set; get;}
    public string Title { set; get;}
    ---
}

修改后的视图将如下所示

@for (var i = 0; i <= Model.DataList.Count - 1; i++)
{
       <label class="radio">@Html.RadioButtonFor(m =>Model.isSelected, Model.Videos[i].id)</label>
}

现在，此代码可以很好地完成单选按钮选择和发布数据。

Answer 2

由于输入控件是在item对象上生成的，而不是绑定的Model表达式;由于表达式不正确，控件名称在html中生成。这就是为什么在回发后，该值不会传递给ModelState中的服务器。我已更正您的观看代码。请参考以下内容：

@{ 
    var counter = 0;
}
@foreach (var Item in Model.DataList)
{
    <tr>
        <td>
              @Html.HiddenFor(m => m.DataList[counter].LanguageID)
              @Item.CultureName
        </td>
        <td>
              @if (Item.isDefault == 1)
              {
                  @Html.RadioButtonFor(m => m.DataList[counter].isDefault, Model.DataList[counter].Default, new { @checked = "checked" })
              }
              else
              {
                 @Html.RadioButtonFor(m => m.DataList[counter].isDefault, Model.DataList[counter].Default, new { })
              }
       </td>
   </tr>

  counter++;
}

Answer 3

您可以使用复选框并获得与单选按钮相同的用户界面。您只需添加一些javascript即可取消选中其他复选框。

@for (var i = 0; i < Model.DataList.Count; i++)
{
    <tr>
        <td>
            @Html.HiddenFor(m => Model.DataList[i].LanguageID)
            @Model.DataList[i].CultureName
        </td>
        <td>
            @Html.CheckBoxFor(m => Model.DataList[i].Default, new { @class="check-radio" })
        </td>
    </tr>
}
<script type="text/javascript">
    $(function () {
        $('.check-radio').change(function () {
            if ($(this).is(':checked')) {
                $('.check-radio').prop("checked", false);
                $(this).prop("checked", true);
            }
        });
    });
</script>

选定的单选按钮值未通过MVC 5

3 个答案: