[jQuery] Re: Add Class to all form elements
The :input selector in ':input,:radio,:checkbox' selects all inputs,
selects, textarea's and buttons, the last two selectors are redundant.
The selector in my last example only selects text inputs, radios and
checkboxes, so it will exclude the submit. Swap it for Gustavo's:
$('form').find(':text,:radio,:checkbox').addClass('class');
Also just an FYI, the above is essentially the same as this:
$(':text,:checkbox,:radio',$('form')).addClass('class');
The former is faster in general.
If you did want to capture all form elements (including textareas,
selects, buttons) but just not the submit, you can do this:
$('form').find(':input:not(:submit)').addClass('class');
On Jun 17, 11:56 pm, Loony2nz wrote:
> The easiest implementation was Gustavo's.
>
> however, how do i exlcude the submit button?
>
> I guess i can go back and do a single call to remove the class after
> the fact.
>
> On Jun 17, 11:47 pm, Loony2nz wrote:
>
>
>
> > Hi all,
>
> > Just for clarification, there is only one form on the page at any one
> > time.
>
> > Thank you all for you thoughts. I'm going to try them tonite.
>
> > On Jun 2, 9:40 am, mkmanning wrote:
>
> > > "if you have inputs that are not within forms"
> > > That should never happen if you're using valid markup ;)
>
> > > Although the OP gave no indication there'd be other forms on the page,
> > > if you want to target a specific form just use the context:
>
> > > $(':text,:checkbox,:radio',$('SPECIFIC_FORM')).addClass
> > > ('YOUR_CLASSNAME');
>
> > > Although it's not clear from the OP's text that he wants the classes
> > > added for styling, that's a reasonable assumption. You're assigning a
> > > class whose name is set using the value of "i" ("myflied_"+i), so
> > > given that the OP said there could be "anywhere from 5 to 10 to 20 to
> > > 50 fields", it would be extremely difficult to use those classes for
> > > styling purposes.
>
> > > Even if the class is to be used only for targeting the form elements
> > > later with script, you'd have to use a ^= filter on the class name
> > > since you could have classnames ranging from "myfield_0" to
> > > "myfield_50". In short, there's not much to gain by adding the number
> > > to the end of the class.
>
> > > On Jun 2, 9:07 am, waseem sabjee wrote:
>
> > > > Yes but he only wants to add class to forms. myway is loop through all
> > > > forms. or all forms with a specific class. then for each form loop
> > > > through
> > > > all inputs. this way is better only if you want certain forms not to
> > > > have
> > > > the class name or if you have inputs that are not within forms.
>
> > > > On Tue, Jun 2, 2009 at 3:07 AM, mkmanning wrote:
>
> > > > > Or you could just do this:
>
> > > > > $(':input,:checkbox,:radio').addClass('YOUR_CLASSNAME');
>
> > > > > On Jun 1, 10:24 am, waseem sabjee wrote:
> > > > > >
> > > > > > $(function() {
>
> > > > > > var myforms = $("form");
>
> > > > > > myforms.each(function(i) {
>
> > > > > > var myform = myforms.eq(i);
>
> > > > > > var myfields = $("input", myform);
>
> > > > > > myfields.each(function(i) {
>
> > > > > > var myfield = myfields.eq(i);
>
> > > > > > myfield.addClass("myflied_"+i);
>
> > > > > > });
> > > > > > });
> > > > > > });
>
> > > > > >
>
> > > > > > On Mon, Jun 1, 2009 at 7:19 PM, Loony2nz wrote:
>
> > > > > > > Hey everyone,
>
> > > > > > > I need help with a jquery task.
>
> > > > > > > I have a form that has it's HTML inserted into the database (yeah
> > > > > > > yeah
> > > > > > > I know..not my idea..I'm new here and just finding this out).
>
> > > > > > > Anyway, each form field has an embedded class in the HTML.
>
> > > > > > > The form is dynamically generated. Can be anywhere from 5 to 10
> > > > > > > to 20
> > > > > > > to 50 fields.
>
> > > > > > > How can I loop over each form field and add a new class to the
> > > > > > > field
> > > > > > > (either input or radio or checkbox)?
>
> > > > > > > Thoughts?
>
> > > > > > > Thanks!
[jQuery] Re: Add Class to all form elements
The easiest implementation was Gustavo's.
however, how do i exlcude the submit button?
I guess i can go back and do a single call to remove the class after
the fact.
On Jun 17, 11:47 pm, Loony2nz wrote:
> Hi all,
>
> Just for clarification, there is only one form on the page at any one
> time.
>
> Thank you all for you thoughts. I'm going to try them tonite.
>
> On Jun 2, 9:40 am, mkmanning wrote:
>
> > "if you have inputs that are not within forms"
> > That should never happen if you're using valid markup ;)
>
> > Although the OP gave no indication there'd be other forms on the page,
> > if you want to target a specific form just use the context:
>
> > $(':text,:checkbox,:radio',$('SPECIFIC_FORM')).addClass
> > ('YOUR_CLASSNAME');
>
> > Although it's not clear from the OP's text that he wants the classes
> > added for styling, that's a reasonable assumption. You're assigning a
> > class whose name is set using the value of "i" ("myflied_"+i), so
> > given that the OP said there could be "anywhere from 5 to 10 to 20 to
> > 50 fields", it would be extremely difficult to use those classes for
> > styling purposes.
>
> > Even if the class is to be used only for targeting the form elements
> > later with script, you'd have to use a ^= filter on the class name
> > since you could have classnames ranging from "myfield_0" to
> > "myfield_50". In short, there's not much to gain by adding the number
> > to the end of the class.
>
> > On Jun 2, 9:07 am, waseem sabjee wrote:
>
> > > Yes but he only wants to add class to forms. myway is loop through all
> > > forms. or all forms with a specific class. then for each form loop through
> > > all inputs. this way is better only if you want certain forms not to have
> > > the class name or if you have inputs that are not within forms.
>
> > > On Tue, Jun 2, 2009 at 3:07 AM, mkmanning wrote:
>
> > > > Or you could just do this:
>
> > > > $(':input,:checkbox,:radio').addClass('YOUR_CLASSNAME');
>
> > > > On Jun 1, 10:24 am, waseem sabjee wrote:
> > > > >
> > > > > $(function() {
>
> > > > > var myforms = $("form");
>
> > > > > myforms.each(function(i) {
>
> > > > > var myform = myforms.eq(i);
>
> > > > > var myfields = $("input", myform);
>
> > > > > myfields.each(function(i) {
>
> > > > > var myfield = myfields.eq(i);
>
> > > > > myfield.addClass("myflied_"+i);
>
> > > > > });
> > > > > });
> > > > > });
>
> > > > >
>
> > > > > On Mon, Jun 1, 2009 at 7:19 PM, Loony2nz wrote:
>
> > > > > > Hey everyone,
>
> > > > > > I need help with a jquery task.
>
> > > > > > I have a form that has it's HTML inserted into the database (yeah
> > > > > > yeah
> > > > > > I know..not my idea..I'm new here and just finding this out).
>
> > > > > > Anyway, each form field has an embedded class in the HTML.
>
> > > > > > The form is dynamically generated. Can be anywhere from 5 to 10 to
> > > > > > 20
> > > > > > to 50 fields.
>
> > > > > > How can I loop over each form field and add a new class to the field
> > > > > > (either input or radio or checkbox)?
>
> > > > > > Thoughts?
>
> > > > > > Thanks!
[jQuery] Re: Add Class to all form elements
Hi all,
Just for clarification, there is only one form on the page at any one
time.
Thank you all for you thoughts. I'm going to try them tonite.
On Jun 2, 9:40 am, mkmanning wrote:
> "if you have inputs that are not within forms"
> That should never happen if you're using valid markup ;)
>
> Although the OP gave no indication there'd be other forms on the page,
> if you want to target a specific form just use the context:
>
> $(':text,:checkbox,:radio',$('SPECIFIC_FORM')).addClass
> ('YOUR_CLASSNAME');
>
> Although it's not clear from the OP's text that he wants the classes
> added for styling, that's a reasonable assumption. You're assigning a
> class whose name is set using the value of "i" ("myflied_"+i), so
> given that the OP said there could be "anywhere from 5 to 10 to 20 to
> 50 fields", it would be extremely difficult to use those classes for
> styling purposes.
>
> Even if the class is to be used only for targeting the form elements
> later with script, you'd have to use a ^= filter on the class name
> since you could have classnames ranging from "myfield_0" to
> "myfield_50". In short, there's not much to gain by adding the number
> to the end of the class.
>
> On Jun 2, 9:07 am, waseem sabjee wrote:
>
>
>
> > Yes but he only wants to add class to forms. myway is loop through all
> > forms. or all forms with a specific class. then for each form loop through
> > all inputs. this way is better only if you want certain forms not to have
> > the class name or if you have inputs that are not within forms.
>
> > On Tue, Jun 2, 2009 at 3:07 AM, mkmanning wrote:
>
> > > Or you could just do this:
>
> > > $(':input,:checkbox,:radio').addClass('YOUR_CLASSNAME');
>
> > > On Jun 1, 10:24 am, waseem sabjee wrote:
> > > >
> > > > $(function() {
>
> > > > var myforms = $("form");
>
> > > > myforms.each(function(i) {
>
> > > > var myform = myforms.eq(i);
>
> > > > var myfields = $("input", myform);
>
> > > > myfields.each(function(i) {
>
> > > > var myfield = myfields.eq(i);
>
> > > > myfield.addClass("myflied_"+i);
>
> > > > });
> > > > });
> > > > });
>
> > > >
>
> > > > On Mon, Jun 1, 2009 at 7:19 PM, Loony2nz wrote:
>
> > > > > Hey everyone,
>
> > > > > I need help with a jquery task.
>
> > > > > I have a form that has it's HTML inserted into the database (yeah yeah
> > > > > I know..not my idea..I'm new here and just finding this out).
>
> > > > > Anyway, each form field has an embedded class in the HTML.
>
> > > > > The form is dynamically generated. Can be anywhere from 5 to 10 to 20
> > > > > to 50 fields.
>
> > > > > How can I loop over each form field and add a new class to the field
> > > > > (either input or radio or checkbox)?
>
> > > > > Thoughts?
>
> > > > > Thanks!
[jQuery] Re: Add Class to all form elements
"if you have inputs that are not within forms"
That should never happen if you're using valid markup ;)
Although the OP gave no indication there'd be other forms on the page,
if you want to target a specific form just use the context:
$(':text,:checkbox,:radio',$('SPECIFIC_FORM')).addClass
('YOUR_CLASSNAME');
Although it's not clear from the OP's text that he wants the classes
added for styling, that's a reasonable assumption. You're assigning a
class whose name is set using the value of "i" ("myflied_"+i), so
given that the OP said there could be "anywhere from 5 to 10 to 20 to
50 fields", it would be extremely difficult to use those classes for
styling purposes.
Even if the class is to be used only for targeting the form elements
later with script, you'd have to use a ^= filter on the class name
since you could have classnames ranging from "myfield_0" to
"myfield_50". In short, there's not much to gain by adding the number
to the end of the class.
On Jun 2, 9:07 am, waseem sabjee wrote:
> Yes but he only wants to add class to forms. myway is loop through all
> forms. or all forms with a specific class. then for each form loop through
> all inputs. this way is better only if you want certain forms not to have
> the class name or if you have inputs that are not within forms.
>
> On Tue, Jun 2, 2009 at 3:07 AM, mkmanning wrote:
>
> > Or you could just do this:
>
> > $(':input,:checkbox,:radio').addClass('YOUR_CLASSNAME');
>
> > On Jun 1, 10:24 am, waseem sabjee wrote:
> > >
> > > $(function() {
>
> > > var myforms = $("form");
>
> > > myforms.each(function(i) {
>
> > > var myform = myforms.eq(i);
>
> > > var myfields = $("input", myform);
>
> > > myfields.each(function(i) {
>
> > > var myfield = myfields.eq(i);
>
> > > myfield.addClass("myflied_"+i);
>
> > > });
> > > });
> > > });
>
> > >
>
> > > On Mon, Jun 1, 2009 at 7:19 PM, Loony2nz wrote:
>
> > > > Hey everyone,
>
> > > > I need help with a jquery task.
>
> > > > I have a form that has it's HTML inserted into the database (yeah yeah
> > > > I know..not my idea..I'm new here and just finding this out).
>
> > > > Anyway, each form field has an embedded class in the HTML.
>
> > > > The form is dynamically generated. Can be anywhere from 5 to 10 to 20
> > > > to 50 fields.
>
> > > > How can I loop over each form field and add a new class to the field
> > > > (either input or radio or checkbox)?
>
> > > > Thoughts?
>
> > > > Thanks!
[jQuery] Re: Add Class to all form elements
Try it:
$('form').find(':input,:radio,:checkbox').addClass('class');
2009/6/2 waseem sabjee
> Yes but he only wants to add class to forms. myway is loop through all
> forms. or all forms with a specific class. then for each form loop through
> all inputs. this way is better only if you want certain forms not to have
> the class name or if you have inputs that are not within forms.
>
>
>
> On Tue, Jun 2, 2009 at 3:07 AM, mkmanning wrote:
>
>>
>> Or you could just do this:
>>
>> $(':input,:checkbox,:radio').addClass('YOUR_CLASSNAME');
>>
>>
>> On Jun 1, 10:24 am, waseem sabjee wrote:
>> >
>> > $(function() {
>> >
>> > var myforms = $("form");
>> >
>> > myforms.each(function(i) {
>> >
>> > var myform = myforms.eq(i);
>> >
>> > var myfields = $("input", myform);
>> >
>> > myfields.each(function(i) {
>> >
>> > var myfield = myfields.eq(i);
>> >
>> > myfield.addClass("myflied_"+i);
>> >
>> > });
>> > });
>> > });
>> >
>> >
>> >
>> > On Mon, Jun 1, 2009 at 7:19 PM, Loony2nz wrote:
>> >
>> > > Hey everyone,
>> >
>> > > I need help with a jquery task.
>> >
>> > > I have a form that has it's HTML inserted into the database (yeah yeah
>> > > I know..not my idea..I'm new here and just finding this out).
>> >
>> > > Anyway, each form field has an embedded class in the HTML.
>> >
>> > > The form is dynamically generated. Can be anywhere from 5 to 10 to 20
>> > > to 50 fields.
>> >
>> > > How can I loop over each form field and add a new class to the field
>> > > (either input or radio or checkbox)?
>> >
>> > > Thoughts?
>> >
>> > > Thanks!
>>
>
>
--
Gustavo Salome Silva
[jQuery] Re: Add Class to all form elements
Yes but he only wants to add class to forms. myway is loop through all
forms. or all forms with a specific class. then for each form loop through
all inputs. this way is better only if you want certain forms not to have
the class name or if you have inputs that are not within forms.
On Tue, Jun 2, 2009 at 3:07 AM, mkmanning wrote:
>
> Or you could just do this:
>
> $(':input,:checkbox,:radio').addClass('YOUR_CLASSNAME');
>
>
> On Jun 1, 10:24 am, waseem sabjee wrote:
> >
> > $(function() {
> >
> > var myforms = $("form");
> >
> > myforms.each(function(i) {
> >
> > var myform = myforms.eq(i);
> >
> > var myfields = $("input", myform);
> >
> > myfields.each(function(i) {
> >
> > var myfield = myfields.eq(i);
> >
> > myfield.addClass("myflied_"+i);
> >
> > });
> > });
> > });
> >
> >
> >
> > On Mon, Jun 1, 2009 at 7:19 PM, Loony2nz wrote:
> >
> > > Hey everyone,
> >
> > > I need help with a jquery task.
> >
> > > I have a form that has it's HTML inserted into the database (yeah yeah
> > > I know..not my idea..I'm new here and just finding this out).
> >
> > > Anyway, each form field has an embedded class in the HTML.
> >
> > > The form is dynamically generated. Can be anywhere from 5 to 10 to 20
> > > to 50 fields.
> >
> > > How can I loop over each form field and add a new class to the field
> > > (either input or radio or checkbox)?
> >
> > > Thoughts?
> >
> > > Thanks!
>
[jQuery] Re: Add Class to all form elements
Or you could just do this:
$(':input,:checkbox,:radio').addClass('YOUR_CLASSNAME');
On Jun 1, 10:24 am, waseem sabjee wrote:
>
> $(function() {
>
> var myforms = $("form");
>
> myforms.each(function(i) {
>
> var myform = myforms.eq(i);
>
> var myfields = $("input", myform);
>
> myfields.each(function(i) {
>
> var myfield = myfields.eq(i);
>
> myfield.addClass("myflied_"+i);
>
> });
> });
> });
>
>
>
> On Mon, Jun 1, 2009 at 7:19 PM, Loony2nz wrote:
>
> > Hey everyone,
>
> > I need help with a jquery task.
>
> > I have a form that has it's HTML inserted into the database (yeah yeah
> > I know..not my idea..I'm new here and just finding this out).
>
> > Anyway, each form field has an embedded class in the HTML.
>
> > The form is dynamically generated. Can be anywhere from 5 to 10 to 20
> > to 50 fields.
>
> > How can I loop over each form field and add a new class to the field
> > (either input or radio or checkbox)?
>
> > Thoughts?
>
> > Thanks!
[jQuery] Re: Add Class to all form elements
$(function() {
var myforms = $("form");
myforms.each(function(i) {
var myform = myforms.eq(i);
var myfields = $("input", myform);
myfields.each(function(i) {
var myfield = myfields.eq(i);
myfield.addClass("myflied_"+i);
});
});
});
On Mon, Jun 1, 2009 at 7:19 PM, Loony2nz wrote:
>
> Hey everyone,
>
> I need help with a jquery task.
>
> I have a form that has it's HTML inserted into the database (yeah yeah
> I know..not my idea..I'm new here and just finding this out).
>
> Anyway, each form field has an embedded class in the HTML.
>
> The form is dynamically generated. Can be anywhere from 5 to 10 to 20
> to 50 fields.
>
> How can I loop over each form field and add a new class to the field
> (either input or radio or checkbox)?
>
> Thoughts?
>
> Thanks!
>
