如何检查是否在Razor中检查了RadioButton?

时间:2015-11-17 19:56:31

标签: c# html asp.net-mvc asp.net-mvc-4 razor

我在cshtml文件中有以下代码行,

<div class="YesNo">
    <label><input type="radio" name="YesNo_@pNum" value="Yes" />@yesLabel</label>
    <label><input type="radio" name="YesNo_@pNum" value="No" checked />@noLabel</label>
</div>

如何在Razor中使用if条件来检查是否选中“Yes”radiobutton然后只显示某个标签?

我的模型中有这两个属性,

public string YesLabel { get { return COff.YesLabel ?? "Yes"; } }
public string NoLabel { get { return COff.NoLabel ?? "No"; } }

我在cshtml文件中有2个变量,

var yesLabel = off.YesLabel;
var noLabel = off.NoLabel;

我的.cs文件中有这两个属性,

public string YesLabel { get; set; }
public string NoLabel { get; set; }

我使用了这个JS代码并且它工作但是由于我的“No”radioButton已经被检查,我无法获得所需的输出,即如果我在访问页面后选择“是”,我看不到我的代码工作因为“No”总是在内存中检查,

$(function () {                       
    var checkedRadio = $('[name="YesNo_@placementNumber"]:radio:checked').val();
    if (checkedRadio == "Yes") {
        $("#sel").html("Selected Value: " + checkedRadio);
    }
});

请任何帮助表示赞赏。

2 个答案:

答案 0 :(得分:2)

我不确定这是否是您的问题,但我认为您的name="YesNo_@pNum"视图中有{}}。我猜测@pNum是服务器端变量,输出是name="YesNo_X"。然后在JS中你有$('[name="YesNo_@placementNumber"],这将永远不会起作用,因为它不是radio的名称。

如果placementNumber是JS变量,解决方案是使用:

更改选择器
$('[name="YesNo_' + placementNumber + '"]:radio:checked')

如果你的JS中没有变量placementNumber,你可以在包裹无线电的div中添加一个id然后选择它,如下所示:

<div class="YesNo" id="radios">
    <label><input type="radio" name="YesNo_@pNum" value="Yes" />@yesLabel</label>
    <label><input type="radio" name="YesNo_@pNum" value="No" checked />@noLabel</label>
</div>

然后获取选中的值:

var checkedRadio = $('#radios :radio:checked').val();

我认为你的问题可能是另一件事是你希望你的代码在被检查的无线电改变时运行。我相信可能是因为:

  

我看不到我的代码正常工作,因为&#34;否&#34;总是在内存中检查

所以,你需要做的是:

$(function () {                       
    var radios = $('[name="YesNo_@placementNumber"]:radio');
    radios.on("change", function() {
        if ($(this).prop("checked")) {
            $("#sel").html("Selected Value: " + $(this).val());
        }
    });
});

答案 1 :(得分:1)

Razor是一个服务器端工具。页面已加载后无法运行。当有来回的时候,它不像网络表格那样。客户端和服务器之间。

使用JS,您可以进行检查,也可以使用事件来了解输入的更改时间。

您将标签存储在JS var上,或将它们放在隐藏的范围内,根据您的复选框打开和关闭它们。

例如:

var noLabel = '@noLabel';
var yesLabel = '@yesLabel';