Blaze UI Input Disabled Fieldset

jQuery | disable/enable an input element

Last Updated : 28 Mar, 2019

The disable/enable an input element in jQuery can be done by using prop() method. The prop() method is used to set or return properties and values for the selected elements. Example 1: This example uses prop() method to disable the input text field.

html

<!DOCTYPE html>  
<html>  

<head> 
    <title> 
        JavaScript enable/disable
        an input element
    </title>
    
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
</head> 
        
<body style = "text-align:center;">  

    <h1 style = "color:green;" >  
        GeeksForGeeks  
    </h1>  
            
    <input id = "input" type="text" name="input"/> 
        
    <button onclick="enable_disable()"> 
        Enable/Disable
    </button> 
        
    <!-- Script to disable input text area -->
    <script> 
        function enable_disable() {
            $("input").prop('disabled', true);
        }
    </script> 
</body>  

</html>

Output:

Before clicking the button:
After clicking the button:

Example 2: This example uses prop() method to enable the input text field.

html

<!DOCTYPE html>  
<html>  

<head> 
    <title> 
        JavaScript enable/disable
        an input element
    </title>
    
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
</head> 
        
<body style = "text-align:center;">  

    <h1 style = "color:green;" >  
        GeeksForGeeks  
    </h1> 
    
    <input id = "input" type="text" name="input" disabled/> 
    
    <button onclick="enable_disable()"> 
        Enable/Disable
    </button> 
    
    <!-- Script to enable input text fields -->       
    <script> 
        function enable_disable() {
            $("input").prop('disabled', false);
        }
    </script> 
</body>  

</html>

Output:

Before clicking the button:
After clicking the button:

Blaze UI Input Disabled Fieldset

P

PranchalKatiyar

Improve

Article Tags :

Similar Reads

How to enable/disable all input controls inside a form element using jQuery ?

Give an HTML document containing a form element. The form element contains input elements, option elements, and button elements. The task is to enable or disable all input controls inside a form using jQuery. It can be done by using prop() method. Using prop() Method: It is used to set or return the

How to find all input elements that are enabled using jQuery?

The jQuery " :enabled" pseudo-class selector helps to find all the input element that are enabled. This pseudo-class selector should only be used for selecting HTML elements that support the disabled attribute i.e (<button>, <input>, <textarea>, <select>, <option>, <

How to find all elements that are disabled in jQuery ?

In this article, we will learn how to find all elements on the page that are disabled using jQuery. Approach: The :disabled selector can be used to get all elements on the page that are currently disabled. These elements are iterated over using the each() method. The elements can then be individuall

Blaze UI Input Disabled Fieldset

Blaze UI is an open-source CSS framework. It is a lightweight UI toolkit that provides great tools for building customized and scalable applications. It can work with any framework that exists. It can adapt to any ecosystem. All designs or CSS are mobile-first and hence responsive. Its project is av

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

How to specify that an input element should be disabled?

The disabled attribute for <input> element is used to specify that the input field is disabled. A disabled input is un-clickable and unusable. It is a boolean attribute. The disabled <input> elements are not submitted in the form. Syntax:<input disabled>Example: In this example, to

Content editable change event in jQuery

In General, jQuery provides various function to handle selectors, selector properties and even documents, etc. Whereas here using jquery change event for content editable. jQuery Change Event: It occurs when the value of an element is changed also this event is fired immediately when the user makes

HTML | DOM Input Image disabled Property

The HTML DOM Input Image disabled Property is used to set or return the boolean value that represents an image field should be disabled or not. By default, the disabled elements are displayed in gray and are unusable and unclickable. Syntax: It returns the disabled property.imageObject.disabledIt is

HTML | DOM Input Date disabled Property

The Input date disabled property is used to set or return whether a date field should be disabled, or not. An element becomes unusable and un-clickable if it is disabled. Such elements are generally rendered in gray by browsers. The HTML disable attribute is reflected by the Date disabled property.S

HTML | DOM Input Email disabled Property

The Input Email disabled property in HTML DOM is used to set or return whether the Input Email field must be disabled or not. A disabled Input Email field is unclickable and unusable. It is a boolean attribute and used to reflect the HTML Disabled attribute. Syntax: It is used to return the disabled