Question

我在twitter-bootstrap中使用tablesorter。这样使用时效果很好：

        <div class="table-responsive">
              <table class="table table-bordered table-hover table-striped tablesorter">
                <thead>
                <tr>
                    <th>Brugernavn <i class="fa fa-sort"></i></th>
                    <th>Rolle <i class="fa fa-sort"></i></th>
                    <th>Oprettet <i class="fa fa-sort"></i></th>
                  </tr>
                </thead>
                     <tbody>
                  <tr>
                    <td>3326</td>
                    <td>10/21/2013</td>
                    <td>3:29 PM</td>
                  </tr>
                  <tr>
                    <td>3325</td>
                    <td>10/21/2013</td>
                    <td>3:20 PM</td>
                  </tr>
                  <tr>
                    <td>3324</td>
                    <td>10/21/2013</td>
                    <td>3:03 PM</td>
                  </tr>
                  <tr>
                    <td>3323</td>
                    <td>10/21/2013</td>
                    <td>3:00 PM</td>
                  </tr>
                  <tr>
                    <td>3322</td>
                    <td>10/21/2013</td>
                    <td>2:49 PM</td>

                  </tr>
                </tbody>


              </table>

这有效，我的控制台显示：

    event.returnValue is deprecated. Please use the standard event.preventDefault() instead. jquery-1.10.2.js:5
Evaling expression:var sortWrapper = function(a,b) {var e0 = (a[0] === null && b[0] === null) ? 0 :(a[0] === null ? Number.POSITIVE_INFINITY : (b[0] === null ? Number.NEGATIVE_INFINITY : a[0] - b[0]));if(e0) { return e0; } else { return a[4]-b[4];}; return 0; }; ,0ms jquery.tablesorter.js:147
Sorting on 0,0 and dir 0 time:,1ms jquery.tablesorter.js:147
Rebuilt table:,0ms

但是当我使用来自我的Mysql数据库并循环的数据时，它不起作用。

我这样做：

               <table class="table table-bordered table-hover table-striped tablesorter">
                <thead>
                <tr>
                    <th>Brugernavn <i class="fa fa-sort"></i></th>
                    <th>Rolle <i class="fa fa-sort"></i></th>
                    <th>Oprettet <i class="fa fa-sort"></i></th>
                  </tr>
                </thead>
                <?php 
                foreach ($users as $key => $value) {
                    ?>
                    <tbody>
                    <tr  data-id="<?php echo $value['user'];?>" data-toggle="modal" data-target="#edit" class="open-edit">
                    <td data-id="username" class="username-edit"><?php echo $value['user'];?></td>
                    <td class="username-edit" data-id="role"><?php echo $value['role'];?></td>
                    <td><?php echo $value['lastlogin'];?></td>
                    </tbody>
                    <?php 
                }

                 ?>

              </table>

数据显示正确但是当我点击排序按钮时没有任何事情发生。控制台显示：

event.returnValue is deprecated. Please use the standard event.preventDefault() instead. jquery-1.10.2.js:5
Evaling expression:var sortWrapper = function(a,b) {var e0 = (a[0] == b[0] ? 0 : (a[0] === null ? Number.POSITIVE_INFINITY : (b[0] === null ? Number.NEGATIVE_INFINITY : (a[0] < b[0]) ? -1 : 1 )));if(e0) { return e0; } else { return a[3]-b[3];}; return 0; }; ,0ms jquery.tablesorter.js:147
Sorting on 0,0 and dir 0 time:,1ms jquery.tablesorter.js:147
Rebuilt table:,0ms

任何人都可以帮助我理解为什么在使用我的php循环时sort函数不起作用？

Answer 1

我解决了。我需要将<tbody></tbody>保留在循环之外：

  <div class="table-responsive">
          <table class="table table-bordered table-hover table-striped tablesorter">
            <thead>
            <tr>
                <th>Brugernavn <i class="fa fa-sort"></i></th>
                <th>Rolle <i class="fa fa-sort"></i></th>
                <th>Oprettet <i class="fa fa-sort"></i></th>
              </tr>
            </thead>
                <tbody>
            <?php 
            foreach ($users as $key => $value) {
                ?>
                <tr  data-id="<?php echo $value['user'];?>" data-toggle="modal" data-target="#edit" class="open-edit">
                <td data-id="username" class="username-edit"><?php echo $value['user'];?></td>
                <td class="username-edit" data-id="role"><?php echo $value['role'];?></td>
                <td><?php echo $value['lastlogin'];?></td>
                <?php 
            }

             ?>
                </tbody>

          </table>

php echo输出上的Bootstrap tablesorter

1 个答案: