How to disable all input controls inside a form using jQuery


Use the jQuery prop() method

You can use the jQuery prop() method in combination with the :input selector to disable all <input><textarea><select> and <button> elements inside an HTML form dynamically using jQuery. The prop() method require jQuery 1.6 and above.

Let's check out an example to understand how this method basically works:

<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<title>jQuery Disable All Form Elements</title>
    label {
        display: block;
        margin-bottom: 5px;
    label, input, textarea, select {
        margin-bottom: 10px;
<script src=""></script>
        $("#myForm :input").prop("disabled", true);
    <form id="myForm">
        <input type="text">
        <button type="button">Submit</button>
        <button type="button">Reset</button>