How To Disable Submit Button Using Bootstrap

In this tutorial, learn how to disable the submit button using Bootstrap. The short answer is to use the disabled attribute in the submit button.

When the user enters their details and clicks the submit button, you will get the input data in the database or through email. However, sometimes you do not want to allow the users to click the submit button. In that condition, you can use the methods given below to disable the submit button.

Disable Button Type Submit With Bootstrap

To disable any submit button and other buttons of a form. You have to add the attribute disabled="disabled" to the <button> element to make it disabled. After you disable the button, users may not be able to submit the form.

See the example given below to disable button type submit.

Test it Live

Output



The above example contains the input text and the button type submit. After you add the attribute disabled, you will get the button that becomes disable to click. You can try to click the above button. But, it is in a disabled state.

Bonus: download a Free Bootstrap CHEAT SHEET that will show you 20+ most important examples to learn in Bootstrap.

How To Disable Input Type Button Using Bootstrap

You can disable the input type submit using the attribute disabled="disabled". You have to just put the attribute in the input type to make it disable.

Test it Live

Output



The above example contains the input text and the input button. Hover over the above button to see what effect you will get after making it disabled.

Create Login Form Bootstrap and Disallow User to Click Button

In addition to the above, you may also want sometimes to disallow a button to click on the login form. This is required when you don’t want all users to fill the login form and click the submit button. You may also like to read how to make the input field required using Bootstrap.

In that case, you have to use the same attribute disabled="disabled" as you have used above.

Test it Live

Output




The above example contains the login form with input for username and password. Fill the above form by entering the username and password. In the end, you can try to click the submit button. However, the button is disabled and you cannot submit the form by clicking the button.

DOWNLOAD Free Bootstrap CHEAT SHEET

You may also like to read

I hope you like this post on how to not allow users to click on the submit button.

Reference
Bootstrap Doc to Learn Classes to Disallow Button Click