Question

我有一些jQuery我正在使用“做东西”，具体取决于所选单选按钮的值。它工作得非常好并且符合预期......直到我将页面和POST提交回自身。在POST之后，函数中的'this'值总是第一个单选按钮 - “filterByCategory1”。我认为这与MVC滥用单选按钮id（多个按钮的id相同）有关，但这是一个没有受过教育的猜测。

jQuery：

$('input[id^="filterBy"]').change(function (e) {
    if ($(this).val() == 'filterByCategory1') {
        // do stuff
    } else if ($(this).val() == 'filterByCategory2') {
        // do other stuff
    }
});

// Just to make "do stuff" happen on initial page load
$('#filterBy').change();

剃刀位

@Html.RadioButtonFor(x => x.filterBy, "filterByCategory1", new { @checked = "checked" }) One <br />
@Html.RadioButtonFor(x => x.filterBy, "filterByCategory2") Two

Answer 1

实际上，两个无线电都使用相同的ID，导致无效标记。我建议你使用类名：

@Html.RadioButtonFor(
    x => x.filterBy, 
    "filterByCategory1", 
    new { id = "filterByCategory1", @class = "myradio" }
) 

@Html.RadioButtonFor(
    x => x.filterBy, 
    "filterByCategory2",
    new { id = "filterByCategory2", @class = "myradio" }
)

然后：

$('.myradio').change(function (e) {
    if ($(this).val() == 'filterByCategory1') {
        // do stuff
    } else if ($(this).val() == 'filterByCategory2') {
        // do other stuff
    }
});

请注意，我已从第一个广播中删除了checked属性，并在javascript中删除了明确的.change()调用。在ASP.NET MVC中选择已检查单选按钮的正确方法是在控制器操作中提供呈现此视图的值：

MyViewModel model = ...
model.filterBy = "filterByCategory1"; // set the first button as checked
return View(model);

Answer 2

如果单选按钮没有按名称分组，则更改事件将不起作用，事实上即使单选按钮也无法按预期工作。您应该使用Html.RadioButtonListFor将它们组合在一起，以便在呈现它们时它们将具有相同的名称属性但具有不同的ID。请看下面的链接。

Has anyone implement RadioButtonListFor<T> for ASP.NET MVC?

jQuery更改函数在POST w / RadioButtonFor上返回错误的值

2 个答案: