Javascript Datatables Asorting未按正确的列进行排序

我正在试图得到一个名册页面，以便按球员编号进行排序。我插入了aaSorting并告诉它对第一列（数字）进行排序，但它正在对第二列（名称）进行排序。有人能告诉我我做错了什么吗

<style type="text/css">table.sortable th:not(.sorttable_sorted):not(.sorttable_sorted_reverse):not(.sorttable_nosort):after { 
    content: " \25B4\25BE" }
</style>

<!--<script src="/jscript/sorttable.js"></script>
--><script type="text/javascript">
  $(document).ready(function() {
    $(".table-sortable").dataTable({
        aaSorting: [[0, 'asc']],
        bPaginate: false,
        bFilter: false,
        bInfo: false,
        bSortable: true,
        bRetrieve: true,
        aoColumnDefs: [
            { "aTargets": [ 0 ], "bSortable": true },
            { "aTargets": [ 1 ], "bSortable": true },
            { "aTargets": [ 2 ], "bSortable": true },
            { "aTargets": [ 3 ], "bSortable": true }
        ]
    }); 
});</script>





<table width="100%" cellpadding="2" cellspacing="2" border="1" class="sortable" id="roster" style="border-bottom:1">
    <thead>
        <tr>
            <?php if( ! empty($vars['sport']->field_sport_show_number) && 1 == $vars['sport']->field_sport_show_number['und'][0]['value'] ): ?>
                <th class="style4, sortBy" style="width: 14px;"  data-sortType="numeric" id="number"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">#</span></th>
            <?php endif; ?>

            <th class="style4" style="width: 14px;" ><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Name</span></th>

            <?php if( ! empty($vars['sport']->field_show_class) && 1 == $vars['sport']->field_show_class['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Class</span></th>
            <?php endif; ?>

            <?php if( ! empty($vars['sport']->field_show_position) && 1 == $vars['sport']->field_show_position['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Position</span></th>
            <?php endif; ?>

            <?php if( ! empty($vars['sport']->field_show_height) && 1 == $vars['sport']->field_show_height['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Height</span></th>
            <?php endif; ?>

            <?php if( ! empty($vars['sport']->field_show_weight) && 1 == $vars['sport']->field_show_weight['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Weight</span></th>
            <?php endif; ?>

            <?php if( ! empty($vars['sport']->field_show_b_t) && 1 == $vars['sport']->field_show_b_t['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">B/T</span></th>
            <?php endif; ?>

            <?php if( ! empty($vars['sport']->field_show_hometown) && 1 == $vars['sport']->field_show_hometown['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Hometown</span></th>
            <?php endif; ?>

            <?php if( ! empty($vars['sport']->field_show_highschool) && 1 == $vars['sport']->field_show_highschool['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Highschool</span></th>
            <?php endif; ?>
        </tr>
    </thead>
    <tbody>
        <?php $i=0; foreach($vars['athletes'] as $athlete): ?>
            <tr style="border:1; border-bottom:1px;">
                <?php if( ! empty($vars['sport']->field_sport_show_number) && 1 == $vars['sport']->field_sport_show_number['und'][0]['value'] ): ?>
                    <td class="style4"  style="vertical-align: top; width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">
                        <?php echo $athlete->field_athleets_number['und'][0]['value'] ?>
                    </span></td>
                <?php endif; ?>

                <td class="style4" style="vertical-align: top; width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">
                    <a href="#" href="" rel="imgtip[<?php echo $i; ?>] "><?php echo $athlete->title ?>
                </span></td>

                <?php if( ! empty($vars['sport']->field_show_class) && 1 == $vars['sport']->field_show_class['und'][0]['value'] ): ?>
                    <td class="style4" style="vertical-align: top; width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">
                        <?php echo ( $athlete->field_class['und'][0]['value'] ) ? $athlete->field_class['und'][0]['value'] : 'No Data' ?>
                    </span></td>
                <?php endif; ?>

                <?php if( ! empty($vars['sport']->field_show_position) && 1 == $vars['sport']->field_show_position['und'][0]['value'] ): ?>
                    <td class="style4" style="vertical-align: top; width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">
                        <?php echo ( $athlete->field_position['und'][0]['value'] ) ? $athlete->field_position['und'][0]['value'] : 'No Data' ?>
                    </span></td>
                <?php endif; ?>

                <?php if( ! empty($vars['sport']->field_show_height) && 1 == $vars['sport']->field_show_height['und'][0]['value'] ): ?>
                    <td class="style4" style="vertical-align: top; width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">
                        <?php echo ( $athlete->field_height['und'][0]['value'] ) ? $athlete->field_height['und'][0]['value'] : 'No Data' ?>
                    </span></td>
                <?php endif; ?>

                <?php if( ! empty($vars['sport']->field_show_weight) && 1 == $vars['sport']->field_show_weight['und'][0]['value'] ): ?>
                    <td class="style4" style="vertical-align: top; width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">
                        <?php echo ( $athlete->field_weight['und'][0]['value'] ) ? $athlete->field_weight['und'][0]['value'] : 'No Data' ?>
                    </span></td>
                <?php endif; ?>

                <?php if( ! empty($vars['sport']->field_show_b_t) && 1 == $vars['sport']->field_show_b_t['und'][0]['value'] ): ?>
                    <td class="style4" style="vertical-align: top; width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">
                        <?php echo ( $athlete->field_b_t['und'][0]['value'] ) ? $athlete->field_b_t['und'][0]['value'] : 'No Data' ?>
                    </span></td>
                <?php endif; ?>

                <?php if( ! empty($vars['sport']->field_show_hometown) && 1 == $vars['sport']->field_show_hometown['und'][0]['value'] ): ?>
                    <td class="style4" style="vertical-align: top; width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">
                        <?php echo ( $athlete->field_hometown['und'][0]['value'] ) ? $athlete->field_hometown['und'][0]['value'] : 'No Data' ?>
                    </span></td>
                <?php endif; ?>

                <?php if( ! empty($vars['sport']->field_show_highschool) && 1 == $vars['sport']->field_show_highschool['und'][0]['value'] ): ?>
                    <td class="style4" style="vertical-align: top; width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">
                        <?php echo ( $athlete->field_high_school_state['und'][0]['value'] ) ? $athlete->field_high_school_state['und'][0]['value'] : 'No Data' ?>
                    </span></td>
                <?php endif; ?>
            </tr>
        <?php $i++; endforeach; ?>
    </tbody>
    <tfoot>
        <tr>
            <?php if( ! empty($vars['sport']->field_sport_show_number) && 1 == $vars['sport']->field_sport_show_number['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">#</span></th>
            <?php endif; ?>

            <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Name</span></th>

            <?php if( ! empty($vars['sport']->field_show_class) && 1 == $vars['sport']->field_show_class['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Class</span></th>
            <?php endif; ?>

            <?php if( ! empty($vars['sport']->field_show_position) && 1 == $vars['sport']->field_show_position['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Position</span></th>
            <?php endif; ?>

            <?php if( ! empty($vars['sport']->field_show_height) && 1 == $vars['sport']->field_show_height['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Height</span></th>
            <?php endif; ?>

            <?php if( ! empty($vars['sport']->field_show_weight) && 1 == $vars['sport']->field_show_weight['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Weight</span></th>
            <?php endif; ?>

            <?php if( ! empty($vars['sport']->field_show_b_t) && 1 == $vars['sport']->field_show_b_t['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">B/T</span></th>
            <?php endif; ?>

            <?php if( ! empty($vars['sport']->field_show_hometown) && 1 == $vars['sport']->field_show_hometown['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Hometown</span></th>
            <?php endif; ?>

            <?php if( ! empty($vars['sport']->field_show_highschool) && 1 == $vars['sport']->field_show_highschool['und'][0]['value'] ): ?>
                <th class="style4" style="width: 14px;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Highschool</span></th>
            <?php endif; ?>
        </tr>
    </tfoot>
</table>
<script type="text/javascript">
var st1 = new SortableTable(document.getElementById("roster"));
</script>

table.sortable th:not（.sorttable_sorted）：not（.sorttable_sorted_reverse）：not（.sorttable_nosort）：在{
内容：“\25B4\25BE”}
$（文档）.ready（函数（）{
$（“.table sortable”）.dataTable({
A排序：[[0，'asc']]，
bPaginate:false，
过滤：错，
宾福：错，
可接受的：是的，
布雷特里夫：是的，
aoColumnDefs：[
{“aTargets”：[0]，“bSortable”：true}，
{“aTargets”：[1]，“bSortable”：true}，
{“aTargets”：[2]，“bSortable”：true}，
{“aTargets”：[3]，“bSortable”：true}
]
}); 
});
#
名称
等级
位置
高度
重量
B/T
家乡
中学
所以
属于
6'0                 
170
R/R
伊利诺伊州圣约瑟夫
15
所以
属于
6'1                 
170
信用证
伊利诺伊州丹维尔
#
名称
等级
位置
高度
重量
B/T
家乡

在标题中添加了以下内容

<link href="/jscript/jquery.dataTables.css" rel="stylesheet" type="text/css" />

        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script src="/jscript/jquery.dataTables.js"></script>

<style type="text/css">table.sortable th:not(.sorttable_sorted):not(.sorttable_sorted_reverse):not(.sorttable_nosort):after { 
    content: " \25B4\25BE" }
</style>

<!--<script src="/jscript/sorttable.js"></script>-->
<script type="text/javascript">
  $(document).ready( function () {
  var coluna = $('#roster thead th.sorting_col').index('#roster thead th');
  var ordem  = $('#roster thead th.sorting_col').attr('data-sort');
  if(coluna == -1){coluna = 0;ordem  = 'asc';}
  $('#roster').DataTable({
    "paging":   false,
    "aaSorting": [[coluna,ordem,'number']]
  });
});</script>

table.sortable th:not（.sorttable_sorted）：not（.sorttable_sorted_reverse）：not（.sorttable_nosort）：在{
内容：“\25B4\25BE”}
$（文档）.ready（函数（）{
var coluna=$（'花名册主题排序'）.索引（'花名册主题排序'）；
var ordem=$（'#花名册thead th.sorting_col'）.attr（'data-sort'）；
如果（coluna==-1）{coluna=0；ordem='asc'；}
$（“#花名册”）。数据表({
“分页”：false，
“aaSorting”：[[coluna，ordem，'number']]
});
});

---

稍微调整了一下javascript，现在它工作得很好。

既然您告诉我，您正在使用datatables 1.10.4，请仔细检查文档

|

如您所见，1.10参数被重写，并从1.9更改。您使用的是1.10版本的DataTables插件，但使用的是1.9版本参数

$(document).ready(function() {
    $('#roster').dataTable({
        'order': [[ 0, 'asc' ]]
    });
});

---

状态保存设置

需要注意的一点是

stateSave

设置。如果这是真的，则订单将保存到localStorage。因此，即使您更改了javascript，页面重新加载也会用旧的

顺序替换新的

清除保存的订单设置

要清除旧设置，您可以手动从localStorage中删除条目，或者单击显示的
reset
按钮
 您使用的是哪个版本的datatables？@Justinas我怎么知道？您能提供输出html（在浏览器中获取）而不是php源代码吗？请查看.js文件的头部以获取版本。@skobaljic添加了输出（减去一些行的空间）
$(document).ready(function() {
    $('#roster').dataTable({
        'order': [[ 0, 'asc' ]]
    });
});