How to Disable Button Element Dynamically using JavaScript? Last Updated : 12 Aug, 2024 Comments Improve Suggest changes Like Article Like Report The disabled property in the HTML DOM is used to control the interactivity of a button element. When this property is set, the button becomes unclickable and inactive, effectively preventing any user interaction. This property accepts a boolean value, allowing developers to dynamically enable or disable buttons based on specific conditions or user actions. We will see how the disabled property works and how you can leverage it to enhance the user experience and functionality of your web forms.Syntax: It is used to set the button disabled property.buttonObject.disabled = "value"Example: In this example, we will disable a button using the disabled attribute. HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Disable button element dynamically using JavaScript?</title> </head> <body style="text-align:center"> <h1 style="color: green;"> GeeksforGeeks </h1> <h2> How to disable button element<br> dynamically using JavaScript? </h2> <!-- Assigning id to Button. --> <button id="GFG" onclick="ClickedButton()"> Submit </button> <br><br> <p id="sudo"></p> <script> function ClickedButton() { document.getElementById("GFG") .disabled = "true"; document.getElementById("sudo") .innerHTML = "Button is Disabled"; } </script> </body> </html> Output:Disable button element dynamically Comment More infoAdvertise with us Next Article How to Disable Button Element Dynamically using JavaScript? V vkash8574 Follow Improve Article Tags : JavaScript Web Technologies JavaScript-Questions Similar Reads How to disable radio button using JavaScript ? Radio buttons let users select one option from many, commonly used in forms. Sometimes, based on a user's previous choice, certain options need to be disabled. For example, if a user selects "No" to playing games, we can disable related game options. Using JavaScript, about 65% of forms use such log 4 min read How to enable/disable a button using jQuery ? Enabling/disabling a button using jQuery involves altering its functionality to either accept user input or not. This is typically done by manipulating its 'disabled' property or attribute through jQuery methods like `.prop()` or .attr().To enable/disable a button using jQuery, you'll need a basic H 2 min read How to remove “disabled†attribute from HTML input element using JavaScript ? In HTML, we use input elements for user input. The 'disabled' property helps prevent interaction with these elements. For example, if we only want users over 18 to input their Adhar card numbers, we can use JavaScript to remove the 'disabled' attribute when the user enters an age greater than 18. Th 2 min read JavaScript- Disable and Enable Button in JS These are the following approaches to Disable and enable a Button in JavaScript:1. Using the disabled Attribute The code example toggles the 'myButton' state between enabled and disabled using the 'toggleButton'. Clicking the 'toggleButton' triggers the 'toggleButtonState' function, which checks if 2 min read How to Disable Specific Readio Button Option using JavaScript? In this article, we will disable a specific radio button using JavaScript. Disabling specific radio button options using JavaScript involves targeting the specific option and then set its disabled property to true. This can be done by selecting the radio button option and modifying its disabled prop 2 min read How to Disable a Button Conditionally in JavaScript? In JavaScript, you can conditionally disable buttons based on specific criteria to control user interactions. Using simple if-else statements or event listeners, you can dynamically enable or disable buttons depending on form validation, user actions, or other conditions. This helps regulate the ava 3 min read How to Disable Submit Button on Form Submit in JavaScript ? Forms are a crucial part of web development as they allow users to submit data to a server. However, sometimes we want to customize the behavior of HTML forms and prevent the default behavior from occurring. This allows you to create a more interactive and user-friendly web application. In this arti 3 min read How to Disable Textarea using JavaScript? This article will show you how to disable the textarea using JavaScript. Disabling a textarea using JavaScript can be done by setting the disabled property of the textarea element to true. This prevents the user from editing the content of the textarea. There are some reasons to use disabled textare 2 min read Semantic-UI Button Disabled States Semantic UI is a modern framework used in developing seamless designs for the website, It gives the user a lightweight experience with its components. It uses predefined CSS and jQuery to incorporate different frameworks. Semantic-UI Button Disabled States are is one of the states from 3 states of S 2 min read How to make a Disable Buttons using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be making a Disable Button using jQuery Mobile. Approach: First, add jQuery Mobile scripts needed for your project. <link rel="stylesheet 1 min read Like