如何在具有文件jquery.dataTables.js的jquery插件的同一列中对日期和字符串进行排序？

Question

I have a table containing "Date(in format M/d like 'Aug-23')" and string(like 'process' and 'completed') in same column. But the issue is that it is sorted alphabetically not sort according to Date. And structure of my file is:

<script type="text/javascript" language="javascript" src="../../table-sorting/js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="../../table-sorting/js/jquery.dataTables.js"></script>      
<script type="text/javascript" language="javascript" class="init">
    $(document).ready(function() {
        $('#sorting').dataTable( {
            "dom": '<"top"iflp<"clear">>rt<"bottom"iflp<"clear">>'
        } );
    } );
</script>

CPA Shipping

123 Aug-28

327 July-30

789 Process

if i sort shipping column then it give result like

Process

Aug-28

July-30

But i want result like:

Process

July-30

Aug-28

means firstly string sorting and after that date sorting

And these shipping values are coming from Mysql database

How I solve this issue?? Any Suggestion??

Answer 1

You have to write your dates in YYYYmmdd format so that alphabetical order matches chronological order.
But you want your dates to be displayed in a better-looking format (legit).

The solution is to have 2 columns: one with the good-looking date, one with the YYYYmmdd date. This one will be hidden, but will be used by dataTable sorting function.

<table id="sorting">
    <thead>
        <tr>
            <th>CPA</th>
            <th>Shipping</th>
            <th>Shipping (sorting format)</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>123</td>
            <td>Aug 28</td>
            <td>20150828</td>
        </tr>
        <tr>
            <td>327</td>
            <td>July 30</td>
            <td>20150730</td>
        </tr>
        <tr>
            <td>789</td>
            <td>Process</td>
            <td>0</td>
        </tr>
    </tbody>
</table>

Then, the Javascript :

$('#sorting').dataTable( {
    "aoColumns": [
        {"bSortable": true}, // First column: normal
        {"iDataSort": 2}, // Second column's sorting depends on third column (dataTable starts counting from 0, that's why third column is number 2)
        {"bVisible": false}, // Third column: hide it
    ]
});

You'll find more tips and examples in DataTables' documentation .