简体   繁体   中英

Parsley js: Form validation for password field(minlength) not working as expected

I have the following form in my HTML:

<form action="" method="POST" accept-charset="utf-8" data-parsley-validate >
    <fieldset>
        <legend>Parsely JS Testing</legend>
        <input type="" name="Full Name" placeholder="Full Name" data-parsley-pattern="[a-z|A-Z]" data-parsley-trigger="focusin focusout" data-parsley-error-message="You need to enter your full name" data-parsley-errors-container="#error-container">
        <input type="" name="Phone" placeholder="Phone" data-parsley-type="digits" data-parsley-min="10" data-parsley-trigger="focusin focusout" data-parsley-error-message="Enter valid phone number" data-parsley-errors-container="#error-container">
        <input type="" name="Email" placeholder="Email" data-parsley-type="email" data-parsley-trigger="focusin focusout" data-parsley-error-message="Enter Valid Email" data-parsley-errors-container="#error-container">
        <input type="" name="password" placeholder="Password" data-parsley-type="alphanum" data-parsley-min="7" data-parsley-trigger="focusin focusout" data-parsley-error-message="Password must be atleast 7 characters" data-parsley-errors-container="#error-container" id="password">
        <input type="" name="confirmpassword" placeholder="Confirm Password"  data-parsley-trigger="focusin focusout" data-parsley-error-message="Password Does not match" data-parsley-errors-container="#error-container" data-parsley-equalto="#password">
    </fieldset>
    <button type="submit">SUBMIT</button>
</form>

I am using parsely.js to validate this form, i am having a slight problem validating the password feild. I have the below HTML for the password feild:

<input type="" name="password" placeholder="Password" data-parsley-type="alphanum" data-parsley-min="7" data-parsley-trigger="focusin focusout" data-parsley-error-message="Password must be atleast 7 characters" data-parsley-errors-container="#error-container" id="password">

The field is validated on focusin and focusout , like so:

data-parsley-trigger="focusin focusout"

For the validation i have 2 rules , the following:

data-parsley-type="alphanum"

And

data-parsley-min="7" 

These two rules don't seem to be working very well in tandem, so if i enter the following password:

gautam007

I get an error in the #error-container , the error get is the one i entered in the error message data attribute.

data-parsley-error-message="Password must be at least 7 characters" 

Why am i getting this error and how do i work around this ?

Here is the demo how you implement minlength validation and the error message.

You need to use these data attributes on the form element:

data-parsley-minlength="7" 
data-parsley-minlength-message="Name must be at least 7 characters"

Example:

<input type="text" id="name" name="name" data-parsley-minlength="7" data-parsley-minlength-message="Name must be at least 7 characters" data-parsley-required="true" />

试试这个,看看代替data-parsley-min,

data-parsley-mincheck='7'

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM