Je suis nouveau dans jQuery, donc désolé si ma question est trop simple.
J'essaie de faire quelque chose comme ça:
$("#send-one").html('done. ');
var tableProgress= $("<table id='table-progress'><tr><td></td></tr></table>");
$("#send-one").empty().append(tableProgress);
tableProgress.dataTable({
"bPaginate": false,
"bLengthChange": false,
"bFilter": true,
"bSort": false,
"bInfo": false,
"bAutoWidth": false
});
Tout cela se passe dans la boîte de dialogue jQuery ui .
Cela ne fonctionne pas, je pense que c'est parce que .dataTable () pluggin ne peut pas trouver la table, alors j'essaie d'utiliser jQuery $ .when .
L'erreur est la suivante
Uncaught TypeError: Impossible de lire la propriété 'asSorting' of indéfinie
Ce dont j'ai besoin, c'est: utiliser .datatable pluggin dans une table insérée dans $("#send-one").html('done. ' + tableProgress)
mais utiliser directement .datatable () peut ne pas être synchrone de l'insertion.
J'ai aussi essayé:
$("#send-one").html('done. ' + tableProgress);
$('#table-progress').dataTable();
Cette autre question de débordement de pile avait une réponse beaucoup plus claire, à savoir qu’elle devait avoir un <thead>
et un <tbody>
pour fonctionner: Erreur d’intégration Jquery datatable?
Le tien manque les deux.
J'ai fait ça et ça marche. apparemment un problème avec aoSorting of datatables. Je ne sais pas pourquoi.
$("#send-one").html('done. ');
var tableProgress= $("<table id='table-progress'><tr><th></th></tr><tr><td></td></tr></table>");
$("#send-one").empty().append(tableProgress);
tableProgress.dataTable( {
"aoColumns": [
null
]
});
Si vous utilisez le plugin dataTable columnFilter, celui-ci a résolu mon problème.
Il suffit de changer _fnColumnIndex comme ceci:
function _fnColumnIndex(iColumnIndex) {
return iColumnIndex;
}
Assurez-vous de charger le fichier plugin .js correctement.
var tableProgress = $('<table id="table-progress"><thead><tr><th>heading</th><th>heading</th></tr></thead><tbody><tr><td>cell</td><td>cell</td></tr><tr><td>cell</td><td>cell</td></tr></tbody></table>');
$("#send-one").empty().append(tableProgress);
tableProgress.dataTable();
Vous n'appelez aucune fonction asynchrone (comme certains appels AJAX). La fonction $.when
n'a donc aucun sens ici.
Lorsque vous utilisez des fonctions qui seront appelées après la dernière, le code suivant devrait fonctionner.
var tableProgress;
tableProgress = "<table id='table-progress'><tr><td></td></tr></table>";
$("#send-one").html('done. ' + tableProgress);
$('#table-progress').dataTable();
function someAction() {
var tableProgress;
tableProgress = $("<table id='table-progress'><tr><td></td></tr></table>");
$("#send-one").append(tableProgress);
tableProgress.dataTable();
}
ajoute la table à #send-one
, lorsque le document est prêt, puis appelle le dataTable dessus. Cela n’a aucun sens d’utiliser l’id puisque vous pouvez déjà l’avoir dans un objet jQuery.