jQuery Validate Plugin - Wie erstellt man eine einfache benutzerdefinierte Regel?

Question

Wie erstellt man eine einfache, benutzerdefinierte Regel mit dem jQuery Validate Plugin (mit addMethod ), die keine Regex verwendet?

Welche Funktion würde zum Beispiel eine Regel erstellen, die nur dann überprüft wird, wenn mindestens eines der Kontrollkästchen einer Gruppe markiert ist?

Answer 1

Sie können eine benutzerdefinierte Regel wie diese hinzufügen:

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

Und fügen Sie es als Regel wie folgt hinzu:

PhoneToggle: {
    booleanRequired: 'on'
}

Answer 2

In diesem Fall: Benutzeranmeldeformular, der Benutzer muss einen Benutzernamen wählen, der noch nicht vergeben ist.

Das bedeutet, dass wir eine benutzerdefinierte Validierungsregel erstellen müssen, die eine asynchrone HTTP-Anfrage an den Remote-Server sendet.

1. Erstellen Sie ein Eingabeelement in Ihrer Html-Datei:

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

2. deklarieren Sie Ihre Formularvalidierungsregeln:

   $("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' }, },

3. sollte der Remote-Code wie folgt aussehen:

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

Answer 3

Schritt 1 Einschließlich der cdn wie

     <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>

Schritt 2 Code Wie

  $(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
                }
            });
       }):
  });