jQuery DataTables - page d'une ligne donnée

J'ai écrit une fonction pour vous déplacer à la page avec la ligne de donnée. Toutefois, il s'appuie sur de nouvelles API. La partie à l'intérieur de la si est ce que vous voulez.

function moveToPageWithSelectedItem() {
var numberOfRows = itemsTable.data().length;
var rowsOnOnePage = itemsTable.page.len();
if (rowsOnOnePage < numberOfRows) {
var selectedNode = itemsTable.row(".selectedItem").node();
var nodePosition = itemsTable.rows({order: 'current'}).nodes().indexOf(selectedNode);
var pageNumber = Math.floor(nodePosition / rowsOnOnePage);
itemsTable.page(pageNumber).draw(false); //move to page with the element
}
}

Utilisation fnPagingInfo

  $.fn.dataTableExt.oApi.fnPagingInfo = function ( oSettings )
{
return {
"iStart":         oSettings._iDisplayStart,
"iEnd":           oSettings.fnDisplayEnd(),
"iLength":        oSettings._iDisplayLength,
"iTotal":         oSettings.fnRecordsTotal(),
"iFilteredTotal": oSettings.fnRecordsDisplay(),
"iPage":          Math.ceil( oSettings._iDisplayStart / oSettings._iDisplayLength ),
"iTotalPages":    Math.ceil( oSettings.fnRecordsDisplay() / oSettings._iDisplayLength )
};
};
$(document).ready(function() {
$('#example').dataTable( {
"fnDrawCallback": function () {
alert( 'Now on page'+ this.fnPagingInfo().iPage );
}
} );
} );

http://datatables.net/plug-ins/api

J'avais besoin de programmation pour trouver une ligne dans la table de données, de la pagination de la table à la page de la ligne, et d'étendre la ligne. Je sais que certaines personnes ont créé des bibliothèques personnalisées à manipuler, mais je m'attends à de telles fonctionnalités de base de la boîte. En tout cas, voici ce que j'ai fait. Ce n'est pas l'idéal, mais peut aider.

• Utiliser jquery pour obtenir l'objet de la table
• Obtenir les nœuds de la table (lignes) et le nombre de nœuds; il est important et nécessaire parce que l'objet de la table a seulement ces lignes
  chargé que vous voyez sur la page en cours.
• Depuis pagesize de la table peut être changée par l'utilisateur et il n'y a pas de fonction pour récupérer la pagesize, je l'avais enregistré dans le stockage local
  que je pourrais récupérer. Je sais que je pourrais le faire avec quelque chose comme
  var pageSize = oTable.fnSettings()._iDisplayLength; Mais je préfère
  pas de référence interne de la mise en œuvre d'un objet.
• Trouver le numéro de colonne de la colonne que vous êtes à la recherche pour
• Trouver la ligne # de la ligne qui a le correspondant de la colonne (le premier) dans ce cas.
• Calculer la page #
• Aller à la page et l'utiliser délai d'attente pour charger la page
• Utiliser jquery pour déclencher toute action que vous souhaitez déclencher dans une ligne (par exemple, de se développer).

Voici l'exemple de code:

let oTable      = $('table#transactions').dataTable(),
nodes       = oTable.fnGetNodes(),
totalRows   = oTable.fnGetData().length,
pageSize    = vmTable.pageLength,
idColumn    = Object.keys(vmTable.columns).indexOf('column_name_to_be_matched'),
matchedPage = 0;
for (var i=0; i<totalRows; i++){
if (searchValue) === parseInt(nodes[i].cells[idColumn].innerHTML)) {
matchedPage = Math.floor(i/pageSize);
break;
}
}
if (matchedPage > 0)
oTable.fnPageChange(matchedPage);
$timeout(function() {
$(`table#transactions ul[aria-labelledby="dd${searchValue}"] span.expand`).parent().trigger('click');
}, 800);