引導程序未應用於數據表中的動態加載的表

Question

因此，我試圖運行允許任何人在我的數據庫上運行查詢，然后在頁面上顯示結果。 由於查詢可以返回任意數量的列，因此我要在查詢返回后計算表格的列數。 問題是我嘗試使用Datatables文檔中提供的Bootstrap樣式，但是盡管頁面按鈕的樣式正確，但表卻沒有。

頁面隨附的html的樣式正確，生成的類似乎與Bootstrap文檔中的類相對應，但仍未應用樣式。

您可以查看www.dito.ninja上的頁面以獲取完整代碼。

extends layout

block head
    link(rel="stylesheet" type="text/css" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css")
    link(rel="stylesheet" type="text/css" href="//cdn.datatables.net/plug-ins/1.10.7/integration/bootstrap/3/dataTables.bootstrap.css")

    script(type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.10.2.min.js")
    script(type="text/javascript" language="javascript" src="//cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js")
    script(type="text/javascript" language="javascript" src="//cdn.datatables.net/plug-ins/1.10.7/integration/bootstrap/3/dataTables.bootstrap.js")
    script(type="text/javascript" charset="utf-8")

block content
  .row
    .col-lg-6
      div.label.label-default Table name is 'products'. Write queries like "SELECT * FROM products LIMIT 100;"
  .row
    .col-lg-6
      .input-group(role = "group")
        input.form-control#my-input(type='text' value ='SELECT * FROM products LIMIT 100;' style="width: 500px;")
        span.input-group-btn
          button.btn.btn-default#my-button(type='button' onclick='buttonclicked()') Work! Work!
  .row
    table#my-table

  script.
        function buttonclicked(){
            $.post( '/users/query/', {qq: $('#my-input').val()} , function( data ) {
                var cols = [];
                for (var col in data[0]) cols.push({"title": col});
                for (var i = 0; i < data.length; ++i) {
                    var newRow = [];
                    for (var val in data[i]) {
                        newRow.push(data[i][val]);
                    }
                    data[i] = newRow;
                }
                $('#my-table').dataTable({
                    "data": data,
                    "columns": cols
                });   
            });
        }

Answer 1

超時調用函數

setTimeout(function(){
  buttonclicked()
},1000);

可能在加載DOM /腳本之前會調用它