如果选中单选按钮显示警报

时间:2015-06-02 10:19:06

标签: javascript jquery asp.net-mvc if-statement radio-button

我想在点击单选按钮时显示警告。

我的单选按钮:

<div class="genericFormField">
   New:@Html.RadioButtonFor(m => m.Form.InstallType, 1, Model.InstallationHeader.InstallType == 1 ? new { Checked = "checked" } : null )
   Pool:@Html.RadioButtonFor(m => m.Form.InstallType, 2, Model.InstallationHeader.InstallType == 2 ? new { Checked = "checked" } : null)
   Refurb:@Html.RadioButtonFor(m => m.Form.InstallType, 3, Model.InstallationHeader.InstallType == 3 ? new { Checked = "checked" } : null)              
</div>

因此,如果选择了新的单选按钮,我想要一个警告来说&#34; NEW&#34;否则没什么。

通常这很简单,因为你有id,但在这种情况下没有ID?

因为这是RadioButtonFor。

由于

新代码

完整代码:

       $('input[name="Form.InstallType"]').on('change', function() {
            var val = $('input[name="Form.InstallType"]:checked').val();
            if (val === '1') {

                var validOptions = "@Url.Action("SerialProdNumStockSiteAutoComplete", "Ajax")?stocksitenum=LW&model=" + $("#Form_Prod_Num").val();
                previousValue = "";

                $('#abc').autocomplete({
                    autoFocus: true,
                    source: validOptions,

                }).change(function(){

                    var source = validOptions;
                    var found = $('.ui-autocomplete li').text().search(source);
                    console.debug('found:' + found);
                    var val = $('input[name="Form.InstallType"]:checked').val();

                    if (found < 0 && val === '1') {
                        $(this).val('');
                        alert("Please choose from auto complete");

                    }

                });


            }

        });

这是有效的,但是如果单选按钮在页面加载时它不起作用,我必须单击另一个单选按钮,然后单击&#34; new&#34;然后它会工作..

如果已经检查过它而不是检查时它是否有效。

1 个答案:

答案 0 :(得分:3)

@ Html.RadioButtonFor使用inputname属性创建正确的id

您可以通过以下方式访问该值:

$('input[name="Form.InstallType"]:checked').val();

不确定生成的无线电&#39;名称,因为它是一个内部变量 渲染页面并查看生成的名称。这就是我的情况。

现在,关于你的提醒。您需要收听change事件。

$('input[name="Form.InstallType"]').on('change', function()
{
    var val = $('input[name="Form.InstallType"]:checked').val();        
    if (val === '1') alert('New');
});

为什么&#39; 1&#39;?因为您已在ASP.NET代码中设置它。 这就是它的样子。

<div class="genericFormField">
   New: @Html.RadioButtonFor(m => m.Form.InstallType, 'new')
   Pool: @Html.RadioButtonFor(m => m.Form.InstallType, 'pool')
   Refurb: @Html.RadioButtonFor(m => m.Form.InstallType, 'refurb')              
</div>
<script>
    $(document).ready(function() {
        AlertIfNewIsSelected(); // Check if it is selected on page load. According to the question in comments.
        $('input[name="Form.InstallType"]').on('change', AlertIfNewIsSelected);
    });

    function AlertIfNewIsSelected()
    {
        var val = $('input[name="Form.InstallType"]:checked').val();        
        if (val === 'new') alert('New');
    }
</script>

当然,不使用jQuery就可以实现这一切。