How to get form data using JavaScript/jQuery? Last Updated : 03 Aug, 2021 Comments Improve Suggest changes Like Article Like Report The serializeArray() method creates an array of objects (name and value) by serializing form values. This method can be used to get the form data. Syntax: $(selector).serializeArray() Parameter: It does not accept any parameter. Return Value: It returns all the value that is inside the inputs fields. Example: html <!DOCTYPE html> <html> <head> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"> </script> <script> $(document).ready(function() { $("button").click(function() { var x = $("form").serializeArray(); $.each(x, function(i, field) { $("#output").append(field.name + ":" + field.value + " "); }); }); }); </script> <style> #GFG { width: 300px; padding: 50px; height: 150px; border: 2px solid green; } </style> </head> <body> <div id="GFG"> <form action="#"> Name: <input type="text" style="margin: 10px;" name="Name"> <br> </form> <button>Submit</button> </div> <div id="output"></div> </body> </html> Output: Before clicking the button: After clicking the button: jQuery is an open source JavaScript library that simplifies the interactions between an HTML/CSS document, It is widely famous with it's philosophy of “Write less, do more". You can learn jQuery from the ground up by following this jQuery Tutorial and jQuery Examples. Comment More infoAdvertise with us Next Article How to get form data using JavaScript/jQuery? S Sruti Rai Follow Improve Article Tags : JavaScript Web Technologies JQuery jQuery-Misc Similar Reads How to convert form data to JavaScript object with jQuery ? JavaScript objects are complex data types that can store multiple values and properties. Unlike primitive data types that only hold a single value, objects can hold various data types, including other objects, arrays, functions, and more. The inputs given by a user can be converted into objects wher 3 min read How to submit a form using ajax in jQuery ? Submitting a form using AJAX in jQuery allows sending form data to a server asynchronously without reloading the page. This method improves user experience by sending the data in the background and receiving a response without interrupting the user's interaction with the webpage.Syntax:$.ajax({type: 2 min read How to get Values from HTML Input Array using JavaScript? This problem can be solved by using input tags having the same "name" attribute value that can group multiple values stored under one name which could later be accessed by using that name. Syntaxlet input = document.getElementsByName('array[]');What is an Input Array in HTML?An "input array" in HTML 2 min read How to append data to <div> element using JavaScript ? To append the data to <div> element we have to use DOM(Document Object Model) manipulation techniques. The approach is to create a empty <div> with an id inside the HTML skeleton. Then that id will be used to fetch that <div> and then we will manipulate the inner text of that div. 1 min read How to get form data using POST method in PHP ? PHP provides a way to read raw POST data of an HTML Form using php:// which is used for accessing PHP’s input and output streams. In this article, we will use the mentioned way in three different ways. We will use php://input, which is a read-only PHP stream. We will create a basic HTML form page wh 2 min read Design a Survey Form using HTML CSS and JavaScript In this article, we are going to implement a survey form using HTML, CSS, and JavaScript. In this form, we will get data about the interest of people in sports. In this implementation, the data will be stored in a CSV file after successful form validations. Preview of final output: Let us have a loo 5 min read How to Get the Value of an Input Text Box using jQuery? When working with forms or interactive web pages, sometimes need to get the values entered into the input fields. This article provide a complete guide on how to get the value o an input text box using jQuery. Below are the different approaches to get the value of an input text box using jQuery:Get 2 min read How to get value of selected radio button using JavaScript ? To get the value of the selected radio button, a user-defined function can be created that gets all the radio buttons with the name attribute and finds the radio button selected using the checked property. The checked property returns True if the radio button is selected and False otherwise. If ther 2 min read How to get hidden field array values in javascript? To retrieve values from hidden fields in JavaScript, you can use methods like querySelectorAll or getElementsByName to select these elements and extract their values. This can be useful for gathering data that isn't directly visible on a web page but still needs to be accessed or processed.Example U 2 min read JavaScript - How to Get the Data Attributes of an Element? Here are the various methods to get the data attributes of an element using JavaScript1. Using dataset PropertyThe dataset property in JavaScript allows you to access all data attributes of an HTML element as a DOMStringMap object. It simplifies retrieving, modifying, or interacting with custom data 2 min read Like