Topic: MDB4 change button to loading...

matthias_deox pro asked 7 years ago


Does this work with MDB4? http://www.tutorialrepublic.com/codelab.php?topic=bootstrap&file=stateful-button I think I read somewhere .button('loading') isn't supported anymore by newer versions of bootstrap.

Michal Szymanski staff answered 7 years ago


There isn't such a functionality in MDB.

matthias_deox pro answered 7 years ago


Strange, works perfectly for me. Basically it only displays this code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example of Bootstrap 3 Stateful Buttons</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script type="text/javascript">  
$(function() { 
    $(".btn").click(function(){
        $(this).button('loading').delay(1000).queue(function() {
            $(this).button('reset');
            $(this).dequeue();
        });        
    });
});   
</script>
<style type="text/css">
    .bs-example{
    	margin: 20px;
    }
</style>
</head>
<body>
<div class="bs-example">
    <button type="button" class="btn btn-default" data-loading-text="Loading ...">Default</button>
    <button type="button" class="btn btn-primary" data-loading-text="Loading...">Primary</button>
    <button type="button" class="btn btn-info" data-loading-text="Loading...">Info</button>
    <button type="button" class="btn btn-success" data-loading-text="Loading...">Success</button>
    <button type="button" class="btn btn-warning" data-loading-text="Loading...">Warning</button>
    <button type="button" class="btn btn-danger" data-loading-text="Loading...">Danger</button>
    <button type="button" class="btn btn-link" data-loading-text="Loading...">Link</button>
</div>
</body>
</html>                                		

Michal Szymanski staff answered 7 years ago


Provided link doesn't work, at least right now.

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags