Check that all values ​​in the array are the same

Question

I have a webpage with a text box.

When the user enters information into it, he calls an AJAX call to check if the record is valid if it does not disable the button.

They can also contain up to 10 text fields that are executed using jQuery templates. Currently, each text field has a serial number class, and when the serial text field is blurry, it performs this check.

If they enter an invalid serial number, it will disable this button, but if they add a new text field and that it is valid, the button is now enabled, which is incorrect, since it is still not valid.

The only way I can do this is to add 1 or 0 to the array for each text field and after all the elements in the array are 1, then turn on the button. This is a good approach, if not please explain the best. If this is a good approach, how can I check if all values ​​in javascript array are the same?

thanks

Answer 1

I assume you have a function isValid(str) that returns a boolean.

Since you are using jQuery, you can use the jQuery filter() function to easily check if any inputs come in at every input break:

 $('.serial').live('blur', function () { // Get an array of all invalid inputs var invalids = $('.serial').filter(function () { return !isValid($(this).val()); }); // Does the array contain anything? $('#button').prop('disabled', invalids.length); }); 

Demo: http://jsfiddle.net/3RNV6/

---

A similar concept, but for use with AJAX:

 $('.serial').live('blur', function () { var me = this; $.ajax({ // ajax config success: function (data) { if (data === 'Y') $(me).addClass('valid'); // Get an array of all invalid inputs var invalids = $('.serial').filter(function () { return !$(this).hasClass('valid'); }); // Enable if none invalid if (invalids.length === 0) $('#button').prop('disabled', false); } }); }); $('.serial').live('keypress', function () { $('#button').prop('disabled', true); $(this).removeClass('valid'); }); 

Answer 2

This seems like a good approach. You can check for equal elements in a javascript array using this simple javascript function. You can paste this into the firebug console to test its functionality.

 // check if all elements of my_array are equal, my_array needs to be an array function check_for_equal_array_elements(my_array){ if (my_array.length == 1 || my_array.length == 0) { return true; } for (i=0;i<my_array.length;i++){ if (i > 0 && my_array[i] != my_array[i-1]) { return false; } } return true; } //Example: var my_array = []; my_array.push(5); my_array.push(5); // will alert "true" alert("all elements equal? "+check_for_equal_array_elements(my_array)); my_array.push(6); // will alert "false" alert("all elements equal? "+check_for_equal_array_elements(my_array)); 

Answer 3

First, if you dynamically create n text fields, you must use the jQuery live () or delegate () methods to add new DOM elements.

Secondly, your approach is just fine, but instead of an array, you can set the input parameter with the wrong text, and then disable the button if there are any elements with the wrong text. I think it will be faster than a loop, although all the text fields are all over.

Answer 4

I would use validation to achieve this.

http://docs.jquery.com/Plugins/Validation#Demos

If you can authenticate on the client side - use one of the existing jQuery verification functions specified in the link above, or write your own.

If you need to test the server side through ajax, you can create it in a user verification procedure.

Then, in the call that shows / hides the button - makes the call $ ('# formid) .validate () - returns false if any check is not performed.