單擊按鈕填充Bootstrap 3模態

Question

我是一名初級Web開發人員，目前正在創建一個動態網站。 在該網站中，我使用Javascript來構造我的頁面，例如將HTML輸入到var字符串中，並在必要時調用它以將其加載到頁面上。

我正在嘗試將Bootstrap Modal用於各種形式，以將數據輸入到數據庫中。 這給我帶來了一些麻煩，因為我認為某些元素（例如datepicker）無法正常工作，因為在單擊按鈕時（當日期選擇器在頁面加載時）加載了Modal。

無論如何，我只是想知道單擊引導程序模式按鈕時是否有一種方法可以加載內容和自定義Javascript，例如

        var outputContainer1 = $('#selectCraft');
$.ajax(apiPrefix + '/craft' + apiSuffix, {
    error: function() {},
    success: function(data){
        for(var i in data){
            $('#selectCraft').append('<option value="'+ data[i].id +'">'+data[i].aircraft_name+'</option>');
        }
    },
    type: 'GET'
});

如您所見，這是一個select元素，正在從數據庫中獲取其信息。 我想在按鈕單擊而不是頁面加載時加載。

我的按鈕數據目標是“ #flightModal”，模態ID是“ #flightModal”。

如果有人可以提供幫助，我將不勝感激。

謝謝

易卜拉欣

Answer 1

創建模態后 ，您只需要初始化日期選擇器即可。 因此，請在success回調中構建DOM，然后像在普通頁面加載中一樣初始化datepicker：

success: function () {
    // ...
    $('#datepicker').datetimepicker();
}

順便說一句，如果您正在使用模態，我建議您使用Bootstrap Dialog JavaScript庫，該庫使以編程方式使用模型更加容易。 例如，您可以顯示一個簡單的模態窗口，如下所示：

BootstrapDialog.show({
    title: 'Hello World',
    message: 'This is a hello world message'
});