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.

  1. <input type="text" id="txtUserName" />
  2. <input type="text" id="txtUserAddress" />
  3. <input type="text" id="txtUserDepartment" />
  4. <input type="text" id="txtUserstatus" />
  5. <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.

  1. <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.

  1. <script>
  2. $(document).ready(function () {
  3. $("#btnClick").click(function () {
  5. $("input[type='text']").each(function () {
  7. alert($(this).val());
  8. })
  9. });
  11. });
  12. </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.