按日期对引导程序表列进行排序

Question

我试图修改代码以按日期对表记录进行排序（按日期字段“开始日期/时间”和“完成日期/时间”进行排序），但没有成功。 我使用现有的SO解决方案来尝试使排序工作正常，但是如果有人可以帮助的话就不能这样做，将不胜感激。

我的表HTML和数据由我的ajax文件提供。

HTML：

<div class="box box-primary">
    <div class="box-header">
        <h3 class="box-title">Existing Log Entries</h3>
    </div>

    <form role="form">
        <div class="box-body">
            <div class="col-md-12" id="div-log-list"></div>
        </div>
        <div class="box-footer">
        </div>
    </form>

    <div style="margin:auto; width:99%;">
        <div id="entrieslist-div"></div>
    </div>

    <div class="overlay" id="box-loading">
      <i class="fa fa-refresh fa-spin"></i>
    </div>  
</div>

JS：

    $(function() {    
    // Populate log entry table
    $.ajax({
        type: "post",
        url: "ajax/ajax-populate-log-entries.php", 
        success: function(result){
            $('#entrieslist-div').html(result);
            $('#box-loading').hide();
            $("#entrieslist").dataTable();
        }
    }); 
});

AJAX：

$counter = 0;

echo '<table id="entrieslist" class="table table-bordered table-striped dataTable">';
echo '
        <thead>
        <tr>
            <th>Start Date/Time</th>
            <th>Finish Date/Time</th>
            <th>Server Name</th>
            <th>Carried Out By</th>
            <th>Verified By</th>
            <th>Authorised By</th>
            <th>Work Carried Out</th>
            <th>Work Verification</th>
            <th>Change Reason</th>
            <th>Perceived Impact</th>
            <th>Rollback Process</th>
        </tr>
    </thead>
';

echo '<tbody>';

foreach( $lines as $row) {
echo '<tr>';
echo '              
        <td>'.$row['start_date_time'].'</td>
        <td>'.$row['finish_date_time'].'</td>
        <td>'.$row['server_name'].'</td>
        <td>'.$row['carried_out_by'].'</td>
        <td>'.$row['verified_by'].'</td>
        <td>'.$row['authorised_by'].'</td> 
        <td>'.$row['work_carried_out'].'</td>
        <td>'.$row['work_verified'].'</td>
        <td>'.$row['change_reason'].'</td>
        <td>'.$row['perceived_impact'].'</td>
        <td>'.$row['rollback_process'].'</td>
';
echo '</tr>';}
$counter++;

echo '</tbody>';
echo '<tfoot>
        <tr>
            <th>Start Date/Time</th>
            <th>Finish Date/Time</th>
            <th>Server Name</th>
            <th>Carried Out By</th>
            <th>Verified By</th>
            <th>Authorised By</th>
            <th>Work Carried Out</th>
            <th>Work Verification</th>
            <th>Change Reason</th>
            <th>Perceived Impact</th>
            <th>Rollback Process</th>
        </tr>
    </tfoot>';           
echo '</table>';

Answer 1

如在您的代码中所示，我可以看到您正在使用jQuery ，可以使用一个插件，该插件将为您提供所需的确切功能，而您无需重新发明轮子。 我使用jQueries dynatable （ link ）插件，现在还不后悔！