JQuery gets form field value

Question

I am using a jquery template to dynamically create multiple elements on the same page. Each item is as follows:

<div id ="DynamicValueAssignedHere"> <div class="something">Hello world</div> <div class="formdiv"> <form name="inpForm"> <input type="text" name="FirstName" /> <input type="submit" value="Submit" /> </form> </div> </div> 

I would like to use jQuery to process the form on submit. I would also like to return the form values ​​to their previous values ​​if something goes wrong. My question is: How can I get the value of an input field using jQuery? For example, I can get the div value with the class "something" by doing

 var something = $(#DynamicValueAssignedHere).children(".something").html(); 

Similarly, I want to get the value of a text field. Right now i tried

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

but it doesn't seem to work

Answer 1

You must use the value attribute to get its value

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

try -

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

Answer 2

It can be a lot easier than what you do.

HTML:

 <input id="myField" type="text" name="email"/> 

JavaScript:

 // getting the value var email = $("#myField").val(); // setting the value $("#myField").val( "new value here" ); 

Answer 3

Alternative approach without html field search:

 var $form = $('#' + DynamicValueAssignedHere).find('form'); var formData = $form.serializeArray(); var myFieldName = 'FirstName'; var myFieldFilter = function (field) { return field.name == myFieldName; } var value = formData.filter(myFieldFilter)[0].value; 

Answer 4

if you know the id of the inputs you only need to use:

 var value = $("#inputID").val(); 

Answer 5

 var textValue = $("input[type=text]").val() 

this will get all the values ​​of all text fields. You can use methods such as children, firstchild, etc., to push away. $ ('form [name = form1] input [type = text]') It’s easier to use identifiers for targeting elements, but if they are purely dynamic, you can get all the input values ​​and then loop through JS.

Answer 6

 $("form").submit(function(event) { var firstfield_value = event.currentTarget[0].value; var secondfield_value = event.currentTarget[1].value; alert(firstfield_value); alert(secondfield_value); event.preventDefault(); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form action="" method="post" > <input type="text" name="field1" value="value1"> <input type="text" name="field2" value="value2"> </form> 

Answer 7

 // for getting the value from input type text var value = $("input[type=text]").val(); // for getting the value from by input type name var textValue = $("input[name=text]").val() 

Answer 8

How to get an approved Upwork profile (even if you have been rejected 10 times).

How to get approval for your Upwork profile, even if they say your skill is not needed.

Email me to get approval for your #upwork account !!!!

skype: [e-mail] [John Snow]

Answer 9

You can try these lines:

 $("#DynamicValueAssignedHere .formdiv form").contents().find("input[name='FirstName']").prevObject[1].value 

Answer 10

You can get any input field value with $('input[fieldAttribute=value]').val()

here is an example

 displayValue = () => { // you can get the value by name attribute like this console.log('value of firstname : ' + $('input[name=firstName]').val()); // if there is the id as lastname console.log('value of lastname by id : ' + $('#lastName').val()); // get value of carType from placeholder console.log('value of carType from placeholder ' + $('input[placeholder=carType]').val()); } 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="formdiv"> <form name="inpForm"> <input type="text" name="firstName" placeholder='first name'/> <input type="text" name="lastName" id='lastName' placeholder='last name'/> <input type="text" placeholder="carType" /> <input type="button" value="display value" onclick='displayValue()'/> </form> </div>