表分类器ajax排序

Question

我需要对一个有3个不同日期的3列的表进行排序。该表是用ajax构建的。在每次加载中，ajax都会加载表，并且日期无法启动。我试过更改日期格式和其他，但不可能实现。你能帮我吗？这是：

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>

更新：

我试过你的代码，但仍然不起作用。。。我不明白为什么其他列有效，而只有日期列无效。。。我用排序器设置了一个正确的日期格式："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

如果您使用我的表分类器叉，您可以将dateFormat选项设置为整体表设置，或按列

$(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

---

您共享的代码需要合并，因为您无法再次初始化表分类器来更改选项。试试这个：

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

如上所述，dataFormat: "ddmmyyyy"无法在原始版本的表分类器上工作。