【发布时间】：2015-12-21 13:19:24
【问题描述】：
Tony，下面显示的更新代码，它不允许我对此发表评论，所以我编辑了我以前的帖子，下面的代码不会返回任何结果或错误，它只是重新加载页面。我可以在代码中看到的唯一问题是，我需要能够通过所有表头、评级、名称、区域等进行搜索。我有一个数据表脚本，可以将表实时更新为结果，但这并没有t 使用 PHP 表，我不确定我打算如何使它与数据表一起使用，因为我以前从未使用过它：
updated code:
<html>
<head>
<body>
<style>
table {
color: #333; /* Lighten up font color */
font-family: Helvetica, Arial, sans-serif; /* Nicer font */
width: 100%;
border-collapse:
collapse; border-spacing: 0;
}
td, th { border: 1px solid #00000; height: 30px; } /* Make cells a bit taller */
th {
background: #F3F3F3; /* Light grey background */
font-weight: bold; /* Make sure they're bold */
}
td {
background: #FAFAFA; /* Lighter grey background */
text-align: center; /* Center our text */
}
</style>
<script type="text/javascript" language="javascript" src="http://wcfcourier.com/app/special/data_tables/media/js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="http://wcfcourier.com/app/special/data_tables/media/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" charset="iso-8859-1">
$(document).ready( function(){
$('#five_year').dataTable({
"iDisplayLength": 300,
"aLengthMenu": [[5, 10, 25, 50, -1], [5, 10, 25, 50, "All"]]
});
$(document).ready(function() {
// Setup - add a text input to each footer cell
$('#five-year tfoot th').each( function () {
var title = $('#five_year thead th').eq( $(this).index() ).text();
$(this).html( '<input type="text" placeholder="Search '+title+'" />' );
} );
// DataTable
var table = $('#five_year').DataTable();
// Apply the search
table.columns().eq( 0 ).each( function ( colIdx ) {
$( 'input', table.column( colIdx ).footer() ).on( 'keyup change', function () {
table
.column( colIdx )
.search( this.value )
.draw();
} );
} );
});
} );
$().ready(function() {
var regEx = /(\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*)/;
$("table td").filter(function() {
return $(this).html().match(regEx);
}).each(function() {
$(this).html($(this).html().replace(regEx, "<a href=\"mailto:$1\">$1</a>"));
});
});
</script>
<form action="index.php" method="post">
<input type="text" name="search" placeholder="Search...." />
<input type="submit" value=">>" />
</form>
<?php
$con=mysqli_connect("localhost","root","windows11","main");
// Check connection
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$result = mysqli_query($con,"SELECT * FROM `users` ORDER BY ID asc, Name asc") or die(mysqli_error($con));
echo
"<table border=1>
<tr>
<th>Rating</th>
<th>Name</th>
<th>Discipline</th>
<th>Rate</th>
<th>Area</th>
<th>Number</th>
<th>Email</th>
</tr>";
while($row = mysqli_fetch_array($result)){
echo "<tr>";
echo "<td>" . $row['Rating'] . "</td>";
echo "<td>" . $row['Name'] . "</td>";
echo "<td>" . $row['Discipline'] . "</td>";
echo "<td>" . $row['Rate'] . "</td>";
echo "<td>" . $row['Area'] . "</td>";
echo "<td>" . $row['Number'] . "</td>";
echo "<td>" . $row['Email'] . "</td>";
echo "</tr>";
echo "</form>";
}
// If there is a search variable try to search database
if( isset( $_POST['search'] ) ) {
$searchq = $_POST['search'];
$searchq = preg_replace( "#[^0-9a-z]#i", "", $searchq );
$sql = "SELECT * FROM `users` WHERE `Rating` LIKE '%$searchq%';";
if ( $result = mysqli_query( $conn, $sql ) ) {
if ( mysqli_num_rows( $result ) > 0 ) {
echo '
<table class="hoverTable">
<tr>
<th>Rating</th>
<th>Name</th>
<th>Discipline</th>
<th>Rate</th>
<th>Area</th>
<th>Number</th>
<th>Email</th>
</tr>';
while( $row = $result->fetch_assoc() ) {
echo "
<tr>
<td>".$row["rating"]."</td>
<td>".$row["name"]."</td>
<td>".$row["discipline"]."</td>
<td>".$row["rate"]."</td>
<td>".$row["area"]."</td>
<td>".$row["number"]."</td>
<td>".$row["email"]."</td>
</tr>";
}
echo '
</table>';
} else {
$message = "0 results";
}
}
mysqli_free_result( $result );
}
$conn->close();
?>
</body>
</head>
</html>
这也是与 HTML 表格一起使用的 Datatables 脚本（所有数据都使用 HTML 拆分到表格行中，而不是由 PHP 脚本回显：
<script type="text/javascript" language="javascript" src="http://wcfcourier.com/app/special/data_tables/media/js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="http://wcfcourier.com/app/special/data_tables/media/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" charset="iso-8859-1">
$(document).ready( function(){
$('#five_year').dataTable({
"iDisplayLength": 300,
"aLengthMenu": [[5, 10, 25, 50, -1], [5, 10, 25, 50, "All"]]
});
$(document).ready(function() {
// Setup - add a text input to each footer cell
$('#five-year tfoot th').each( function () {
var title = $('#five_year thead th').eq( $(this).index() ).text();
$(this).html( '<input type="text" placeholder="Search '+title+'" />' );
} );
// DataTable
var table = $('#five_year').DataTable();
// Apply the search
table.columns().eq( 0 ).each( function ( colIdx ) {
$( 'input', table.column( colIdx ).footer() ).on( 'keyup change', function () {
table
.column( colIdx )
.search( this.value )
.draw();
} );
} );
});
} );
$().ready(function() {
var regEx = /(\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*)/;
$("table td").filter(function() {
return $(this).html().match(regEx);
}).each(function() {
$(this).html($(this).html().replace(regEx, "<a href=\"mailto:$1\">$1</a>"));
});
});
</script>
我可以看到这个数据表代码需要一个表 ID 来引用，但我无法为 PHP 代码分配一个表 ID，因为它只会在我尝试时使脚本和页面崩溃。
感谢您的帮助。
【问题讨论】：
-
是的，这是可能的，检查datatables它有你需要做的所有情报..
-
虽然，根据数据量，您可能希望设置一个 MyISAM 表，其中包含存储在那里的数据类型的特定字段，并链接到原始记录以提高速度。假设您想在数百万条记录中异步搜索任何内容。
-
我查看了数据表，但看不到如何用我的表实现这一点。在原始 HTML 表上，我能够包含一个表 id，然后 jscript 可以使用它，但是这样，如果我在任何地方添加表 id，它就不起作用并且脚本崩溃。