2014-03-05 42 views
0

我使用Bootbox顯示包含表格的彈出窗口,此部分工作良好。Bootbox + jQuery DataTables。彈出後Bootbox運行功能

但現在我想在剛創建的表上使用jQuery DataTables插件進行排序。 這需要我調用我剛剛在bootbox中創建的表上的DataTables插件。

但是我沒有找到任何方式在bootbox彈出窗口被創建後調用javascript/jQuery函數,如果你在bootbox函數內部編寫代碼,它只會在彈出的bootbox被關閉時發生。

如何在bootbox彈出窗口彈出並且仍然彈出後運行函數?

$(document).on('click', ".myButton", function() { 
     var userName = "<h2>"+ ($(this).data("username")) +"</h2>"; 
     var tableHeader = "<thead><tr>" + 
          "<th>Header 1</th>" + 
          "<th>Header 2</th>" + 
          "<th>Header 3</th>" + 
          "</tr></thead>"; 
     var tableData = $(this).data("value"); 

     var table = "<table id='myTable' class='table'>" + tableHeader + "<tbody>" + tableData + "</tbody>" + "</table>"; 
     bootbox.alert(userName + table, function (result) { 
     }); 
    }); 

我需要這個代碼中放置基本上是這樣

var oTable = $('#myTable').dataTable({ 
      null, null, null 
     ] 
    }); 

這可能是我需要摧毀和重建的彈出式窗口的數據表,但是這不是問題的權利現在。

回答

0

它實際上只是把它放在bootbox調用之後。 但是這不能導致異步問題?即,如果用戶在慢速計算機上或桌面/引導箱很重,則會在引導框實際完成之前嘗試調用dataTables插件。

$(document).on('click', ".myButton", function() { 
      var userName = "<h2>"+ ($(this).data("username")) +"</h2>"; 
      var tableHeader = "<thead><tr>" + 
           "<th>Header 1</th>" + 
           "<th>Header 2</th>" + 
           "<th>Header 3</th>" + 
           "</tr></thead>"; 
      var tableData = $(this).data("value"); 

      var table = "<table id='myTable' class='table'>" + tableHeader + "<tbody>" + tableData + "</tbody>" + "</table>"; 
      bootbox.alert(userName + table, function (result) { 
      }); 

      var oTable = $('#myTable').dataTable({ 
       null, null, null 
      ] 
      }); 
});