Disabling Tabs in Bootstrap

Question

I am trying to disable the tabs in bootstrap. I have been researching and I have not yet found a solution.

I have tried this: Can you disable tabs in Bootstrap? It has lead me to the bootstrap issues... I also tried $('.disabled').removeData('toggle');

I looked here.. https://github.com/twitter/bootstrap/issues/2764 Solution Attempted: - Returning false

jQuery disable a link Solution Attempted: - event.defaultPrevented();

And yet I have not come up with an answer. So far my problem is that the tab will disable, by returning false. However, when the tab is active and can be clicked it will not transition to the other tab like it should.

jsfiddle: http://jsfiddle.net/de8QK/

Here is my code:

$(document).ready(function(){

$('#store-tab').attr('class', 'disabled');
$('#bank-tab').attr('class', 'disabled active');

$('#store-tab').not('#store-tab.disabled').click(function(event){
    $('#store-tab').attr('class', 'active');
    $('#bank-tab').attr('class', '');
    return true;
});
$('#bank-tab').not('#bank-tab.disabled').click(function(event){
    $('#bank-tab').attr('class' ,'active');
    $('#store-tab').attr('class', '');
    return true;
});

$('#store-tab').click(function(event){return false;});
$('#bank-tab').click(function(event){return false;});

$('.selectKid').click(function(event){
    $('.checkbox').removeAttr("disabled");
    $('#bank-tab').attr('class', 'active');
    $('#store-tab').attr('class', '');
});
});

Answer 1

HTML: Just add class disabled

JQUERY:

$(".disabled").click(function (e) {
        e.preventDefault();
        return false;
});