SaraFatih
SaraFatih

Reputation: 159

Make a Bootstrap button disabled, then enable it after some specific time

I want to make a Bootstrap button disabled, but I want to enable it again after some time. I tried this but it doesn't work:

$('button').
  prop('disabled', true).
  setTimeout(function() { 
    $('button').prop('disabled', false)
  }, 3000);

Thank you guys in advance.

Upvotes: 0

Views: 1197

Answers (4)

Regolith
Regolith

Reputation: 2971

First disable the button like $('button').attr("disabled", "disabled"); and use setTimeout and assign timeout value.

$('button').attr("disabled", "disabled");
//or you can use #btn ref: $('#btn').attr("disabled", "disabled"); 
setTimeout(function() 
{
    $('button').removeAttr('disabled');
}, 3000);//3000 ms = 3 second.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="btn">Submit</button>

ref: Window setTimeout() Method

Upvotes: 1

Mudasir Younas
Mudasir Younas

Reputation: 872

 $('button').prop('disabled', true);
  setTimeout(function () {
      $('button').prop('disabled', false);
  }, 3000);

Upvotes: 1

31piy
31piy

Reputation: 23859

setTimeout is not a method of a jQuery element. Change your code as follows:

$('button').prop('disabled', true);

setTimeout(function() { 
  $('button').prop('disabled', false)
}, 3000);

Upvotes: 1

Shiladitya
Shiladitya

Reputation: 12181

Here you go with the solution https://jsfiddle.net/w0nefkfo/

$('button').prop('disabled', true);
setTimeout(function(){
	$('button').prop('disabled', false);
}, 2000);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="submit" value="submit">Submit</button>

Upvotes: 2

Related Questions