prevent Duplicate values using Jquery Validation

Question

I have form and form text field which generates dynamically using JSP. And I using Jquery validation but want to add functionlaty to prevent duplicate entry in the form.

E.g.

<form name="myForm" id="myForm">
      <input type="text" name="text1" id="text1">
      <input type="text" name="text2" id="text2">
      <input type="text" name="text3" id="text3">
      =
      = 
      N number of form fields
      <input type="text" name="textn" id="textn">

</form>

I want to check if there is any duplicate value entered in the textfield using jquery validation.

Thanks

Answer 1

Something like this should work:

$(function(){

$('input[name^="text"]').change(function() {

    var $current = $(this);

    $('input[name^="text"]').each(function() {
        if ($(this).val() == $current.val() && $(this).attr('id') != $current.attr('id'))
        {
            alert('duplicate found!');
        }

    });
  });
});

In a nutshell, how this works is: Whenever a user enters something into a text box, JQuery loops through all the text boxes in the form and compares their values with the value that the user just entered, if a duplicate value is found, then alert the user.

Answer 2

Bug Magnet your answer is not extending the functionality of jquery validate. its a separate script.

You can achieve this by making these changes in In jquery.validate.js:

line 275: add a message for the unique method

messages: {
        unique: "This answer can not be repeated.",

line 744: add a new class rule for unique

classRuleSettings: {
        unique: { unique: true },

and finally line 899: add the new unique method

methods: {

        unique: function (value, element) {
            var parentForm = $(element).closest('form');
            var timeRepeated = 0;
            $(parentForm.find('input:type=text')).each(function () {
                if ($(this).val() === value) {
                    timeRepeated++;
                }
            });
            if (timeRepeated === 1 || timeRepeated === 0) {
                return true
            }
            else { 
                return false
            }
        },

now simply when you call your validate function you can use a unique method like this:

$("#signupForm").validate({
    rules: {
        firstname: "required",
        lastname: "required",
        username: {
            required: true,
            unique: true,
            minlength: 2
        },