Tablesorter ajax排序

Question

我需要对一个有3个不同日期的3列的表进行排序。表是用ajax构建的。在每次加载中，ajax加载表和日期是不可排序的。我试图改变dateFormat和其他的，但不可能做到这一点。你能帮我吗？下面是：

if($('#listeDevis') && $('#listerDevis') && $('#listerDevis').val() == 'true'){
    $.ajax({
        url : '/actions/listerDevisEnCours',
        dataType : 'html',
        beforeSend : function(){
            $('#loaderDevis').show();
        },
        success : function(data){
            $('#listeDevis').html(data);
            $('#nombreDevis').text($('#nombreDevisList').val());
            $('.tachesTables').hide();
            $('.bulleAide').hide();
            $('.infoComplementaire').hide();
            $('#tachesDevisEnCoursTables').show();
            $('.tachesTitres').click(function(){
                $('.tachesTables').hide();
                $('.tachesTitres').children('span').text('+');
                $(this).next().show();
                $(this).children('span').text('-');
            });

            $('.voirBulleAide').hover(function(){
                var top = $(this).offset().top - $(this).next('.bulleAide').innerHeight() - 4;
                $(this).next('.bulleAide').show().css({'top': top + 'px'});
            }, function(){
                $('.bulleAide').hide();
            });
            $('.voirInfoComplementaire').hover(function(){
                var top = $(this).offset().top - $(this).children('.infoComplementaire').innerHeight() - 4;
                $(this).children('.infoComplementaire').show().css({'top': top + 'px'});
            }, function(){
                $('.infoComplementaire').hide();
            });
        },
        complete : function(){
            $('#loaderDevis').hide();
            $('#tacheEnCours').addClass('trierTable').tablesorter({
                dateFormat: "uk",
                headers: {
                    2: "shortDate",
                    7: "shortDate",
                    8: "shortDate"
                }
            });
            $('#tacheEnCours').trigger('update');
        },
        error : function(jqXHR,textStatus, errorThrown){
            console.log(jqXHR);console.log(textStatus);console.log(errorThrown);    
            // alert("Erreur lors de la connexion au serveur");
        }
    });
}

谢谢你的帮助！

编辑:对不起，@Mottie，我迟到了，我被分配到另一个项目，然后我没有修复这个错误。对不起，让我给你看看html。这个表是用ajax生成的，格式是dd/mm/yyyy。我已经试过在英国设置格式了，但没成功.

<table border="0" cellspacing="0" cellpadding="0"  id="tacheEnCours">
  <thead>
  <tr>
    <th class="numEntete">N&ordm;</th>
    <th class="dateEntete">Date</th>
    <th class="clientEntete">Client</th>
    <th class="statutEntete">Statut</th>
    <th class="comEntete">Commentaire</th>
    <th class="dateEntete">Date Statut</th>
    <th class="dateEntete">Date &Eacute;ch&eacute;ance</th>
  </tr>
  </thead>
  <tbody id="listeDevis">
  </tbody>
</table>

最新情况：

我试过你的密码但还是没用..。我不明白为什么其他列会起作用，但只是日期列不起作用.我用分类器设置了一个正确的dateFormat："shortDate“。

$.ajax({
        url : '/actions/listerDevisEnCours',
        dataType : 'html',
        beforeSend : function(){
            $('#loaderDevis').show();
        },
        success : function(data){
            $('#listeDevis').html(data);
            $('#nombreDevis').text($('#nombreDevisList').val());
            $('.tachesTables').hide();
            $('.bulleAide').hide();
            $('.infoComplementaire').hide();
            $('#tachesDevisEnCoursTables').show();
            $('.tachesTitres').click(function(){
                $('.tachesTables').hide();
                $('.tachesTitres').children('span').text('+');
                $(this).next().show();
                $(this).children('span').text('-');
            });
            $('.voirBulleAide').hover(function(){
                var top = $(this).offset().top -                        $(this).next('.bulleAide').innerHeight() - 4;
                $(this).next('.bulleAide').show().css({'top': top + 'px'});
            }, function(){
                $('.bulleAide').hide();
            });
            $('.voirInfoComplementaire').hover(function(){
                var top = $(this).offset().top - $(this).children('.infoComplementaire').innerHeight() - 4;
                $(this).children('.infoComplementaire').show().css({'top': top + 'px'});
            }, function(){
                $('.infoComplementaire').hide();
            });
        },
        complete : function(){
            $('#loaderDevis').hide();
            $('#tacheEnCours').tablesorter({
                dateFormat: 'uk',
                headers: {
                    1: {sorter: "shortDate"},
                    5: {sorter: "shortDate"},
                    6: {sorter: "shortDate"}
                }
            });
        },
        error : function(jqXHR,textStatus, errorThrown){
            console.log(jqXHR);console.log(textStatus);console.log(errorThrown);    
            // alert("Erreur lors de la connexion au serveur");
        }
    });

Answer 1

如果使用的是我的餐盘叉，则可以将选项设置为总体表设置或每列。

$(function(){
  $("table").tablesorter({

    dateFormat : "mmddyyyy", // default date format

    // or to change the format for specific columns,
    // add the dateFormat to the headers option:
    headers: {
      0: { sorter: "shortDate" }, // "shortDate" with the default dateFormat above
      1: { sorter: "shortDate", dateFormat: "ddmmyyyy" }, // day first format
      2: { sorter: "shortDate", dateFormat: "yyyymmdd" }  // year first format
    }

  });
});

原表器有不同的dateFormat设置，这些设置在headers选项中不工作：

• us
• uk
• pt
• dd/mm/yy
• dd-mm-yy

您共享的代码需要组合，因为您无法第二次初始化表shared来更改选项。试试这个：

$('#tacheEnCours').addClass('trierTable').tablesorter({
    dateFormat: 'uk',
    headers: {
       1: {sorter: "shortDate"},
       5: {sorter: "shortDate"},
       6: {sorter: "shortDate"}
    }
});

正如我前面所说的，dataFormat: "ddmmyyyy"不会在原始版本的tablesorter上工作。