CODEWITHSUNDEEP
jqueryvalidation
Tony Stark
Tony Stark

Reputation: 156

Validation is not working proper when placeholder string and text entered is same

Using: Jquery and jquery validate js

Error: If the textbox value and plceholder string is same then the required field validation is firing,

Code:

<form method="post" action="#">
    <input type="text" name="name" placeholder="Your">
    <input type="text" name="email" placeholder="[email protected]">
    <button type="submit">Submit</button>
</form>

.

// Test if the submitted value is  equal to our placeholder.
$.validator.addMethod('notPlaceholder', function(val, el) {
    return ( val !== $(el).attr('placeholder') );
}, $.validator.messages.required);

$('form').validate({
    rules: {
        name: {
            required: true,
            notPlaceholder: true
        },
        email: {
            required: true,
            notPlaceholder: true,
            email: true
        }
    },
    
    // This is just for jsfiddle.
    debug: true,
    submitHandler: function(form) {
        $.each( $(form).serializeArray(), function(i, f) {
            $(form).append('<p>' +f.value+ '</p>');
        });
    }
});

Required: form should post

Fiddle Demo

can anyone help me out?

Upvotes: 0

Views: 258

Answers (4)

Amit Joki
Amit Joki

Reputation: 59272

I don't know what exactly you are doing, but you can do this:

$.validator.addMethod('notPlaceholder', function(val, el) {
    return !(val !== $(el).attr('placeholder'));
}

That should work.

And for submitting the form, you can do:

$(form)[0].submit();

Upvotes: 0

Mr.G
Mr.G

Reputation: 3569

Try this code :

$.validator.addMethod('notPlaceholder', function(val, el) {
    return ( val !== $(el).attr('placeholder') );
}, $.validator.messages.required);

$('form').validate({
    rules: {
        name: {
            required: true,

        },
        email: {
            required: true,

            email: true
        }
    },

    // This is just for jsfiddle.
    debug: true,
    submitHandler: function(form) {
        $.each( $(form).serializeArray(), function(i, f) {
            $(form).append('<p>' +f.value+ '</p>');
        });
    }
});

Upvotes: 0

Just code
Just code

Reputation: 13801

$('form').validate({
    rules: {
        name: {
            required: true,

        },
        email: {
            required: true,

            email: true
        }
    },

    // This is just for jsfiddle.
    debug: true,
    submitHandler: function(form) {
        $.each( $(form).serializeArray(), function(i, f) {
            $(form).append('<p>' +f.value+ '</p>');
        });
    }
});

Your jquery should looks like

Demo

Upvotes: 1

Kasyx
Kasyx

Reputation: 3200

Just remove notPlaceholder: true like in this fiddle

//rest of your code here
rules: {
    name: {
        required: true,
        //notPlaceholder: true // <- REMOVE ME
    },
    email: {
        required: true,
        //notPlaceholder: true // <- REMOVE ME
        email: true
    }
},
//rest of your code here

Upvotes: 1

Related Questions