jQuery déclenchement d'un événement de clic semble courir un pas derrière

Question

J'utilise le plugin tablesorter qui est génial. J'ai dû cloner l'en-tête d'origine et réinsérer le clone au-dessus d'une zone déroulante.

Pour déclencher le plugin tablesorter sur les anciens éléments d'en-tête cachés de la table je déclenche un clic en utilisant .trigger() sur la table cachée lorsqu'un utilisateur clique sur la table clonée visible.

Voici le jQuery:

$('.w_price_assess').delegate('#quotations_clone thead th', 'click', function() { 

     var $cloneTh = $(this); 
     var $cloneThIndex = $cloneTh.index('#quotations_clone thead th'); 

     $('#quotations thead th:eq(' + $cloneThIndex + ')').trigger('click'); 

     var $classList =$('#quotations thead th:eq(' + $cloneThIndex + ')').attr('class').split(/\s+/);    

     console.log($classList); 

     $.each($classList, function(index, item){ 
      if (item==='headerSortDown') { 
       $('#quotations_clone thead th').removeClass('headerSortUp headerSortDown'); 
       $('#quotations_clone thead th:eq(' + $cloneThIndex + ')').addClass('headerSortDown'); 
      } else if (item==='headerSortUp') { 
       $('#quotations_clone thead th').removeClass('headerSortUp headerSortDown'); 
       $('#quotations_clone thead th:eq(' + $cloneThIndex + ')').addClass('headerSortUp'); 
      } else { 
       //$('#quotations_clone thead th').removeClass('headerSortUp headerSortDown'); 
      } 
     });  

    }); 

Le problème qui se produit est que lorsque je clique sur le clonée ième élément, il ne met pas immédiatement en arrière de la classe trieuse de table ajoute au cache e élément.

Je dois m'enregistrer en même temps et je ne sais pas comment procéder?

Answer 1

j'ai réussi à résoudre ce problème en utilisant une variable globale comme ceci:

var $orginalHead = $("#tablesorter-demo thead"); 

    globalIndex = null; 

    $($orginalHead) 
    .clone() 
    .insertBefore("#tablesorter-demo") 
    .wrap('<table id="sorter-clone" />'); 

    $("body").delegate("#sorter-clone thead th", "click", function() { 
     var $tHeader = $(this); 
     $tHeaderIndex = $tHeader.index("#sorter-clone thead th"); 
     $('#tablesorter-demo thead th:eq(' + $tHeaderIndex + ')').trigger('click'); 
    }); 

    $("#tablesorter-demo").bind("sortEnd", function() { 
     var $classList = $('#tablesorter-demo thead th:eq(' + $tHeaderIndex + ')').attr('class').split(/\s+/); 
     replaceClasses($classList, $tHeaderIndex, globalIndex);     
    }); 

    function replaceClasses(classes, index, oldIndex) { 

     globalIndex = index; 
     var list = classes.toString().replace(",", " "); 
     var oldHead = $("#sorter-clone thead th:eq(" + oldIndex + ")").removeAttr("class"); 
     var newHead = $("#sorter-clone thead th:eq(" + index + ")").removeAttr("class").addClass(list);   

     if (oldIndex !== null) { 
      return {x:oldHead, y:newHead}; 
     } else { 
      console.log("bar"); 
     } 
    }