jquery排序不工作

在我projecy我嘗試排序數據上的表頭被按下。我的html代碼是。jquery排序不工作

<table id="mytable"> 
     <thead> 
     <tr> 
      <th id="eid">Employee ID</th> 
      <th id="ename">Employee Name</th> 
      <th id="econtact">Employee Contact</th> 
      <th id="esalary">Employee Salary</th> 
      <th id="ephone">Employee Phone</th> 
      <th id="ecity">Employee City</th> 
      <th id="edate">Join Date</th> 
      <th>Action</th> 
     </tr> 
     </thead> 
     <tbody> 
<?php 
require 'config.php'; 
ini_set('display_errors', 1); ini_set('display_startup_errors', 1); 
error_reporting(E_ALL); 
$query = mysqli_query($conn, "SELECT * FROM emp"); 
while($row = mysqli_fetch_array($query)) { 
?> 
     <tr> 
      <td align="center"><?php echo $row['emp_id']; ?></td> 
      <td align="center"><?php echo $row['emp_name']; ?></td> 
      <td align="center"><?php echo $row['emp_contact']; ?></td> 
      <td align="center"><?php echo $row['emp_salary']; ?></td> 
      <td align="center"><?php echo $row['emp_phone']; ?></td> 
      <td align="center"><?php echo $row['emp_city']; ?></td> 
      <td align="center"><?php echo $row['join_date']; ?></td> 
      <td align="center"><a href="update.php?emp_id=<?php echo $row['emp_id'];?>">Update</a> | <a href="delete.php?emp_id=<?php echo $row['emp_id'];?>" class="del">Delete</a></td> 
     </tr> 
<?php 
} 
?> 
    </tbody> 
</table>

和我的jQuery代碼是。

<script type="text/javascript"> 
function sortTable(f,n){ 
var rows = $('#mytable tbody tr').get(); 

rows.sort(function(a, b) { 

    var A = getVal(a); 
    var B = getVal(b); 

    if(A < B) { 
     return -1*f; 
    } 
    if(A > B) { 
     return 1*f; 
    } 
    return 0; 
}); 

function getVal(elm){ 
    var v = $(elm).children('td').eq(n).text().toUpperCase(); 
    if($.isNumeric(v)){ 
     v = parseInt(v,10); 
    } 
    return v; 
} 

$.each(rows, function(index, row) { 
    $('#mytable').children('tbody').append(row); 
}); 
} 
var f_edate = 1; 
var f_eid = 1; 
var f_ename = 1; 
var f_econtact = 1; 
var f_esalary = 1; 
var f_ephone = 1; 
var f_ecity = 1; 

$("#eid").click(function(){ 
f_eid *= -1; 
var n = $(this).prevAll().length; 
sortTable(f_eid,n); 
}); 
$("#ename").click(function(){ 
f_ename *= -1; 
var n = $(this).prevAll().length; 
sortTable(f_ename,n); 
}); 
$("#econtact").click(function(){ 
f_econtact *= -1; 
var n = $(this).prevAll().length; 
sortTable(f_econtact,n); 
}); 
$("#esalary").click(function(){ 
f_esalary *= -1; 
var n = $(this).prevAll().length; 
sortTable(f_esalary,n); 
}); 
$("#ephone").click(function(){ 
f_ephone *= -1; 
var n = $(this).prevAll().length; 
sortTable(f_ephone,n); 
}); 
$("#ecity").click(function(){ 
f_ecity *= -1; 
var n = $(this).prevAll().length; 
sortTable(f_ecity,n); 
}); 
$("#edate").click(function(){ 
f_edate *= -1; 
var n = $(this).prevAll().length; 
sortTable(f_edate,n); 
}); 
</script>

這是我的CSS

/* CSS Document */ 
table{ 
width:100%; 
border:1px solid black; 
} 
th:hover{ 
cursor:pointer; 
background:#AAA; 

}

我可以點擊表頭，但記錄被留像以前一樣。他們沒有排序。請幫幫我。

來源

2016-04-27 Divyesh Jesadiya

你會得到任何JavaScript錯誤，你可以通過鉻的檢查頁面找到？ – lifejuggler

index1.php：45 Uncaught ReferenceError：$未定義。在$（「＃eid」）。click（function（）{on line 45. –

您可能應該在您的頁面中包含jQuery –

-1

使用DataTable jQuery插件具有的排序功能，也有functionality.see他們page.Page鏈接的例子中，搜索是在下面

https://www.datatables.net/

希望，將解決你的問題

來源

2016-04-27 15:39:48

jquery排序不工作

回答

相關問題