I have an issue, where by I am doing a simple form validation, that needs some custom stuff that the validation plugin could not do for me. Basically, I have a name, email and message field, all are required, but only email is really validated, the others just need to check if theyre not empty. Here is my current code:
$("#contactMe form").submit(function() {
var email = $('.requiredEmail').val();
if(email != 0) {
if(isValidEmailAddress(email)) {
$('.requiredText').each(function() {
thisVal = $(this).val();
var $this = $(this);
if(thisVal != 0) {
console.log('Valid Field: '+thisVal);
if ($(this) == $(this).parent(':last')) {
console.log('Last field, submit form here');
}
}
});
} else {
console.log('Email Not Valid');
}
}
return false;
});
Just to explain, I am first checking the email address is valid via the isValidEmailAddress function, which is working. Then I am going through using each(), all the requiredText fields and checking if theyre not empty. When I get to the last requiredText field, I want to submit the form using post or whatever.
if ($(this) == $(this).parent(':last')) {
What I have there is obviously incorrect but I am not sure what can be used to check if it is the last in the each result set, and perform an action if true.
Can anybody help me out here?
Thanks in advance.
To get the last item without knowing beforehand how many items it contains, you can use the length property to determine it, and since the array count starts at 0, you can pick the last item by referencing the <array>. length - 1 item.
The lastIndexOf() method returns the last index at which a given element can be found in the array, or -1 if it is not present. The array is searched backwards, starting at fromIndex .
The last() function is an inbuilt function in jQuery which is used to find the last element of the specified elements.
each
passes into your function index
and element
. Check index
against the length of the set and you're good to go:
var set = $('.requiredText');
var length = set.length;
set.each(function(index, element) {
thisVal = $(this).val();
if(parseInt(thisVal) !== 0) {
console.log('Valid Field: ' + thisVal);
if (index === (length - 1)) {
console.log('Last field, submit form here');
}
}
});
For future Googlers i've a different approach to check if it's last element. It's similar to last lines in OP question.
This directly compares elements rather than just checking index numbers.
$yourset.each(function() {
var $this = $(this);
if($this[0] === $yourset.last()[0]) {
//$this is the last one
}
});
A shorter answer from here, adapted to this question:
var arr = $('.requiredText');
arr.each(function(index, item) {
var is_last_item = (index == (arr.length - 1));
});
Just for completeness.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With