How to retrieve a value from <input> using jQuery?

Question

I have to hidden input fields such as:

<input name="foo" value="bar">
<input name="foo1" value="bar1">

I'd like to retrieve both of those values and POST them to the server using jQuery. How does one use the jQuery selector engine to grab those values?

ybo · Accepted Answer · 2009-03-24 17:40:21Z

28

As "foo" and "foo1" are the name of you input fields, you will not be able to use the id selector of jQuery (#), but you'll have to use instead the attribute selector :

var foo = $("[name='foo']").val();
var foo1 = $("[name='foo1']").val();

That's not the best option, performance-wise. You'd better set the id of your input fields and use the id selector (e.g. $("#foo")) or at least provide a context to the attribute selector:

var form = $("#myForm"); // or $("form"), or any selector matching an element containing your input fields
var foo = $("[name='foo']", form).val();
var foo1 = $("[name='foo1']", form).val();

answered Mar 24, 2009 at 17:40

ybo

17.2k2 gold badges30 silver badges31 bronze badges

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

3 Comments

Andrew Hedges Over a year ago

They may not perform as well as $('#foo'), but unless it's a problem, don't worry about it. Premature optimization and all that.

ybo Over a year ago

@Andrew, you're completely right, users wouldn't see the difference in most cases. It's more a best practice, especially considering that the name might not be unique.

h7r Over a year ago

Alternatively you may access directly the field's value like in var v = $("#form [name='foo']").val ()

Bogdan Constantinescu · Accepted Answer · 2009-03-24 17:39:34Z

5

You should use id's or classes to speed up getting the value process.

ID version (assuming the input has id='foo')

var value1 = $('#foo').val();

Classes version (assuming the input has class='foo')

var value1 = $('.foo').val();

answered Mar 24, 2009 at 17:39

Bogdan Constantinescu

5,3864 gold badges42 silver badges51 bronze badges

Collectives™ on Stack Overflow

How to retrieve a value from <input> using jQuery?

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related