How to Add custom bootstrap dialog modal popup box

Hi,

Here I have created sample that will help you out.

Download the below file

bootstrap-dialog.js

HTML

<div>
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
    <script src="Js/bootstrap-dialog.js" type="text/javascript"></script>
    <script type="text/javascript">
        var dialog = new bDialog();

        function showModal() {
            createDialog($('#ddlType').val(), 'BootstrapDialog', $("#ddlSize").val());
            dialog.open();
        }

        function createDialog(dialogType, dialogTitle, dialogSize) {
            dialog.setting({
                title: dialogTitle,
                titleType: dialogType,
                content: $('[id*=dialog]').html(),
                dialogSize: dialogSize
            });
        }

        function hideModal() {
            dialog.hide();
        }

    </script>
    Dialog Type :
    <select id="ddlType" name="ctl02">
        <option value="default">default</option>
        <option value="info">info</option>
        <option value="warning">warning</option>
        <option value="danger">danger</option>
        <option value="primary">primary</option>
    </select>
    &nbsp;&nbsp; Dialog Size :
    <select id="ddlSize" name="ctl02">
        <option value="default">default</option>
        <option value="xs">Extra Small</option>
        <option value="sm">Small</option>
        <option value="m">Medium</option>
        <option value="lg">Large</option>
    </select>
    <input type="button" name="name" value="Show Modal" onclick="showModal()" />
    <br />
    <br />
    <div id="dialog" style="display: none" align="center">
        This is a Bootstrap Dialog.
        <br />
        <br />
        <input type="button" id="btnClose" value="Close" onclick="hideModal()" />
    </div>
</div>

Screenshot