VOOZH about

URL: https://www.geeksforgeeks.org/bootstrap/bootstrap-5-overview-disabled-forms/

⇱ Bootstrap 5 Overview Disabled forms - GeeksforGeeks


  • Courses
  • Tutorials
  • Interview Prep

Bootstrap 5 Overview Disabled forms

Last Updated : 26 Jul, 2024

In Bootstrap, you can easily disable input in a form and stop it from interacting by using the disabled attribute. This is mainly used in forms where some fields are not available for all users to fill in. Although buttons are visibly disabled with this attribute you need to add the tabindex="-1" to completely discourage it from being focused by the keyboard. If we add the disabled attribute inside a <fieldset> tag will disable the whole page from taking inputs and interacting.   

Syntax:

<input class="..." id="..." disabled>

Used Attributes:

  • disabled: This attribute is used to disable the input field or disable any form field. This attribute doesn't take any values and it is the attribute by itself.

Example 1: The code example below demonstrates how we can use the disabled attribute to disable an input field and have a Disabled Form.

Output:

👁 disabled-form-1

Example 2: The code below demonstrates how you can add disabled to a fieldset enclosing a form will lead to disabling all the inputs of the form:

Output:

👁 disabled-form-2

Reference:https://getbootstrap.com/docs/5.0/forms/overview/#disabled-forms

Comment

Explore