Adding Buttons with Functionality Using JavaScript in Bootstrap

Question

I have created a modal window below to have customized buttons and functionality attached to those buttons using jQuery-UI. However, I want to do the equivalent in Bootstrap using JavaScript and not using data attributes. How would I do this? The Bootstrap website only gives the example of doing something like this using data attributes.

function showWindow(message) {
    windowShowing = true;
    $("#alertWindow").dialog(
    {
        height: 120, 
        modal: true, 
        buttons: 
        { 
          Continue: function(){$(this).dialog("close"); someProcedure();},            
          Exit: function(){$(this).dialog("close"); exitProcedure();}
        },
        close: function(){windowShowing = false;}       
     });
    $("#alertWindowMsg").text(message);
}

kenttam · Accepted Answer · 2013-09-17 17:31:00Z

2

You can add separate handlers and use the modal methods provided by Bootstrap. Something like

$(".close-button").click(function(){
    $('#myModal').modal('hide');
    exitProcedure();
});

$(".continue-button").click(function(){
    $('#myModal').modal('hide');
    continueProcedure();
});

answered Sep 17, 2013 at 17:31

kenttam

7404 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

FearlessFuture Over a year ago

Are you saying that I need to define these modal buttons in the HTML?

kenttam Over a year ago

@FearlessFuture Yes, you can put those buttons inside the html of your modal and then add these handlers into your javascript.

Collectives™ on Stack Overflow

Adding Buttons with Functionality Using JavaScript in Bootstrap

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related