jQuery prop() method
The jQuery prop() method can be used to set the value of a input field by passing the value property and the value to be set as parameters to the prop() method in the form of strings separated by comma.
Syntax:
$('selected_element').prop("value", "value_to_be_set");
Example: The below example will explain the use of the prop() method to set the value of an input text field.
html
<!DOCTYPE HTML> <html> <head> <title> JQuery | Set value of input text. </title> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"> </script> </head> <body style="text-align: center;"> <h1 style="color: green;"> w3wiki </h1> Input Box: <input id="input" type="text" class="Disable" value="" /> <br> <br> <button id="setText"> setText </button> <script> $("#setText").click(function(event) { $('#input').prop("value", "w3wiki"); }); </script> </body> </html> |
Output:
JQuery Set the value of an input text field
In this article, we will learn about the different methods of setting the value of the input field on any web page by clicking on a button using jQuery. There are some in-built methods available in jQuery that we can use for this purpose as listed below:
Table of Content
- jQuery val() method
- jQuery prop() method
- jQuery attr() method
Let us now discuss all of these methods one by one in detail with the help of code examples.