JQuery 验证 - 如果选中复选框,则输入文本字段为必填字段

JQuery validation-input text field to be required if checkbox checked

本文关键字:字段 文本 输入 验证 如果 复选框 JQuery      更新时间:2023-09-26

我有以下复选框:

<input type="checkbox" id="startClientFromWeb" name="startClientFromWeb" data-bind="checked: StartClientFromWeb" />

和以下输入文本字段:

<input id="mimeType" name="mimeType" data-bind= "value: MimeType" />

这是我的js验证代码:

 $("#franchiseForm").validate({
            rules: {
                mimeType: {
                    required: $("#startClientFromWeb").is(":checked")
                }
            }
        });

我希望仅当选中复选框时才需要 mimeType 输入文本字段。由于某种原因,上述内容不起作用。我对javascript和jquery很陌生。任何有关工作示例的帮助将不胜感激。谢谢!

您可以添加自己的自定义验证方法来处理如下操作:

$.validator.addMethod("requiredIfChecked", function (val, ele, arg) {
    if ($("#startClientFromWeb").is(":checked") && ($.trim(val) == '')) { return false; }
    return true;
}, "This field is required if startClientFromWeb is checked...");

$("#franchiseForm").validate({  
        rules: {  
            mimeType: { requiredIfChecked: true }  
        }  
 });

如果输入disabled,验证将不会触发。您可以使用该事实 - 让文本框成为必需的,但最初是禁用的,并且仅在选中复选框时才启用它。

$(function () {
   $('#startClientFromWeb').change(function () {
        if ($(this).is(':checked')) {
            $('#mimeType').removeAttr('disabled');                
        }
        else {
            $('#mimeType').attr('disabled', 'disabled');
        }
    });
});
最简单的

工作方式:
rules : {mimeType:{required:"#startClientFromWeb:checked"}}, messages: {mimeType: {required: 'Repeat checked, To date required'}}