使用日期和图像对两个数据表列进行排序

Question

我使用 datatables 并使用插件 datetime-de.js 按德语日期对两列进行排序。如果没有给出该记录的日期，我会在一列中的单元格中插入一张图片。当我对一列使用日期格式时，排序有效。但是对于两个排序中断（点击排序第二列）如何通过忽略带有图片的行来对两列进行排序？

                        $(document).ready(function() {

                          $('#liste').DataTable({  

                                    dom: 'Bfrtip',                            

                                    fixedHeader: {
                                                    header: true,
                                                    footer: true
                                                },
                                    
                                    order: [[ 0, 'asc' ]],

                                    paging: false,

                                    columnDefs: [{ type: 'de_date', targets: 1,
                                                type: 'de_date', targets: 0},
                                                ],

                                    language: { 'decimal': ',',
                                                'thousands': '.',
                                                'sEmptyTable': 'Keine Daten in der Tabelle vorhanden',
                                                'sInfo': '_START_ bis _END_ von _TOTAL_ Einträgen',
                                                'sInfoEmpty': '0 bis 0 von 0 Einträgen',
                                                'sInfoFiltered': '(gefiltert von _MAX_ Einträgen)',
                                                'sInfoPostFix': '',
                                                'sInfoThousands': '.',
                                                'sLengthMenu': '_MENU_ Einträge anzeigen',
                                                'sLoadingRecords': 'Wird geladen...',
                                                'sProcessing': 'Bitte warten...',
                                                'sSearch': 'Suchen',
                                                'sZeroRecords': 'Keine Einträge vorhanden.',
                                                'oPaginate': {
                                                'sFirst': 'Erste',
                                                'sPrevious': 'Zurück',
                                                'sNext': 'Nächste',
                                                'sLast': 'Letzte'
                                                },
                                                'oAria': {
                                                'sSortAscending': ': aktivieren, um Spalte aufsteigend zu sortieren',
                                                'sSortDescending': ': aktivieren, um Spalte absteigend zu sortieren'
                                                }
                                                
                                             }, 
                              
                                            
    });
                        });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="//cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>
<link href="//cdn.datatables.net/1.11.5/css/jquery.dataTables.min.css" rel="stylesheet"/>
<script src="//cdn.datatables.net/plug-ins/1.11.5/sorting/date-de.js"></script>

<table id="liste" class="display" cellspacing="0" style="width:100%">
<thead><tr><th align="center">Column1</th><th>ColumnDatePicture</th></tr></thead>
<tbody>
<tr>
<td>14.01.2022</td><td align="center">29.03.2022</td>
</tr>
<tr>
<td>14.01.2022</td><td align="center"><img src="https://upload.wikimedia.org/wikipedia/commons/7/79/Face-smile.svg" title="smile"></td>
</tr>
<tr>
<td>15.01.2022</td><td align="center">27.03.2022</td>
</tr>
<tr>
<td>16.01.2022</td><td align="center"><img src="https://upload.wikimedia.org/wikipedia/commons/7/79/Face-smile.svg" title="smile"></td>
</tr>
<tr>
<td>14.01.2022</td><td align="center">27.04.2022</td>
</tr>

<td>14.07.2022</td><td align="center">27.05.2022</td>
</tr>
<td>14.06.2022</td><td align="center">27.04.2022</td>
</tr>
<td>14.05.2022</td><td align="center">26.04.2022</td>
</tr>
<td>14.04.2022</td><td align="center">24.05.2022</td>
</tr>
<td>14.03.2022</td><td align="center">17.04.2022</td>
</tr>
<td>14.02.2022</td><td align="center">13.04.2022</td>
</tr>
<tr>
<td>14.01.2022</td><td align="center"><img src="https://upload.wikimedia.org/wikipedia/commons/7/79/Face-smile.svg" title="smile"></td>
</tr>
</tbody>

<tfoot><tr><th align="center">Column1</th><th>ColumnDatePicture</th></tr></tfoot>
</table>

Answer 1

在 table 单元格上使用 data-sort 或 data-order 属性。 Link to documentation

<tr>
    <td>14.02.2022</td>
    <td align="center" data-order="13.04.2022">13.04.2022</td>
</tr>
<tr>
    <td>14.01.2022</td>
    <td align="center" data-order=""><img src="https://upload.wikimedia.org/wikipedia/commons/7/79/Face-smile.svg" title="smile"></td>
</tr>

使用日期和图像对两个数据表列进行排序

Sort two datatables columns with date and images

datatables