Quelle est l'approximation jQuery la plus proche du DataTable de YUI?

Question

Mes deux priorités sont l'amélioration progressive et l'édition en ligne. J'ai trouvé l'amélioration progressive (DataTables) et l'édition en ligne (jqGrid), mais pas les deux. La prise en charge des thèmes de l'interface utilisateur jQuery serait agréable, mais elle est moins prioritaire.

MISE À JOUR: Voici un exemple de ce que je me fais la solution ressemblerait à:

<table summary="A table full of example tabular data"> 
    <caption>My Table to Progressively Enhance</caption> 
    <thead> 
    <tr> 
     <th id="colA">Column A</th> 
     <th id="colB">Column B</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td headers="colA">foo</td> 
     <td headers="colB">bar</td> 
    </tr> 
    <tr> 
     <td headers="colA">argle</td> 
     <td headers="colB">bargle</td> 
    </tr> 
    </tbody> 
</table> 

… insert jquery datatable stuff here … 

<script type="text/javascript"> 
    progressivelyEnhanceMyTable(); 
</script> 

Answer 1

Avec la dernière Avec la sortie de jqGrid, nous obtenons maintenant tableToGrid, ce qui résout assez bien le problème de la grille à partir du balisage.

Answer 2

Je pense que jqGrid serait un assez bon ajustement.

MISE À JOUR:

Vous pouvez utiliser le code comme ceci pour convertir votre table à un objet javascript

var $table = $('table'); // select your table 
var data = []; // instantiate the data array 
$('tr', $table).each(function(i, item){ // loop through the table rows 
    obj = {} // create the object to append to the data array 
    obj.name = $('td:eq(0)',$(this)).text().trim(); 
    obj.desc = $('td:eq(1)',$(this)).text().trim(); 
    data += obj; // add the object to the array 
}); 

puis virer de bord sur comme dans le loading array data example

for(var i=0;i<=data.length;i++) $("#datagrid").addRowData(i+1,data[i]); 

Answer 3

Il existe un plug-in pour les datatables appelé jquery-datatables-editable qui ajoute l'édition en ligne.