jQuery Validate pluginAan de slag met jQuery Validate plug-in


Opmerkingen

Deze sectie geeft een overzicht van wat jquery-validatie is en waarom een ontwikkelaar het misschien wil gebruiken.

Het moet ook alle grote onderwerpen binnen jquery-validate vermelden en een link naar de gerelateerde onderwerpen bevatten. Aangezien de Documentatie voor jquery-validatie nieuw is, moet u mogelijk eerste versies van die gerelateerde onderwerpen maken.

Installatie of instellingen

Neem de plug-in van een CDN of lokaal op na het opnemen van jQuery. .validate() vervolgens de methode .validate() aan het formulier om de plug-in te initialiseren. Binnen deze methode kunt u uw regels, aangepaste berichten en andere opties definiëren.

<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.14.0/jquery.validate.js"></script>
<script>
    $(document).ready(function() {  // <-- ensure form's HTML is ready
    
        $("#myform").validate({  // <-- initialize plugin on the form.
            // your rules and other options,
            rules: {
                first_name: {  // <-- this is the name attribute, NOT id
                    required: true
                },
                last_name: {
                    required: true
                },
                phone: {
                    required: true,
                    digits: true
                }
            }
        });
    
    });
</script>
 

Elke ingang in aanmerking voor de validatie moet een unieke bevatten name attribuut; en zo houdt de plug-in de ingangen bij. De bijbehorende HTML-opmaak:

<form id="myform">
    <input type="text" name="first_name" /><br/>
    <input type="text" name="last_name" /><br/>
    <input type="text" name="phone" /><br/>
    <input type="submit" />
</form>