如何创建一个简单的,自定义规则使用jQuery验证插件(使用addMethod),不使用正则表达式?

例如,哪个函数创建的规则只在至少选中一组复选框中的一个时才生效?


当前回答

对于这种情况:用户注册表单,用户必须选择一个未采取的用户名。

这意味着我们必须创建一个自定义的验证规则,该规则将向远程服务器发送异步http请求。

在你的html中创建一个input元素:

<input name="user_name" type="text" >

声明表单验证规则:

  $("form").validate({
    rules: {
      'user_name': {
        //  here jquery validate will start a GET request, to 
        //  /interface/users/is_username_valid?user_name=<input_value>
        //  the response should be "raw text", with content "true" or "false" only
        remote: '/interface/users/is_username_valid'
      },
    },

远程代码应该像这样:

class Interface::UsersController < ActionController::Base
  def is_username_valid
    render :text => !User.exists?(:user_name => params[:user_name])
  end
end

其他回答

// add a method. calls one built-in method, too.
jQuery.validator.addMethod("optdate", function(value, element) {
        return jQuery.validator.methods['date'].call(
            this,value,element
        )||value==("0000/00/00");
    }, "Please enter a valid date."
);

// connect it to a css class
jQuery.validator.addClassRules({
    optdate : { optdate : true }    
});

步骤1包含cdn like

     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

     <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>

2 .编码

  $(document).ready(function(){
        $("#submit").click(function () {
              $('#myform').validate({ // initialize the plugin
                rules: {
                    id: {
                        required: true,
                        email: true
                    },
                    password: {
                        required: true,
                        minlength: 1
                    }
                },
                messages: {
                    id: {
                        required: "Enter Email Id"

                    },
                    password: {
                        required: "Enter Email Password"

                    }
                },
                submitHandler: function (form) { // for demo
                    alert('valid form submitted'); // for demo
                    return false; // for demo
                }
            });
       }):
  }); 

你可以像这样添加一个自定义规则:

$.validator.addMethod(
    'booleanRequired',
    function (value, element, requiredValue) {
        return value === requiredValue;
    },
    'Please check your input.'
);

并将其添加为如下规则:

PhoneToggle: {
    booleanRequired: 'on'
}        

你可以这样创建一个简单的规则:

jQuery.validator.addMethod("greaterThanZero", function(value, element) {
    return this.optional(element) || (parseFloat(value) > 0);
}, "* Amount must be greater than zero");

然后像这样应用:

$('validatorElement').validate({
    rules : {
        amount : { greaterThanZero : true }
    }
});

只需更改'addMethod'的内容来验证您的复选框。

谢谢,成功了!

这是最终的代码:

$.validator.addMethod("greaterThanZero", function(value, element) {
    var the_list_array = $("#some_form .super_item:checked");
    return the_list_array.length > 0;
}, "* Please check at least one check box");