How to add a Not Equal To rule in jQuery.validation

JqueryValidation

Jquery Problem Overview


I was wondering how to make it so that I could make a rule where a field is not equal to a value. Like I have a field called 'name' so I don't want 'name' = 'Your Name.'

Does anybody have an idea of how to do this? thanks for any help.

Jquery Solutions


Solution 1 - Jquery

You could use a custom method, something like this:

jQuery.validator.addMethod("notEqual", function(value, element, param) {
  return this.optional(element) || value != param;
}, "Please specify a different (non-default) value");

Then use it like this:

$("form").validate({
  rules: {
    nameField: { notEqual: "Your Name" }
  }
});

Adding it as a rule like this makes it more extensible, so you can use it to compare against the default value in other fields.

Solution 2 - Jquery

Nick's answer fits the bill. I needed to compare two fields on the form and make sure they were not equal. I modified it just a bit.

jQuery.validator.addMethod("notEqual", function(value, element, param) {
 return this.optional(element) || value != $(param).val();
}, "This has to be different...");

$("#cform").validate(
{
    rules: {
        referringsales: { required: false, notEqual: "#salesperson" }
    }
});

Edited to answer comment:

If you have more than one set of dropdowns to compare, the method also works with that case.

jQuery.validator.addMethod("notEqual", function(value, element, param) {
 return this.optional(element) || value != $(param).val();
}, "This has to be different...");

$("#cform").validate(
{
    rules: {
        referringsales: { required: false, notEqual: "#salesperson" }
        DropDown2: { required: false, notEqual: "#SecondBase" }
    }
});

If the question is regarding comparing referringsales against 2 different bases (say #initialContact and #salesperson), then simply add that rule to the list.

referringsales: { required: false, notEqual: "#salesperson", notEqual: "#initialContact" }

Solution 3 - Jquery

I propose a multi-valued function...

jQuery.validator.addMethod("notEqualTo",
function(value, element, param) {
	var notEqual = true;
	value = $.trim(value);
	for (i = 0; i < param.length; i++) {
		if (value == $.trim($(param[i]).val())) { notEqual = false; }
	}
	return this.optional(element) || notEqual;
},
"Please enter a diferent value."
);

And I call it...

$("#abm-form").validate({
debug: true,
rules: {
	password1: {
		required: true,
		minlength: 10,
		notEqualTo: ['#lastname', '#firstname', '#email']
	},
	password2: {
		equalTo: '#password1'
	}
}
});

This works for me!

Solution 4 - Jquery

There's one called "notEqualTo" in additional-methods.js in the download package:

https://github.com/jzaefferer/jquery-validation/blob/master/src/additional/notEqualTo.js

Solution 5 - Jquery

Not sure if you got your answer but:

> return this.optional(element) || value > != param;

won't work if the value is variable.

It needs to read:

> return this.optional(element) || value > != $(param).val();

Cheers

Solution 6 - Jquery

Taking some great examples here, I wrote another version that works with multiple field to check against

/*=====================================================*/
/* Jquery Valiation addMethod*/
/* Usage:  password: {notEqualTo: ['#lastname', '#firstname', '#email']} */
/*====================================================*/
jQuery.validator.addMethod("notEqualTo",
    function (value, element, param) {
        var notEqual = true;
        value = $.trim(value);
        for (i = 0; i < param.length; i++) {

            var checkElement = $(param[i]);
            var success = !$.validator.methods.equalTo.call(this, value, element, checkElement);
            // console.log('success', success);
            if(!success)
                notEqual = success;
        }

        return this.optional(element) || notEqual;
    },
    "Please enter a diferent value."
);
/*=====================================================*/
/*=====================================================*/

Usage

    $("form").validate(
        {
            rules: {
                passwordNewConfirm: {equalTo: "#passwordNew"},
                passwordNew: { notEqualTo: "#password" },
                password: { notEqualTo: ['#passwordNew', '#passwordNewConfirm'] }
            },
        });

Solution 7 - Jquery

If you have just one value where you want it to not be like your question implies, you can check against that pretty easily without any external plugins.

$('#yourForm').submit(function(e) {
    if ( $('input[name="yourField"]').val()=='Your Name' )
        e.preventDefault();
        alert("Your message here");
    }
});

Solution 8 - Jquery

Thanks a lot, Nick !!! A little adding: if you have a few fields to validate into validate() function, the syntax should be :

self.logo.rules(
    'add', {
       notEqual: "Select the Logo"
     }
);

Solution 9 - Jquery

Thanks for @Nick Craver♦'s answer, but in my working environment, it needs to be slightly modified before it could work.

 $.validator.addMethod("notEqualTo", function(value, element, param) {
       return this.optional(element) || value != $(param).val();
 }, 'This two elements are the same, please change it.');

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionKyle HotchkissView Question on Stackoverflow
Solution 1 - JqueryNick CraverView Answer on Stackoverflow
Solution 2 - JqueryFrank LukeView Answer on Stackoverflow
Solution 3 - JqueryJoseView Answer on Stackoverflow
Solution 4 - JqueryTrueWillView Answer on Stackoverflow
Solution 5 - JqueryRichard LView Answer on Stackoverflow
Solution 6 - JqueryRavi RamView Answer on Stackoverflow
Solution 7 - JqueryRobertView Answer on Stackoverflow
Solution 8 - JquerySasha.MView Answer on Stackoverflow
Solution 9 - JqueryXiao AiView Answer on Stackoverflow