In this article, I am going to share how you can get the value of all textboxes using the jQuery Each function.
Step 1
Add one webpage to your application as I have added in the below figure.
![jQuery]()
Step 2
Design the webpage with some textboxes and one button field. I used the following code to design the layout. There are three textboxes and one button.
- <input type="text" id="txtUserName" />
- <input type="text" id="txtUserAddress" />
- <input type="text" id="txtUserDepartment" />
- <input type="text" id="txtUserstatus" />
- <input type="button" value="Click Me" id="btnClick" />
![jQuery]()
Remarks
You can use ASP.NET server-side controls or HTML controls but I will recommend you to use HTML control. HTML controls are very lightweight and take much less time to load on the webpage.
Step 3
Add jQuery library to your application inside the <head> tag.
- <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script>
![jQuery]()
Step 4
Now, it is time to write the jQuery code on the button click event.
Write the given code inside the <head> tag.
- <script>
- $(document).ready(function () {
- $("#btnClick").click(function () {
-
- $("input[type='text']").each(function () {
-
- alert($(this).val());
- })
- });
-
- });
- </script>
Step 5
Now, see the output of your application on the button click.
![jQuery]()
Remark
You can download the working project from the given link.