动态单选组的jquery表单验证

可爱的波拉克

本质上,我需要验证一种动态生成的表单(数量不受限制),该表单由成对的无线电组组成。我在这方面取得了很好的进展,但是现在我被困住了。用例:如果用户选择一对中的第一个无线电,则会显示一个隐藏的下拉列表。用户必须从该下拉列表中选择一个选项(但不能选择第一个选项,因为它是一个占位符文本),以使该对有效。现在,我的脚本正在接受“请选择”作为有效选项,但不应接受。

我有一个jsfiddle:http : //jsfiddle.net/dhLx7hnc/

这是我的jQuery:

$(".select-suboption, .see-address").hide();

$('.show').bind('change',function(){

    if ($(this).val() == 1) {
        $(this).siblings('.select-suboption').show();
        $(this).siblings('.see-address').hide();
    } else if ($(this).val() == 2) {
        $(this).siblings('.see-address').show();
        $(this).siblings('.select-suboption').hide();
    } 
});

$(function () {
    $('#validate').click(function () {

        //Make groups
        var names = []
        $('input:radio').each(function () {
            var rname = $(this).attr('name');
            if ($.inArray(rname, names) == -1) names.push(rname);
        });

        $.each(names, function (i, name) {
            if ($('input[name="' + name + '"]:checked').length == 0) {
                alert('Please check ' + name);
            } 
        });
    });
});

非常感谢您的帮助。

阿伦·P·约翰尼(Arun P Johny)

尝试

$(function () {
    $('#validate').click(function () {

        //Make groups
        var names = $('input:radio[value="1"]').map(function () {
            return this.name;
        }).get();

        $.each(names, function (i, name) {
            var $checked = $('input[name="' + name + '"]:checked');
            if ($checked.length == 0) {
                console.log('Please check ' + name);
            } else if ($checked.val() == 1 && $checked.nextAll('.select-suboption').find('select').val() == 0) {
                console.log('Please select suboption for ' + name);
            }
        });
    });
});

演示:小提琴

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章