在按钮上填充Bootstrap 3模态单击

时间:2015-07-08 09:45:45

标签: javascript jquery html css twitter-bootstrap

我是一名初级网络开发人员,目前正在创建一个动态网站。在这个网站中我使用Javascript来构建我的页面,例如将HTML输入到var字符串中并在必要时调用它以加载到页面上。

我正在尝试使用Bootstrap模式将各种表单输入到我的数据库中。这给了我一些麻烦,因为像datepicker这样的一些元素不起作用我假设因为当点击日期选择器在页面加载时加载按钮时,模态会加载。

无论如何,我只是想知道在单击引导模式按钮时是否有办法让内容和我的自定义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”。

如果有人可以提供帮助,我会非常感激。

谢谢

易卜拉欣

1 个答案:

答案 0 :(得分:1)

您需要在创建模式后初始化您的日期选择器。因此,在success回调中构建DOM,然后像在普通页面加载时一样初始化datepicker:

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

顺便说一下,如果您正在使用模态,我建议使用Bootstrap Dialog JavaScript库,这样可以更轻松地以编程方式处理模型。例如,您可以显示一个简单的模态窗口,如下所示:

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