[英]Unchecking a radio button with Jquery
I have several RadioButtonFor
(razor) and I am trying to make a JQuery script that unchecks others buttons when you check another one. 我有几个
RadioButtonFor
(剃须刀),我正在尝试制作一个JQuery脚本,当您检查另一个按钮时,该脚本会取消选中其他按钮。
I have a model with an array of booleans to pass to the Html Helper and printer names: 我有一个带有布尔数组的模型,可以传递给Html Helper和打印机名称:
public class Mymodel
{
public List<PrinterModel> printers { get; set; }
public bool noDefault { get; set; }
}
My PrinterModel
is as follows : 我的
PrinterModel
如下:
public class Printermodel
{
public bool selected { get; set; }
public string printerName { get; set; }
}
Which then gives in my view, : 在我看来,这给出了:
@using (Html.BeginForm()
{
<div class="form-group">
for (var i = 0; i < Model.printers.Count(); i++)
{
@Html.RadioButtonFor(m => m.printers[i].selected, new { @class = "default" });
@Html.Label(Model.printers[i].printerName);
<br/>
}
@Html.RadioButtonFor(m=>m.noDefaultRadio, new { @class = "noDefault", @checked= "checked" });
@Html.Label("No default printer");
</div>
}
I know I can use .prop('checked', false)
in JQuery to uncheck a radiobox, so I tried in the first play to uncheck the default button : 我知道我可以在JQuery中使用
.prop('checked', false)
取消选中单选框,所以我在第一场戏中尝试取消选中默认按钮:
$('.default').change(function () {
if ($('.default:checked').length > 0) {
$('.noDefault').prop('checked', false);
}
else {
$('.noDefault').prop('checked', true);
}
});
This does nothing, but works for checkboxes, why? 这什么都不做,但是适用于复选框,为什么?
Also , the @checked="checked"
doesn't make the RadioButtonFor
checked by default, and I've also tried @checked = true
which doesn't work either. 另外 ,
@checked="checked"
默认情况下不会使RadioButtonFor
处于选中状态,并且我也尝试了@checked = true
,这也不起作用。
Any ideas? 有任何想法吗?
EDIT When trying to use name="default"
as suggested, I see the following input when inscpecting the page in my navigator : 编辑当尝试按照建议使用
name="default"
时,在我的导航器中检查页面时,我看到以下输入:
<input data-val="true" id="printers_0__primarySelected" name="printers[0].primarySelected" type="radio" value="{ disabled = disabled }"
Can you just make the radio buttons part of a group? 您可以使单选按钮成为组的一部分吗? What you are trying to do sounds like default behavior.
您尝试做的事情听起来像是默认行为。
Can you add the name = "printerGroup"
(or similar) to your HTML attributes in the RadioButtonFor calls to group these together? 您可以在RadioButtonFor调用的HTML属性中添加
name = "printerGroup"
(或类似名称)以将它们组合在一起吗?
UPDATE: 更新:
Stepping back, sounds like you want 1 radio button to be selected. 向后退,听起来像您想要选择1个单选按钮。 You should be looking to have a selectedId or some identifier passed back to your controller once you submit.
提交后,您应该希望将selectedId或某些标识符传递回控制器。 I would look to make the following changes.
我希望进行以下更改。
Model 模型
public class PrinterModel
{
public int Id { get; set; }
public string printerName { get; set; }
}
public class MyModel
{
public List<PrinterModel> printers { get; set; } = new List<PrinterModel>();
public string selectedId { get; set; } //This will be the id of what gets selected
}
View 视图
@using (Html.BeginForm())
{
<div class="form-group">
@for (var i = 0; i < Model.printers.Count; i++)
{
@Html.RadioButtonFor(m => Model.selectedId, Model.printers[i].Id, new { name = "test" });
@Html.Label(Model.printers[i].printerName);
<br />
}
@Html.RadioButtonFor(m => Model.selectedId, "0", new { name = "test" })
@Html.Label("No default printer")
</div>
}
Inside your controller you can get the selectedId and do something with it, if 0 was passed in that would be the default (change as needed). 在您的控制器内部,您可以获取selectedId并对其进行处理,如果传入0则为默认值(根据需要更改)。
Use click
instead of change
event because once radio is checked change
event won't trigger again. 使用
click
而不是change
事件,因为一旦选中了单选, change
事件将不会再次触发。
$('.default').click(function () { if ($('.default:checked').length > 0) { $('.noDefault').prop('checked', false); } else { $('.noDefault').prop('checked', false); } });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> Check .default <input type="radio" name="one" class="default" /> <br/> Check .noDefault <input type="radio" name="two" class="noDefault" checked /> <br/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.