Obtain Form Input Fields Using Jquery

Obtain form input fields using jQuery?

$('#myForm').submit(function() {
    // get all the inputs into an array.
    var $inputs = $('#myForm :input');

    // not sure if you wanted this, but I thought I'd add it.
    // get an associative array of just the values.
    var values = {};
    $inputs.each(function() {
        values[this.name] = $(this).val();
    });

});

---

Thanks to the tip from Simon_Weaver, here is another way you could do it, using serializeArray:

var values = {};
$.each($('#myForm').serializeArray(), function(i, field) {
    values[field.name] = field.value;
});

Note that this snippet will fail on <select multiple> elements.

It appears that the new HTML 5 form inputs don't work with serializeArray in jQuery version 1.3. This works in version 1.4+

Jquery get form field value

You have to use value attribute to get its value

<input type="text" name="FirstName" value="First Name" />

try -

var text = $('#DynamicValueAssignedHere').find('input[name="FirstName"]').val();

How can I get form data with JavaScript/jQuery?

$('form').serialize() //this produces: "foo=1&bar=xxx&this=hi"

demo

How to get all input fields from a form in jQuery?

Object of all the inputs:-

$("form#formId :input").each(function(){
    var input = $(this); // A jquery object of the input
});

or

$('#formId').submit(function() {
    // get the array of all the inputs 
    var $inputs = $('#formId :input');

    // get an associative array of the values
    var values = {};
    $inputs.each(function() {
        values[this.name] = $(this).val();
    });
});

This one returns the Key:Value pair -

var values = {};
$.each($('#formId').serializeArray(), function(i, field) {
    values[field.name] = field.value;
});

How to get `form.field.value` in jQuery?

like this?

$('#submit').click(function(){
    if( $('#uName').val() == ''){
        alert('empty');
    }
});

http://jsfiddle.net/TTmYk/

the submit form has a typo in my fiddle u might need to fix that

How an I get all form elements (input, textarea & select) with jQuery?

Edit: As pointed out in comments (Mario Awad & Brock Hensley), use .find to get the children

$("form").each(function(){
    $(this).find(':input') //<-- Should return all input elements in that specific form.
});

forms also have an elements collection, sometimes this differs from children such as when the form tag is in a table and is not closed.

var summary = [];$('form').each(function () {    summary.push('Form ' + this.id + ' has ' + $(this).find(':input').length + ' child(ren).');    summary.push('Form ' + this.id + ' has ' + this.elements.length + ' form element(s).');});
$('#results').html(summary.join('<br />'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><form id="A" style="display: none;">    <input type="text" />    <button>Submit</button></form><form id="B" style="display: none;">    <select><option>A</option></select>    <button>Submit</button></form>
<table bgcolor="white" cellpadding="12" border="1" style="display: none;"><tr><td colspan="2"><center><h1><i><b>LoginArea</b></i></h1></center></td></tr><tr><td><h1><i><b>UserID:</b></i></h1></td><td><form id="login" name="login" method="post"><inputname="id" type="text"></td></tr><tr><td><h1><i><b>Password:</b></i></h1></td><td><input name="pass"type="password"></td></tr><tr><td><center><input type="button" value="Login"onClick="pasuser(this.form)"></center></td><td><center><br /><inputtype="Reset"></form></td></tr></table></center><div id="results"></div>

How to get the Specific Form Field value using JQuery

$("#post_comment").submit(function(event){
    var inputValue = $("input[name='type']",this).val(); 
});

How to get/set values to input fields using jQuery?

You need to use Attribute Selector

//Get
var bla = $('input[data-wpt-id="wpcf-latitude"]').val();

//Set
$('input[data-wpt-id="wpcf-latitude"]').val(bla);

jquery get all input from specific form

To iterate through all the inputs in a form you can do this:

$("form#formID :input").each(function(){
 var input = $(this); // This is the jquery object of the input, do what you will
});

This uses the jquery :input selector to get ALL types of inputs, if you just want text you can do :

$("form#formID input[type=text]")//...

etc.

Can't get value from input fields in jquery

While you're using your function on button click .. you can start from the button like this

in js

function addToCart(el){
    var input_value = jQuery(el).prev('.form-group').prev('.form-group').find("input").val();
    var comment=jQuery(el).prev('.form-group').find("textarea").val();
    alert(comment)
}

in html

<button class="btn" onclick="addToCart(this)">

Note : It will be better to wrap your code inside a div and use
.closest() and .find() instead of using .prev()

---

Related Topics