使用BootstrapDialog進行Bootstrap切換

Question

勞駕，

是否有可能以顯示引導切換在message領域BootstrapDialog ？

例如：

BootstrapDialog.show({
  title: 'Information',
  message: '<input class="toggleExample" type="checkbox" data-toggle="toggle">'
});

另外，我嘗試在BootstrapDialog之前和BootstrapDialog之后初始化$('.toggleExample') ，但是它們都沒有起作用。

Answer 1

BootStrap dialog插件是基於bootstrap 3庫構建的， Bootstrap dialog也是基於bootstrap 2庫構建的。

因此這兩個插件都可以與內核庫的不同版本一起使用，因此您無法將兩個插件的功能組合在一起。

有關更多信息，請參閱插件官方網站：

• 引導對話框-https: //github.com/nakupanda/bootstrap3-dialog
• Bootstrap Toggle（轉到頁面末尾以了解版本） -http://www.bootstraptoggle.com/

Answer 2

只需嘗試根據您的需要此代碼，這將彈出帶有復選框和按鈕。

BootstrapDialog.show({
    message: function (dialogItself) {
        var $form = $('<form></form>');
        var $titleDrop = $('<input type="checkbox" />');
        dialogItself.setData('field-title-drop', $titleDrop);   // Put it in dialog data's container then you can get it easier by using dialog.getData() later.
        $form.append('<label>Click Here</label>').append($titleDrop);

        return $form;
    },
    buttons: [{
        label: 'OK.',
        action: function (dialogItself) {
            alert(dialogItself.getData('field-title-drop').val());
        }
    }]
});

試試這個演示： http : //jsfiddle.net/7DcHW/30/