2010-07-21 6 views
3

J'ai une table qui est triée avec succès en utilisant le plugin tablesorter. Cependant, je veux mettre en évidence le texte dans un champ de texte particulier dans une rangée particulière. Il a un identifiant unique, mais quand je place mon code après le code de tri cela ne fonctionne pas. Voici mon code:Plugin jQuery tablesorter - Effectuer une action AFTER table est triée

jQuery(document).ready(function() { 
    jQuery("#filetable").tablesorter({ 
    sortList: [[3,1]], 
    widgets: ['zebra'], 
    testExtraction: "complex" 
    }); 
    //my new code which doesn't work as expected 
    if(jQuery("#new_foldername").length > 0){ 
    jQuery("#new_foldername").focus(function() { jQuery(this).select(); }); 
    } 
}); 

Si je colle une alerte juste après la vérification pour voir si le existe #new_foldername, je vois l'alerte, et je vois le texte souligné en arrière-plan (donc mon code pour mettre en évidence le texte travaux). Lorsque je clique pour fermer l'alerte, la table finit de trier ... et le texte n'est plus mis en surbrillance.

Des idées sur ce qui pourrait se passer?

Répondre

5

il semble que le tri se passe de manière asynchrone. la documentation fournit un crochet appelé 'sortEnd' où vous voulez probablement exécuter votre code de surlignage. voir l'exemple de http://tablesorter.com/docs/example-triggers.html

$(document).ready(function() { 
    // call the tablesorter plugin, the magic happens in the markup 
    $("table").tablesorter(); 

    //assign the sortStart event 
    $("table").bind("sortStart",function() { 
     $("#overlay").show(); 
     }).bind("sortEnd",function() { 
     $("#overlay").hide(); 
    }); 
}); 
0

Merci Robert,

Malheureusement sortEnd est exécuté uniquement lorsque vous cliquez sur une colonne pour trier par. Il ne fonctionne pas sur le tri initial ...

Au lieu de cela, je crée un nouveau widget comme ceci:

jQuery.tablesorter.addWidget({ 
    id: "highlightNewFolder", 
    // format is called when the on init and when a sorting has finished 
    format: function(table) { 
    if(jQuery("#new_foldername").length > 0){ 
     jQuery("#new_foldername").focus(); 
    } 
    } 
}); 

Cela fonctionne maintenant. Malheureusement, j'ai dû laisser tomber la sélection/mise en évidence de tout le texte. Pour une raison quelconque lorsque le code a 'select() à l'intérieur, pas même la mise au point travaillé:

jQuery("#new_foldername").focus(function() { jQuery(this).select(); }); 

Si quelqu'un a des idées sur la façon de se concentrer et mettre en évidence tout le texte, ce serait très apprécié!

0

Vous pouvez utiliser le initialized callback function(ou se lient au tablesorter-initialized event) (source) Note: Les travaux que sur Mottie's fork of tablesorter, pas le (v2.0.5) d'origine.

jQuery(document).ready(function() { 
    jQuery("#filetable").tablesorter({ 
     sortList: [[3, 1]], 
     widgets: ['zebra'], 
     testExtraction: "complex", 
     initialized: function() { 
      if (jQuery("#new_foldername").length > 0) { 
       jQuery("#new_foldername").focus(function() { 
        jQuery(this).select(); 
       }); 
      } 
     } 
    }); 
}); 
+0

Merci dude. Wow c'était il y a un moment j'ai posté ça! Je suis maintenant passé à l'utilisation de Datatables maintenant, donc incapable de tester votre suggestion, mais cela semble plausible ...! – WastedSpace

Questions connexes