[jQuery] Re: How can I generalize this code for all values?
Just some advice: why mix - and _ all up? it makes it easier if
they were the same
for instance
input type=text id=street_number /
img id=street_number_error src=error.png /
input type=text id=street_name /
img id=street_name_error src=error.png /
$(input[id^='street_']).each(function() {
var val = $.trim(this.value);
if (val == ) {
$(# + this.id + _error).fadeIn(500);
}
else {
$(# + this.id + _error).fadeOut(500);
}
$(#submit).attr(disabled, (val == ) ? disabled : );
});
On Dec 22, 1:10 pm, Rick Faircloth r...@whitestonemedia.com wrote:
Don't know if that's the best phrasing for the subject,
but what I'm trying to do is develop some code that
will work for all for inputs of type 'text', instead
of hard-coding the id values.
The original code is this:
$('input#street_number').blur(function() {
if (this.value.length == 0)
{ $('#street-number-required-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
if (this.value.length 0)
{ $('#street-number-required-error').fadeOut(500);
$('#submit').attr('disabled', '') };
});
$('input#street_name').blur(function() {
if (this.value.length == 0)
{ $('#street-name-required-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
if (this.value.length 0)
{ $('#street-name-required-error').fadeOut(500);
$('#submit').attr('disabled', '') };
});
Here's my coding attempt: (no errors in firebug, but not response
from the DOM)...
$(document).ready(function() {
$(inp...@type='text']).each(function(i) {
$(this).blur(function() {
if (this.value.length == 0)
{ $(this.id.replace(/_/g, '-')+'-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
else
{ $(this.id.replace(/_/g, '-')+'-error').fadeOut(500);
$('#submit').attr('disabled', '') }
});
});
});
Anyone care to offer guidance to get this working?
Thanks,
Rick
[jQuery] Re: How can I generalize this code for all values?
Thanks for the reply and code...
As far as the _ vs -, I've been trying to standardize
on using _ for input names (which is necessary for the database)
and - for the id's and classes, but now, working with jQuery like
this, it is creating a problem.
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of MorningZ
Sent: Monday, December 22, 2008 1:44 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
Just some advice: why mix - and _ all up? it makes it easier if
they were the same
for instance
input type=text id=street_number /
img id=street_number_error src=error.png /
input type=text id=street_name /
img id=street_name_error src=error.png /
$(input[id^='street_']).each(function() {
var val = $.trim(this.value);
if (val == ) {
$(# + this.id + _error).fadeIn(500);
}
else {
$(# + this.id + _error).fadeOut(500);
}
$(#submit).attr(disabled, (val == ) ? disabled : );
});
On Dec 22, 1:10 pm, Rick Faircloth r...@whitestonemedia.com wrote:
Don't know if that's the best phrasing for the subject,
but what I'm trying to do is develop some code that
will work for all for inputs of type 'text', instead
of hard-coding the id values.
The original code is this:
$('input#street_number').blur(function() {
if (this.value.length == 0)
{ $('#street-number-required-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
if (this.value.length 0)
{ $('#street-number-required-error').fadeOut(500);
$('#submit').attr('disabled', '') };
});
$('input#street_name').blur(function() {
if (this.value.length == 0)
{ $('#street-name-required-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
if (this.value.length 0)
{ $('#street-name-required-error').fadeOut(500);
$('#submit').attr('disabled', '') };
});
Here's my coding attempt: (no errors in firebug, but not response
from the DOM)...
$(document).ready(function() {
$(inp...@type='text']).each(function(i) {
$(this).blur(function() {
if (this.value.length == 0)
{ $(this.id.replace(/_/g, '-')+'-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
else
{ $(this.id.replace(/_/g, '-')+'-error').fadeOut(500);
$('#submit').attr('disabled', '') }
});
});
});
Anyone care to offer guidance to get this working?
Thanks,
Rick
[jQuery] Re: How can I generalize this code for all values?
Rick - one shortcut you can do in your selector is:
$('input:text').each(function...
That might get you a better response from the DOM. I think the problem you
are seeing might be because of your single quotes around text:
$('input[type=text]') not $(inp...@type='text']).
-- Josh
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Rick Faircloth
Sent: Monday, December 22, 2008 10:10 AM
To: jquery-en@googlegroups.com
Subject: [jQuery] How can I generalize this code for all values?
Don't know if that's the best phrasing for the subject,
but what I'm trying to do is develop some code that
will work for all for inputs of type 'text', instead
of hard-coding the id values.
The original code is this:
$('input#street_number').blur(function() {
if (this.value.length == 0)
{ $('#street-number-required-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
if (this.value.length 0)
{ $('#street-number-required-error').fadeOut(500);
$('#submit').attr('disabled', '') };
});
$('input#street_name').blur(function() {
if (this.value.length == 0)
{ $('#street-name-required-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
if (this.value.length 0)
{ $('#street-name-required-error').fadeOut(500);
$('#submit').attr('disabled', '') };
});
Here's my coding attempt: (no errors in firebug, but not response
from the DOM)...
$(document).ready(function() {
$(inp...@type='text']).each(function(i) {
$(this).blur(function() {
if (this.value.length == 0)
{ $(this.id.replace(/_/g, '-')+'-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
else
{ $(this.id.replace(/_/g, '-')+'-error').fadeOut(500);
$('#submit').attr('disabled', '') }
});
});
});
Anyone care to offer guidance to get this working?
Thanks,
Rick
[jQuery] Re: How can I generalize this code for all values?
I see in your example code that you're still using a hard-coded name
for the input. I'd like it completely generalized for all variables.
I'm working towards creating code for categories of input types: text,
radio, checkbox, and textarea, etc.
I modified your example, and all seems to be working well with the code
below, except that the submit button is becoming enabled even when there
is an error message showing. I don't understand the last line enough
to even tinker with that...suggestions?
Thanks, Rick
Here's the new code:
$(document).ready(function() {
$(inp...@type='text']).each(function() {
$(this).blur(function() {
var val = $.trim(this.value);
if (val == )
{ $(# + this.id + _error).fadeIn(500); }
else
{ $(# + this.id + _error).fadeOut(500); }
$(#submit).attr('disabled', (val == ) ? disabled :
);
});
});
});
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of MorningZ
Sent: Monday, December 22, 2008 1:44 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
Just some advice: why mix - and _ all up? it makes it easier if
they were the same
for instance
input type=text id=street_number /
img id=street_number_error src=error.png /
input type=text id=street_name /
img id=street_name_error src=error.png /
$(input[id^='street_']).each(function() {
var val = $.trim(this.value);
if (val == ) {
$(# + this.id + _error).fadeIn(500);
}
else {
$(# + this.id + _error).fadeOut(500);
}
$(#submit).attr(disabled, (val == ) ? disabled : );
});
On Dec 22, 1:10 pm, Rick Faircloth r...@whitestonemedia.com wrote:
Don't know if that's the best phrasing for the subject,
but what I'm trying to do is develop some code that
will work for all for inputs of type 'text', instead
of hard-coding the id values.
The original code is this:
$('input#street_number').blur(function() {
if (this.value.length == 0)
{ $('#street-number-required-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
if (this.value.length 0)
{ $('#street-number-required-error').fadeOut(500);
$('#submit').attr('disabled', '') };
});
$('input#street_name').blur(function() {
if (this.value.length == 0)
{ $('#street-name-required-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
if (this.value.length 0)
{ $('#street-name-required-error').fadeOut(500);
$('#submit').attr('disabled', '') };
});
Here's my coding attempt: (no errors in firebug, but not response
from the DOM)...
$(document).ready(function() {
$(inp...@type='text']).each(function(i) {
$(this).blur(function() {
if (this.value.length == 0)
{ $(this.id.replace(/_/g, '-')+'-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
else
{ $(this.id.replace(/_/g, '-')+'-error').fadeOut(500);
$('#submit').attr('disabled', '') }
});
});
});
Anyone care to offer guidance to get this working?
Thanks,
Rick
[jQuery] Re: How can I generalize this code for all values?
Try this change
$(#submit).attr('disabled', (val == ) ? disabled : null);
If that doesn't work, then perhaps:
if (val == ) {
$(# + this.id + _error).fadeIn(500);
$(#submit).attr(disabled, disabled);
}
else {
$(# + this.id + _error).fadeOut(500);
$(#submit).removeAttr(disabled);
}
On Dec 22, 2:21 pm, Rick Faircloth r...@whitestonemedia.com wrote:
I see in your example code that you're still using a hard-coded name
for the input. I'd like it completely generalized for all variables.
I'm working towards creating code for categories of input types: text,
radio, checkbox, and textarea, etc.
I modified your example, and all seems to be working well with the code
below, except that the submit button is becoming enabled even when there
is an error message showing. I don't understand the last line enough
to even tinker with that...suggestions?
Thanks, Rick
Here's the new code:
$(document).ready(function() {
$(inp...@type='text']).each(function() {
$(this).blur(function() {
var val = $.trim(this.value);
if (val == )
{ $(# + this.id + _error).fadeIn(500); }
else
{ $(# + this.id + _error).fadeOut(500); }
$(#submit).attr('disabled', (val == ) ? disabled :
);
});
});
});
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of MorningZ
Sent: Monday, December 22, 2008 1:44 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
Just some advice: why mix - and _ all up? it makes it easier if
they were the same
for instance
input type=text id=street_number /
img id=street_number_error src=error.png /
input type=text id=street_name /
img id=street_name_error src=error.png /
$(input[id^='street_']).each(function() {
var val = $.trim(this.value);
if (val == ) {
$(# + this.id + _error).fadeIn(500);
}
else {
$(# + this.id + _error).fadeOut(500);
}
$(#submit).attr(disabled, (val == ) ? disabled : );
});
On Dec 22, 1:10 pm, Rick Faircloth r...@whitestonemedia.com wrote:
Don't know if that's the best phrasing for the subject,
but what I'm trying to do is develop some code that
will work for all for inputs of type 'text', instead
of hard-coding the id values.
The original code is this:
$('input#street_number').blur(function() {
if (this.value.length == 0)
{ $('#street-number-required-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
if (this.value.length 0)
{ $('#street-number-required-error').fadeOut(500);
$('#submit').attr('disabled', '') };
});
$('input#street_name').blur(function() {
if (this.value.length == 0)
{ $('#street-name-required-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
if (this.value.length 0)
{ $('#street-name-required-error').fadeOut(500);
$('#submit').attr('disabled', '') };
});
Here's my coding attempt: (no errors in firebug, but not response
from the DOM)...
$(document).ready(function() {
$(inp...@type='text']).each(function(i) {
$(this).blur(function() {
if (this.value.length == 0)
{ $(this.id.replace(/_/g, '-')+'-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
else
{ $(this.id.replace(/_/g, '-')+'-error').fadeOut(500);
$('#submit').attr('disabled', '') }
});
});
});
Anyone care to offer guidance to get this working?
Thanks,
Rick
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
jQuery (English) group.
To post to this group, send email to jquery-en@googlegroups.com
To unsubscribe from this group, send email to
jquery-en+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/jquery-en?hl=en
-~--~~~~--~~--~--~---
[jQuery] Re: How can I generalize this code for all values?
Ok...after a lot of experimentation, I've got a solution
that's working to the point that I've attempted to implement it.
Here's the code:
$(document).ready(function() {
$('input:text.required').each(function() {
$(this).blur(function() {
var val = (this.value.length);
if (val == 0)
{ $(# + this.id + _error).fadeIn(500);
$('#submit').attr('disabled', 'disabled'); }
else
{ $(# + this.id + _error).fadeOut(500);
$('#submit').removeAttr('disabled'); };
$('input:text.required').each(function() {
var val = (this.value.length);
if (val == 0)
{ $('#submit').attr('disabled', 'disabled'); }
});
});
});
});
This code allows for the following:
- on blur of any text input with class 'required' the length is checked
- if the length of the required field is 0, then the error message is shown
and the submit button for the form is disabled
- the second half of the code checks all the text inputs with class 'required'
- if the length of any of the required text fields is 0, then the submit button
is disabled
What I need to do now:
- Allow for other type of inputs to be checked on blur, etc., such as selects
(Later, I'll add other types of validation, such as numeric, etc.)
Question:
- How do I modify ('input:text.required') to accommodate other types of
required inputs?
- I tried ('input:text.required, input:select.required') and
('input:text.required', 'input:select.required') but that didn't work
Clues or hints?
Thanks,
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of MorningZ
Sent: Monday, December 22, 2008 2:40 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
Try this change
$(#submit).attr('disabled', (val == ) ? disabled : null);
If that doesn't work, then perhaps:
if (val == ) {
$(# + this.id + _error).fadeIn(500);
$(#submit).attr(disabled, disabled);
}
else {
$(# + this.id + _error).fadeOut(500);
$(#submit).removeAttr(disabled);
}
On Dec 22, 2:21 pm, Rick Faircloth r...@whitestonemedia.com wrote:
I see in your example code that you're still using a hard-coded name
for the input. I'd like it completely generalized for all variables.
I'm working towards creating code for categories of input types: text,
radio, checkbox, and textarea, etc.
I modified your example, and all seems to be working well with the code
below, except that the submit button is becoming enabled even when there
is an error message showing. I don't understand the last line enough
to even tinker with that...suggestions?
Thanks, Rick
Here's the new code:
$(document).ready(function() {
$(inp...@type='text']).each(function() {
$(this).blur(function() {
var val = $.trim(this.value);
if (val == )
{ $(# + this.id + _error).fadeIn(500); }
else
{ $(# + this.id + _error).fadeOut(500); }
$(#submit).attr('disabled', (val == ) ? disabled
: );
});
});
});
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of MorningZ
Sent: Monday, December 22, 2008 1:44 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
Just some advice: why mix - and _ all up? it makes it easier if
they were the same
for instance
input type=text id=street_number /
img id=street_number_error src=error.png /
input type=text id=street_name /
img id=street_name_error src=error.png /
$(input[id^='street_']).each(function() {
var val = $.trim(this.value);
if (val == ) {
$(# + this.id + _error).fadeIn(500);
}
else {
$(# + this.id + _error).fadeOut(500);
}
$(#submit).attr(disabled, (val == ) ? disabled : );
});
On Dec 22, 1:10 pm, Rick Faircloth r...@whitestonemedia.com wrote:
Don't know if that's the best phrasing for the subject,
but what I'm trying to do is develop some code that
will work for all for inputs of type 'text', instead
of hard-coding the id values.
The original code is this:
$('input#street_number').blur(function() {
if (this.value.length == 0)
{ $('#street-number-required-error').fadeIn(500);
$('#submit').attr('disabled', 'disabled') }
if (this.value.length 0)
{ $('#street-number-required-error').fadeOut(500
[jQuery] Re: How can I generalize this code for all values?
try this, it accounts for checking all the required fields to see if
they are blank and disable
jQuery(function(){
// all the required text fields
var $required = $('input.required:text');
// function checks for blank input
var isBlank = function(str) {
return $.trim(str).length==0
}
// function checks if other required fields are blank
var checkAllRequired = function () {
var allFilled = true;
$required.each(function() {
if (isBlank(this.value))
allFilled = false;
});
return allFilled;
}
// initially disable or enable the submit button
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
// same as $required each blur
$required.blur(function() {
// checks if current field is blank
if (isBlank(this.value))
$(# + this.id + _error).fadeIn(500);
else
$(# + this.id + _error).fadeOut(500);
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
});
});
On Dec 22, 3:54 pm, Rick Faircloth r...@whitestonemedia.com wrote:
Ok...after a lot of experimentation, I've got a solution
that's working to the point that I've attempted to implement it.
Here's the code:
$(document).ready(function() {
$('input:text.required').each(function() {
$(this).blur(function() {
var val = (this.value.length);
if (val == 0)
{ $(# + this.id + _error).fadeIn(500);
$('#submit').attr('disabled', 'disabled'); }
else
{ $(# + this.id + _error).fadeOut(500);
$('#submit').removeAttr('disabled'); };
$('input:text.required').each(function() {
var val = (this.value.length);
if (val == 0)
{ $('#submit').attr('disabled', 'disabled'); }
});
});
});
});
This code allows for the following:
- on blur of any text input with class 'required' the length is checked
- if the length of the required field is 0, then the error message is shown
and the submit button for the form is disabled
- the second half of the code checks all the text inputs with class 'required'
- if the length of any of the required text fields is 0, then the submit
button is disabled
What I need to do now:
- Allow for other type of inputs to be checked on blur, etc., such as selects
(Later, I'll add other types of validation, such as numeric, etc.)
Question:
- How do I modify ('input:text.required') to accommodate other types of
required inputs?
- I tried ('input:text.required, input:select.required') and
('input:text.required', 'input:select.required') but that didn't
work
Clues or hints?
Thanks,
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of MorningZ
Sent: Monday, December 22, 2008 2:40 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
Try this change
$(#submit).attr('disabled', (val == ) ? disabled : null);
If that doesn't work, then perhaps:
if (val == ) {
$(# + this.id + _error).fadeIn(500);
$(#submit).attr(disabled, disabled);
}
else {
$(# + this.id + _error).fadeOut(500);
$(#submit).removeAttr(disabled);
}
On Dec 22, 2:21 pm, Rick Faircloth r...@whitestonemedia.com wrote:
I see in your example code that you're still using a hard-coded name
for the input. I'd like it completely generalized for all variables.
I'm working towards creating code for categories of input types: text,
radio, checkbox, and textarea, etc.
I modified your example, and all seems to be working well with the code
below, except that the submit button is becoming enabled even when there
is an error message showing. I don't understand the last line enough
to even tinker with that...suggestions?
Thanks, Rick
Here's the new code:
$(document).ready(function() {
$(inp...@type='text']).each(function() {
$(this).blur(function() {
var val = $.trim(this.value);
if (val == )
{ $(# + this.id + _error).fadeIn(500); }
else
{ $(# + this.id + _error).fadeOut(500); }
$(#submit).attr('disabled', (val == ) ?
disabled : );
});
});
});
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of MorningZ
Sent: Monday, December 22, 2008 1:44 PM
To: jQuery (English)
Subject: [jQuery] Re: How
[jQuery] Re: How can I generalize this code for all values?
var checkAllRequired = function () {
var allFilled = true;
$required.each(function() {
if (isBlank(this.value))
allFilled = false;
});
return allFilled;
}
can be optimized to
var checkAllRequired = function () {
for (var i=0; i$required.length; i++)
if (isBlank($required[i].value))
return false;
return true;
}
On Dec 22, 5:26 pm, Kean shenan...@gmail.com wrote:
try this, it accounts for checking all the required fields to see if
they are blank and disable
jQuery(function(){
// all the required text fields
var $required = $('input.required:text');
// function checks for blank input
var isBlank = function(str) {
return $.trim(str).length==0
}
// function checks if other required fields are blank
var checkAllRequired = function () {
var allFilled = true;
$required.each(function() {
if (isBlank(this.value))
allFilled = false;
});
return allFilled;
}
// initially disable or enable the submit button
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
// same as $required each blur
$required.blur(function() {
// checks if current field is blank
if (isBlank(this.value))
$(# + this.id + _error).fadeIn(500);
else
$(# + this.id + _error).fadeOut(500);
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
});
});
On Dec 22, 3:54 pm, Rick Faircloth r...@whitestonemedia.com wrote:
Ok...after a lot of experimentation, I've got a solution
that's working to the point that I've attempted to implement it.
Here's the code:
$(document).ready(function() {
$('input:text.required').each(function() {
$(this).blur(function() {
var val = (this.value.length);
if (val == 0)
{ $(# + this.id + _error).fadeIn(500);
$('#submit').attr('disabled', 'disabled'); }
else
{ $(# + this.id + _error).fadeOut(500);
$('#submit').removeAttr('disabled'); };
$('input:text.required').each(function() {
var val = (this.value.length);
if (val == 0)
{ $('#submit').attr('disabled', 'disabled'); }
});
});
});
});
This code allows for the following:
- on blur of any text input with class 'required' the length is checked
- if the length of the required field is 0, then the error message is
shown
and the submit button for the form is disabled
- the second half of the code checks all the text inputs with class
'required'
- if the length of any of the required text fields is 0, then the submit
button is disabled
What I need to do now:
- Allow for other type of inputs to be checked on blur, etc., such as
selects
(Later, I'll add other types of validation, such as numeric, etc.)
Question:
- How do I modify ('input:text.required') to accommodate other types of
required inputs?
- I tried ('input:text.required, input:select.required') and
('input:text.required', 'input:select.required') but that didn't
work
Clues or hints?
Thanks,
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of MorningZ
Sent: Monday, December 22, 2008 2:40 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
Try this change
$(#submit).attr('disabled', (val == ) ? disabled : null);
If that doesn't work, then perhaps:
if (val == ) {
$(# + this.id + _error).fadeIn(500);
$(#submit).attr(disabled, disabled);
}
else {
$(# + this.id + _error).fadeOut(500);
$(#submit).removeAttr(disabled);
}
On Dec 22, 2:21 pm, Rick Faircloth r...@whitestonemedia.com wrote:
I see in your example code that you're still using a hard-coded name
for the input. I'd like it completely generalized for all variables.
I'm working towards creating code for categories of input types: text,
radio, checkbox, and textarea, etc.
I modified your example, and all seems to be working well with the code
below, except that the submit button is becoming enabled even when there
is an error message showing. I don't understand the last line enough
to even tinker with that...suggestions?
Thanks, Rick
[jQuery] Re: How can I generalize this code for all values?
$('input:text.required').each(function() {
var val = (this.value.length);
if (val == 0)
{ $('#submit').attr('disabled', 'disabled'); }
});
I think this is equivalent to:
if ( $(':text.required[value=]').length )
$('#submit').attr('disabled', 'disabled');
That does allow a field with just spaces to qualify, but on my forms I
typically make this check on a submit handler and have already trimmed
spaces off all text fields at the top of that handler to simplify the
later logic:
$(:text).each(function(){
this.value = this.value.replace(/^\s+|\s+$/g,));
});
The other way to find fields that are just blanks would be to create a
custom selector:
jQuery.extend(jQuery.expr[':'], {
blank: function(a) {
return !a.value || !/^\s+$/.test(a.value);
}
})
and use it this way:
if ( $(':text.required:blank').length )
$('#submit').attr('disabled', 'disabled');
- How do I modify ('input:text.required') to accommodate other types of
required inputs?
- I tried ('input:text.required, input:select.required') and
('input:text.required', 'input:select.required') but that didn't
work
Since the select is its own element, you'd use something like
$(':text.required, select.required')
or
$(':text, select').filter('.required')
If you're doing a lot of forms on a regular basis, you might also want
to check out the validate plugin:
http://jquery.bassistance.de/validate/demo/
No matter what, good form validation is a pain. At this point I'm sure
you agree... :-)
[jQuery] Re: How can I generalize this code for all values?
Thanks, Kean and Dave, for your code suggestions and feedback.
And, Dave...yes, I would have preferred, actually, to use Jorn's
validation plug-in, but could not figure out a way to cause
it to validate on blur. Jorn has set up the default validation
to occur after a form is submitted, but I believe it is more helpful
to the user to validate the fields as they fill them in, rather than
wait until they have submitted the entire form.
I tried to figure out a way to adjust the validation events in his
plug-in, but couldn't get it to work...so I'm just rollin' my own.
I'll look at your code suggestions and see what I can do.
Thanks!
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Dave Methvin
Sent: Monday, December 22, 2008 9:07 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
$('input:text.required').each(function() {
var val = (this.value.length);
if (val == 0)
{ $('#submit').attr('disabled', 'disabled'); }
});
I think this is equivalent to:
if ( $(':text.required[value=]').length )
$('#submit').attr('disabled', 'disabled');
That does allow a field with just spaces to qualify, but on my forms I
typically make this check on a submit handler and have already trimmed
spaces off all text fields at the top of that handler to simplify the
later logic:
$(:text).each(function(){
this.value = this.value.replace(/^\s+|\s+$/g,));
});
The other way to find fields that are just blanks would be to create a
custom selector:
jQuery.extend(jQuery.expr[':'], {
blank: function(a) {
return !a.value || !/^\s+$/.test(a.value);
}
})
and use it this way:
if ( $(':text.required:blank').length )
$('#submit').attr('disabled', 'disabled');
- How do I modify ('input:text.required') to accommodate other types of
required inputs?
- I tried ('input:text.required, input:select.required') and
('input:text.required', 'input:select.required') but that didn't
work
Since the select is its own element, you'd use something like
$(':text.required, select.required')
or
$(':text, select').filter('.required')
If you're doing a lot of forms on a regular basis, you might also want
to check out the validate plugin:
http://jquery.bassistance.de/validate/demo/
No matter what, good form validation is a pain. At this point I'm sure
you agree... :-)
[jQuery] Re: How can I generalize this code for all values?
How can this:
// all the required text fields
var $required = $('input.required:text');
be expanded to include 'input.required:select' ?
I tried all the variations I could think of, including:
$('input.required:text', 'input.required:select')
but that, and every other variation, throws an error.
What's the syntax for specifying various types of required inputs?
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Kean
Sent: Monday, December 22, 2008 8:26 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
try this, it accounts for checking all the required fields to see if
they are blank and disable
jQuery(function(){
// all the required text fields
var $required = $('input.required:text');
// function checks for blank input
var isBlank = function(str) {
return $.trim(str).length==0
}
// function checks if other required fields are blank
var checkAllRequired = function () {
var allFilled = true;
$required.each(function() {
if (isBlank(this.value))
allFilled = false;
});
return allFilled;
}
// initially disable or enable the submit button
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
// same as $required each blur
$required.blur(function() {
// checks if current field is blank
if (isBlank(this.value))
$(# + this.id + _error).fadeIn(500);
else
$(# + this.id + _error).fadeOut(500);
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
});
});
On Dec 22, 3:54 pm, Rick Faircloth r...@whitestonemedia.com wrote:
Ok...after a lot of experimentation, I've got a solution
that's working to the point that I've attempted to implement it.
Here's the code:
$(document).ready(function() {
$('input:text.required').each(function() {
$(this).blur(function() {
var val = (this.value.length);
if (val == 0)
{ $(# + this.id + _error).fadeIn(500);
$('#submit').attr('disabled', 'disabled'); }
else
{ $(# + this.id + _error).fadeOut(500);
$('#submit').removeAttr('disabled'); };
$('input:text.required').each(function() {
var val = (this.value.length);
if (val == 0)
{ $('#submit').attr('disabled', 'disabled'); }
});
});
});
});
This code allows for the following:
- on blur of any text input with class 'required' the length is checked
- if the length of the required field is 0, then the error message is
shown
and the submit button for the form is disabled
- the second half of the code checks all the text inputs with class
'required'
- if the length of any of the required text fields is 0, then the submit
button is disabled
What I need to do now:
- Allow for other type of inputs to be checked on blur, etc., such as
selects
(Later, I'll add other types of validation, such as numeric, etc.)
Question:
- How do I modify ('input:text.required') to accommodate other types of
required inputs?
- I tried ('input:text.required, input:select.required') and
('input:text.required', 'input:select.required') but that didn't
work
Clues or hints?
Thanks,
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of MorningZ
Sent: Monday, December 22, 2008 2:40 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
Try this change
$(#submit).attr('disabled', (val == ) ? disabled : null);
If that doesn't work, then perhaps:
if (val == ) {
$(# + this.id + _error).fadeIn(500);
$(#submit).attr(disabled, disabled);
}
else {
$(# + this.id + _error).fadeOut(500);
$(#submit).removeAttr(disabled);
}
On Dec 22, 2:21 pm, Rick Faircloth r...@whitestonemedia.com wrote:
I see in your example code that you're still using a hard-coded name
for the input. I'd like it completely generalized for all variables.
I'm working towards creating code for categories of input types: text,
radio, checkbox, and textarea, etc.
I modified your example, and all seems to be working well with the code
below, except that the submit button is becoming enabled even when there
is an error message showing. I don't understand the last line enough
to even tinker with that...suggestions
[jQuery] Re: How can I generalize this code for all values?
From http://docs.jquery.com/Selectors (Forms section):
:input
Matches all input, textarea, select and button elements.
To select all Form elements with a required class:
$(':input.required')
Karl Rudd
On Tue, Dec 23, 2008 at 2:39 PM, Rick Faircloth
r...@whitestonemedia.com wrote:
How can this:
// all the required text fields
var $required = $('input.required:text');
be expanded to include 'input.required:select' ?
I tried all the variations I could think of, including:
$('input.required:text', 'input.required:select')
but that, and every other variation, throws an error.
What's the syntax for specifying various types of required inputs?
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Kean
Sent: Monday, December 22, 2008 8:26 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
try this, it accounts for checking all the required fields to see if
they are blank and disable
jQuery(function(){
// all the required text fields
var $required = $('input.required:text');
// function checks for blank input
var isBlank = function(str) {
return $.trim(str).length==0
}
// function checks if other required fields are blank
var checkAllRequired = function () {
var allFilled = true;
$required.each(function() {
if (isBlank(this.value))
allFilled = false;
});
return allFilled;
}
// initially disable or enable the submit button
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
// same as $required each blur
$required.blur(function() {
// checks if current field is blank
if (isBlank(this.value))
$(# + this.id + _error).fadeIn(500);
else
$(# + this.id + _error).fadeOut(500);
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
});
});
On Dec 22, 3:54 pm, Rick Faircloth r...@whitestonemedia.com wrote:
Ok...after a lot of experimentation, I've got a solution
that's working to the point that I've attempted to implement it.
Here's the code:
$(document).ready(function() {
$('input:text.required').each(function() {
$(this).blur(function() {
var val = (this.value.length);
if (val == 0)
{ $(# + this.id + _error).fadeIn(500);
$('#submit').attr('disabled', 'disabled'); }
else
{ $(# + this.id + _error).fadeOut(500);
$('#submit').removeAttr('disabled'); };
$('input:text.required').each(function() {
var val = (this.value.length);
if (val == 0)
{ $('#submit').attr('disabled', 'disabled'); }
});
});
});
});
This code allows for the following:
- on blur of any text input with class 'required' the length is checked
- if the length of the required field is 0, then the error message is
shown
and the submit button for the form is disabled
- the second half of the code checks all the text inputs with class
'required'
- if the length of any of the required text fields is 0, then the submit
button is disabled
What I need to do now:
- Allow for other type of inputs to be checked on blur, etc., such as
selects
(Later, I'll add other types of validation, such as numeric, etc.)
Question:
- How do I modify ('input:text.required') to accommodate other types of
required inputs?
- I tried ('input:text.required, input:select.required') and
('input:text.required', 'input:select.required') but that didn't
work
Clues or hints?
Thanks,
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of MorningZ
Sent: Monday, December 22, 2008 2:40 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
Try this change
$(#submit).attr('disabled', (val == ) ? disabled : null);
If that doesn't work, then perhaps:
if (val == ) {
$(# + this.id + _error).fadeIn(500);
$(#submit).attr(disabled, disabled);
}
else {
$(# + this.id + _error).fadeOut(500);
$(#submit).removeAttr(disabled);
}
On Dec 22, 2:21 pm, Rick Faircloth r...@whitestonemedia.com wrote:
I see in your example code that you're still using a hard-coded name
for the input. I'd like it completely generalized for all variables.
I'm working towards creating code for categories of input types: text,
radio, checkbox
[jQuery] Re: How can I generalize this code for all values?
D'oh! I can't believe it was that simple!
And I read everything I could find, including the docs on selectors.
(Should have read it twice, I guess...)
Anyway, question, Karl, et al...
How can I validate a select input?
I've tried setting the default select value to
which I thought would be equivalent to value.length == 0,
but nothing's happening with the error message.
Others are working fine.
Suggestions?
Thanks,
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Karl Rudd
Sent: Monday, December 22, 2008 10:43 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: How can I generalize this code for all values?
From http://docs.jquery.com/Selectors (Forms section):
:input
Matches all input, textarea, select and button elements.
To select all Form elements with a required class:
$(':input.required')
Karl Rudd
On Tue, Dec 23, 2008 at 2:39 PM, Rick Faircloth
r...@whitestonemedia.com wrote:
How can this:
// all the required text fields
var $required = $('input.required:text');
be expanded to include 'input.required:select' ?
I tried all the variations I could think of, including:
$('input.required:text', 'input.required:select')
but that, and every other variation, throws an error.
What's the syntax for specifying various types of required inputs?
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Kean
Sent: Monday, December 22, 2008 8:26 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
try this, it accounts for checking all the required fields to see if
they are blank and disable
jQuery(function(){
// all the required text fields
var $required = $('input.required:text');
// function checks for blank input
var isBlank = function(str) {
return $.trim(str).length==0
}
// function checks if other required fields are blank
var checkAllRequired = function () {
var allFilled = true;
$required.each(function() {
if (isBlank(this.value))
allFilled = false;
});
return allFilled;
}
// initially disable or enable the submit button
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
// same as $required each blur
$required.blur(function() {
// checks if current field is blank
if (isBlank(this.value))
$(# + this.id + _error).fadeIn(500);
else
$(# + this.id + _error).fadeOut(500);
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
});
});
On Dec 22, 3:54 pm, Rick Faircloth r...@whitestonemedia.com wrote:
Ok...after a lot of experimentation, I've got a solution
that's working to the point that I've attempted to implement it.
Here's the code:
$(document).ready(function() {
$('input:text.required').each(function() {
$(this).blur(function() {
var val = (this.value.length);
if (val == 0)
{ $(# + this.id + _error).fadeIn(500);
$('#submit').attr('disabled', 'disabled'); }
else
{ $(# + this.id + _error).fadeOut(500);
$('#submit').removeAttr('disabled'); };
$('input:text.required').each(function() {
var val = (this.value.length);
if (val == 0)
{ $('#submit').attr('disabled', 'disabled'); }
});
});
});
});
This code allows for the following:
- on blur of any text input with class 'required' the length is checked
- if the length of the required field is 0, then the error message is
shown
and the submit button for the form is disabled
- the second half of the code checks all the text inputs with class
'required'
- if the length of any of the required text fields is 0, then the submit
button is disabled
What I need to do now:
- Allow for other type of inputs to be checked on blur, etc., such as
selects
(Later, I'll add other types of validation, such as numeric, etc.)
Question:
- How do I modify ('input:text.required') to accommodate other types of
required inputs?
- I tried ('input:text.required, input:select.required') and
('input:text.required', 'input:select.required') but that
didn't work
Clues or hints?
Thanks,
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery
[jQuery] Re: How can I generalize this code for all values?
Not quite sure what you're asking. Why would you try to set the
select's value? The select gets it's value from the selected child
option.
My advice would be to use the Jorn's plugin (
http://docs.jquery.com/Plugins/Validation ). From what I can see it
seems to do validation on blur by default.
Karl Rudd
On Tue, Dec 23, 2008 at 2:54 PM, Rick Faircloth
r...@whitestonemedia.com wrote:
D'oh! I can't believe it was that simple!
And I read everything I could find, including the docs on selectors.
(Should have read it twice, I guess...)
Anyway, question, Karl, et al...
How can I validate a select input?
I've tried setting the default select value to
which I thought would be equivalent to value.length == 0,
but nothing's happening with the error message.
Others are working fine.
Suggestions?
Thanks,
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Karl Rudd
Sent: Monday, December 22, 2008 10:43 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: How can I generalize this code for all values?
From http://docs.jquery.com/Selectors (Forms section):
:input
Matches all input, textarea, select and button elements.
To select all Form elements with a required class:
$(':input.required')
Karl Rudd
On Tue, Dec 23, 2008 at 2:39 PM, Rick Faircloth
r...@whitestonemedia.com wrote:
How can this:
// all the required text fields
var $required = $('input.required:text');
be expanded to include 'input.required:select' ?
I tried all the variations I could think of, including:
$('input.required:text', 'input.required:select')
but that, and every other variation, throws an error.
What's the syntax for specifying various types of required inputs?
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Kean
Sent: Monday, December 22, 2008 8:26 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
try this, it accounts for checking all the required fields to see if
they are blank and disable
jQuery(function(){
// all the required text fields
var $required = $('input.required:text');
// function checks for blank input
var isBlank = function(str) {
return $.trim(str).length==0
}
// function checks if other required fields are blank
var checkAllRequired = function () {
var allFilled = true;
$required.each(function() {
if (isBlank(this.value))
allFilled = false;
});
return allFilled;
}
// initially disable or enable the submit button
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
// same as $required each blur
$required.blur(function() {
// checks if current field is blank
if (isBlank(this.value))
$(# + this.id + _error).fadeIn(500);
else
$(# + this.id + _error).fadeOut(500);
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
});
});
On Dec 22, 3:54 pm, Rick Faircloth r...@whitestonemedia.com wrote:
Ok...after a lot of experimentation, I've got a solution
that's working to the point that I've attempted to implement it.
Here's the code:
$(document).ready(function() {
$('input:text.required').each(function() {
$(this).blur(function() {
var val = (this.value.length);
if (val == 0)
{ $(# + this.id + _error).fadeIn(500);
$('#submit').attr('disabled', 'disabled'); }
else
{ $(# + this.id + _error).fadeOut(500);
$('#submit').removeAttr('disabled'); };
$('input:text.required').each(function() {
var val = (this.value.length);
if (val == 0)
{ $('#submit').attr('disabled', 'disabled'); }
});
});
});
});
This code allows for the following:
- on blur of any text input with class 'required' the length is checked
- if the length of the required field is 0, then the error message is
shown
and the submit button for the form is disabled
- the second half of the code checks all the text inputs with class
'required'
- if the length of any of the required text fields is 0, then the
submit button is disabled
What I need to do now:
- Allow for other type of inputs to be checked on blur, etc., such as
selects
(Later, I'll add other types of validation, such as numeric, etc
[jQuery] Re: How can I generalize this code for all values?
The select gets it's value from the selected child option.
Perhaps that's why I can't get validation to work!
My advice would be to use the Jorn's plugin
Believe me, I've tried.
I worked with it every way I could think of to disable
the default onSubmit event and cause validation only
onblur, but I couldn't make it work.
I haven't heard anything from Jorn, but if you or anyone
knows how to make the validation occur only onblur, please
let me know.
I don't need or want onSubmit at all...I have server-side
validation that will take care of it once it's submitted.
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Karl Rudd
Sent: Monday, December 22, 2008 11:37 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: How can I generalize this code for all values?
Not quite sure what you're asking. Why would you try to set the
select's value? The select gets it's value from the selected child
option.
My advice would be to use the Jorn's plugin (
http://docs.jquery.com/Plugins/Validation ). From what I can see it
seems to do validation on blur by default.
Karl Rudd
On Tue, Dec 23, 2008 at 2:54 PM, Rick Faircloth
r...@whitestonemedia.com wrote:
D'oh! I can't believe it was that simple!
And I read everything I could find, including the docs on selectors.
(Should have read it twice, I guess...)
Anyway, question, Karl, et al...
How can I validate a select input?
I've tried setting the default select value to
which I thought would be equivalent to value.length == 0,
but nothing's happening with the error message.
Others are working fine.
Suggestions?
Thanks,
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Karl Rudd
Sent: Monday, December 22, 2008 10:43 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: How can I generalize this code for all values?
From http://docs.jquery.com/Selectors (Forms section):
:input
Matches all input, textarea, select and button elements.
To select all Form elements with a required class:
$(':input.required')
Karl Rudd
On Tue, Dec 23, 2008 at 2:39 PM, Rick Faircloth
r...@whitestonemedia.com wrote:
How can this:
// all the required text fields
var $required = $('input.required:text');
be expanded to include 'input.required:select' ?
I tried all the variations I could think of, including:
$('input.required:text', 'input.required:select')
but that, and every other variation, throws an error.
What's the syntax for specifying various types of required inputs?
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Kean
Sent: Monday, December 22, 2008 8:26 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
try this, it accounts for checking all the required fields to see if
they are blank and disable
jQuery(function(){
// all the required text fields
var $required = $('input.required:text');
// function checks for blank input
var isBlank = function(str) {
return $.trim(str).length==0
}
// function checks if other required fields are blank
var checkAllRequired = function () {
var allFilled = true;
$required.each(function() {
if (isBlank(this.value))
allFilled = false;
});
return allFilled;
}
// initially disable or enable the submit button
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
// same as $required each blur
$required.blur(function() {
// checks if current field is blank
if (isBlank(this.value))
$(# + this.id + _error).fadeIn(500);
else
$(# + this.id + _error).fadeOut(500);
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
});
});
On Dec 22, 3:54 pm, Rick Faircloth r...@whitestonemedia.com wrote:
Ok...after a lot of experimentation, I've got a solution
that's working to the point that I've attempted to implement it.
Here's the code:
$(document).ready(function() {
$('input:text.required').each(function() {
$(this).blur(function() {
var val = (this.value.length);
if (val == 0)
{ $(# + this.id + _error).fadeIn(500);
$('#submit').attr('disabled', 'disabled');
}
else
[jQuery] Re: How can I generalize this code for all values?
Have a look at the validate method (
http://docs.jquery.com/Plugins/Validation/validate )
According to the documentation to suppress validation on submission
all you need to do is:
$('form').validate({
onsubmit: false
});
Note: I've never used the plugin before, so this is all untested.
Karl Rudd
On Tue, Dec 23, 2008 at 3:45 PM, Rick Faircloth
r...@whitestonemedia.com wrote:
The select gets it's value from the selected child option.
Perhaps that's why I can't get validation to work!
My advice would be to use the Jorn's plugin
Believe me, I've tried.
I worked with it every way I could think of to disable
the default onSubmit event and cause validation only
onblur, but I couldn't make it work.
I haven't heard anything from Jorn, but if you or anyone
knows how to make the validation occur only onblur, please
let me know.
I don't need or want onSubmit at all...I have server-side
validation that will take care of it once it's submitted.
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Karl Rudd
Sent: Monday, December 22, 2008 11:37 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: How can I generalize this code for all values?
Not quite sure what you're asking. Why would you try to set the
select's value? The select gets it's value from the selected child
option.
My advice would be to use the Jorn's plugin (
http://docs.jquery.com/Plugins/Validation ). From what I can see it
seems to do validation on blur by default.
Karl Rudd
On Tue, Dec 23, 2008 at 2:54 PM, Rick Faircloth
r...@whitestonemedia.com wrote:
D'oh! I can't believe it was that simple!
And I read everything I could find, including the docs on selectors.
(Should have read it twice, I guess...)
Anyway, question, Karl, et al...
How can I validate a select input?
I've tried setting the default select value to
which I thought would be equivalent to value.length == 0,
but nothing's happening with the error message.
Others are working fine.
Suggestions?
Thanks,
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Karl Rudd
Sent: Monday, December 22, 2008 10:43 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: How can I generalize this code for all values?
From http://docs.jquery.com/Selectors (Forms section):
:input
Matches all input, textarea, select and button elements.
To select all Form elements with a required class:
$(':input.required')
Karl Rudd
On Tue, Dec 23, 2008 at 2:39 PM, Rick Faircloth
r...@whitestonemedia.com wrote:
How can this:
// all the required text fields
var $required = $('input.required:text');
be expanded to include 'input.required:select' ?
I tried all the variations I could think of, including:
$('input.required:text', 'input.required:select')
but that, and every other variation, throws an error.
What's the syntax for specifying various types of required inputs?
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com]
On Behalf Of Kean
Sent: Monday, December 22, 2008 8:26 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
try this, it accounts for checking all the required fields to see if
they are blank and disable
jQuery(function(){
// all the required text fields
var $required = $('input.required:text');
// function checks for blank input
var isBlank = function(str) {
return $.trim(str).length==0
}
// function checks if other required fields are blank
var checkAllRequired = function () {
var allFilled = true;
$required.each(function() {
if (isBlank(this.value))
allFilled = false;
});
return allFilled;
}
// initially disable or enable the submit button
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
// same as $required each blur
$required.blur(function() {
// checks if current field is blank
if (isBlank(this.value))
$(# + this.id + _error).fadeIn(500);
else
$(# + this.id + _error).fadeOut(500);
$(#submit).attr('disabled', checkAllRequired() ? null :
disabled);
});
});
On Dec 22, 3:54 pm, Rick Faircloth r...@whitestonemedia.com wrote:
Ok...after a lot of experimentation, I've got a solution
that's working to the point that I've attempted to implement it.
Here's the code:
$(document).ready(function
[jQuery] Re: How can I generalize this code for all values?
Yeah, I've read that a dozen times...
Here's what I've got that I can't make work:
script type=text/javascript
$(document).ready(function() {
$('#add-rental-property-form').validate({
errorPlacement: function(error, element) {
error.appendTo('#'+element.attr('id')+'_error');
},
rules: { street_number: required,
street_name: required,
city: required
},
messages: { street_number: Please enter the property street
number.,
street_name: Please enter the street name.,
city: Please enter the city.
},
onsubmit: false
});
});
/script
and I've tried putting onsubmit first in the options, I've tried it with
quotation marks around
false, I've tried it with brackets...every way I could think of...just can't
get it to work.
Maybe Jorn will read this and offer some suggestions...
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Karl Rudd
Sent: Monday, December 22, 2008 11:59 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: How can I generalize this code for all values?
Have a look at the validate method (
http://docs.jquery.com/Plugins/Validation/validate )
According to the documentation to suppress validation on submission
all you need to do is:
$('form').validate({
onsubmit: false
});
Note: I've never used the plugin before, so this is all untested.
Karl Rudd
On Tue, Dec 23, 2008 at 3:45 PM, Rick Faircloth
r...@whitestonemedia.com wrote:
The select gets it's value from the selected child option.
Perhaps that's why I can't get validation to work!
My advice would be to use the Jorn's plugin
Believe me, I've tried.
I worked with it every way I could think of to disable
the default onSubmit event and cause validation only
onblur, but I couldn't make it work.
I haven't heard anything from Jorn, but if you or anyone
knows how to make the validation occur only onblur, please
let me know.
I don't need or want onSubmit at all...I have server-side
validation that will take care of it once it's submitted.
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Karl Rudd
Sent: Monday, December 22, 2008 11:37 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: How can I generalize this code for all values?
Not quite sure what you're asking. Why would you try to set the
select's value? The select gets it's value from the selected child
option.
My advice would be to use the Jorn's plugin (
http://docs.jquery.com/Plugins/Validation ). From what I can see it
seems to do validation on blur by default.
Karl Rudd
On Tue, Dec 23, 2008 at 2:54 PM, Rick Faircloth
r...@whitestonemedia.com wrote:
D'oh! I can't believe it was that simple!
And I read everything I could find, including the docs on selectors.
(Should have read it twice, I guess...)
Anyway, question, Karl, et al...
How can I validate a select input?
I've tried setting the default select value to
which I thought would be equivalent to value.length == 0,
but nothing's happening with the error message.
Others are working fine.
Suggestions?
Thanks,
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of Karl Rudd
Sent: Monday, December 22, 2008 10:43 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: How can I generalize this code for all values?
From http://docs.jquery.com/Selectors (Forms section):
:input
Matches all input, textarea, select and button elements.
To select all Form elements with a required class:
$(':input.required')
Karl Rudd
On Tue, Dec 23, 2008 at 2:39 PM, Rick Faircloth
r...@whitestonemedia.com wrote:
How can this:
// all the required text fields
var $required = $('input.required:text');
be expanded to include 'input.required:select' ?
I tried all the variations I could think of, including:
$('input.required:text', 'input.required:select')
but that, and every other variation, throws an error.
What's the syntax for specifying various types of required inputs?
Rick
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com]
On Behalf Of Kean
Sent: Monday, December 22, 2008 8:26 PM
To: jQuery (English)
Subject: [jQuery] Re: How can I generalize this code for all values?
try this, it accounts for checking
