ブートストラップを使用してモーダルダイアログを表示する方法

以前は、jqueryダイアログを使用してポップアップメッセージを表示していました。ただし、プロジェクトにboostarpを使用する必要があり、実際にポップアップを表示する方法がわかりません。jqueryダイアログに使用したコード：

showUserWarningMessage: function (title, message, callback, scope, username) {
    var $dialog = $("#dialog-move-user-warning");
    $dialog.dialog({
        resizable: false,
        height: 450,
        width: 580,
        modal: true,
        top: 200,
        dialogClass: "warning-dialog",
        title: title,
        position: ["center", 200],
        open: function () {
            $dialog.find(".btn-default").on("click", function () {
                $dialog.dialog("close");
            });
            $dialog.find(".btn-primary").on("click", function () {
                $dialog.dialog("close");
                if (callback) {
                    if (scope) {
                        callback.call(scope);
                    } else {
                        callback();
                    }
                }
            });
        },

そして彼はブートストラップモーダルのためにim書き込みをコーディングします：

showAlertMessage: function(options) {
     var $dialog = $("#dialog-move-user-warning");
     $dialog.modal("show");        
}

HTML：

<div class="modal fade" id="dialog-move-user-warning" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                 <h4 class="modal-title" id="myModalLabel">User Info</h4>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Save changes</button>
            </div>
        </div>
    </div>
</div>

オーバーレイがポップされているかのように背景が無効になりますが、何らかの理由で画面に何も表示されませんが、表示されます。に設定されているデフォルトを変更しようとしましたがclass="modal"、役に立ちませんでした。何が間違っているのですか、またはオーバーレイを表示するために追加で必要なものはありますか？css変更する必要があるものはありますか？前もって感謝します！