How to select form input elements using JQuery

How to select form input elements using JQuery:

Select Textbox using jQuery – $(‘input:text’)

Select a textbox field using JQuery

$('input:text');

Select a textbox value using JQuery

$('input:text').val();

Set a textbox value using JQuery

$('input:text').val("New Text");

2. Select Password using jQuery – $(‘input:password’)

Select password field using JQuery

$('input:password');

Select password value using JQuery

$('input:password').val();

Set password value using JQuery

$('input:password').val("New Text");

3. Select Textarea using jQuery – $(‘textarea’)

Select a textarea field using JQuery

$('textarea');

Select a textarea value using JQuery

$('textarea').val();

Set a textarea value using JQuery

$('textarea').val("New Text in Textarea");

 

 

4. Select Radio Buttons using jQuery – $(‘input:radio’)

Select a radio button field using JQuery

$('input:radio');

Select value of a selected radio button using JQuery

$('input:radio[name=radiobutton-name]:checked').val();

Select first selected radio button using JQuery

$('input:radio[name=radiobutton-name]:nth(0)').attr('checked',true);

or 

$('input:radio[name=radiobutton-name]')[0].checked = true;

 

5. Select Check Box using jQuery – $(‘input:checkbox’)

Select a checkbox field using JQuery

$('input:checkbox');

Check if a chcekbox is checked using JQuery

$('input:checkbox[name=checkboxname]').is(':checked');

Set a checkbox to checked using JQuery

$('input:checkbox[name=checkboxname]').attr('checked',true);

Set a checkbox to unchecked using JQuery

$('input:checkbox[name=checkboxname]').attr('checked',false);

6. Select File Upload using jQuery – $(‘input:file’)

Select a file input using JQuery

$('input:file');

Select the value of a file input using JQuery

$('input:file').val();

7. Select Hidden Inputbox using jQuery – $(‘input:hidden’)

Select a hidden inputbox using JQuery

$('input:hidden');

Select the value if a hidden input box using JQuery

$('input:hidden').val();

Set the value of hidden text box using JQuery

$('input:hidden').val("New Text");

8. Select dropdown box using jQuery – $(‘select’)

Select a dropdown box using JQuery

$('select')

or

$('#dropdown-id')

Select the value if selected dropdown box using JQuery

$('#dropdown-id').val();

Set the value of a dropdown box using JQuery

$("#dropdown-id").val("China");

9. Select Submit button using jQuery – $(‘input:submit’)

Select submit button using JQuery

$('input:submit');

10. Select Reset button using jQuery – $(‘input:reset’)

Select the reset button using JQuery

$('input:reset');

Here is a sample fiddle with working example

Sample Code on Github

(Download and run it as HTML)