jQuery selector for selecting an input field with a class

Question

I have

<input type="text" class="required" value="XXX" name="abc">
<input type="hidden" class="required" value="XXX" name="abcd">
<input type="text" class="required" value="XXX" name="abcef">

i have many input fields like this.

i need a jQuery selector where i can select a text field whose class is required

right now to select textfield i use $(':input[type="text"]')

how do i also put a condition to select class="required."

EDIT

so say now i have the following input fields

<div id="validate_info">
<input type="text" class="required" value="XXX" name="abc">
<input type="hidden" class="required" value="XXX" name="abcd">
<input type="text" class="required" value="XXX" name="abcef">
<input type="password" class="required" value="XXX" name="abcefg">
<input type="text"  value="XXX" name="abcefgsa">
<input type="password" value="XXX" name="abcsaefg">
</div>

i need one selector that can select all type="text", type="password" which has class="required" i tried

$('#validate_info $("input.required").filter("[type="password"],[type="text"]")');

but this doesnt seem to work.

$("input.required").filter("[type="password"],[type="text"]") is not a selector string. It should be $("#validate_info input.required").filter("[type='password'],[type='text']") or $("input.required", "#validate_info").filter("[type='password'],[type='"text']"). Also, make sure you use the right quotes inside quotes. — gen_Eric
– gen_Eric, Commented Aug 8, 2011 at 18:18

gen_Eric · Accepted Answer · 2011-08-08 16:54:24Z

14

$(':input.required[type="text"]')

EDIT:

This will be slightly faster:

$('input.required[type="text"]')

Note:

:input will get all form elements (<select>, <textarea>, etc.)

input will only get <input> elements, and is slightly faster.

edited Aug 8, 2011 at 16:54

answered Aug 8, 2011 at 16:03

gen_Eric

228k42 gold badges304 silver badges343 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Mrchief Over a year ago

+1 - This is probably the fastest selector of all the answers.

Felix Kling Over a year ago

Better if you use input instead of :input. Then jQuery can use browser methods.

Kishore Over a year ago

now if i have another field of type password and i also need a selector for that how do i do that?

gen_Eric Over a year ago

@Kishore: $(':input.required[type="password"]'), or whatever combination of selectors you want.

Felix Kling Over a year ago

@Kishore: You have to use the multiple selector then: $('input.required[type="password"], input.required[type="password"]') or filter: $('input.required').filter('[type="password"],[type="password"]')

|

MikeM · Accepted Answer · 2011-08-08 16:02:46Z

8

$('.required:input[type="text"]')

(also $('input.required[type="text"]'))

answered Aug 8, 2011 at 16:02

MikeM

27.5k4 gold badges67 silver badges80 bronze badges

Comments

Community · Accepted Answer · 2020-06-20 09:12:55Z

7

$(':input[type="text"][class="required"]')

That should work

http://jsfiddle.net/ck8wt/

Edit

lol ... I couldn't see the forest through the trees. :P I'll leave mine up too though just as an illustration of how many ways this can be done. XD

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Aug 8, 2011 at 16:02

Joseph Marikle

78.8k18 gold badges114 silver badges130 bronze badges

Comments

Kyle · Accepted Answer · 2011-08-08 16:02:55Z

4

If you just add the class to your selector, it should do what you are looking for.

$('.required:input[type="text"]')

answered Aug 8, 2011 at 16:02

Kyle

4,46124 silver badges33 bronze badges

Collectives™ on Stack Overflow

jQuery selector for selecting an input field with a class

4 Answers 4

8 Comments

Comments

Edit

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

8 Comments

Comments

Edit

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related