当我添加通知功能时，我的搜索功能将不起作用
问题描述：
这是我的搜索代码，它没有添加通知功能时工作正常。但是，一旦我添加“通知”功能，它不会使这个“搜索”功能的工作。请帮助当我添加通知功能时，我的搜索功能将不起作用
编辑：我添加了关于如何显示表格的数据，我有搜索功能的代码。
$(document).ready(function(){
$("#search").keyup(function(){
if($(this).val() != "")
{
$("#table tbody>tr").hide();
$("#table td:contains-ci('" + $(this).val() + "')").parent("tr").show();
}
else
{
$("#table tbody>tr").show();
}
});
});
$.extend($.expr[":"],
{
"contains-ci": function(elem, i, match, array)
{
return (elem.textContent || elem.innerText || $(elem).text() || "").toLowerCase().indexOf((match[3] || "").toLowerCase()) >= 0;
}
});
那么这就是它的输入
<input type="search" id="search" class = "search" name = "search" placeholder="Search...">
的HTML代码，那么这是我如何填充表在我的页面
<label id = "title">Manage Licenses</label><br/>
</div>
</div>
<div class="row" style = "padding-bottom : 20px;">
<?php
$qry = $con->prepare("SELECT * FROM tbllicense, tblrequests WHERE ExpirationDate < DATE_ADD(NOW(), INTERVAL 2 MONTH) AND
tblrequests.ID = Request_ID AND tblrequests.Status = 'accepted' ORDER BY ExpirationDate");
$qry->execute();
$rows = $qry->fetchAll(PDO::FETCH_ASSOC);
$expiredcount = 0;
?>
<table class = "table" id = "table">
<thead>
<th>Record ID</th>
<th>Name</th>
<th>Email</th>
<th>License Type</th>
<th>Expiration</th>
<th>Options</th>
<tbody>
<?php
foreach ($rows as $row) {
?>
<tr>
<td><?= $row["Request_ID"] ?></td>
<td><?= $row["txtFName"] . " " . $row["txtSurname"] ?></td>
<td><?= $row["txtEmail"] ?></td>
<td><?= $row["txtLicense"] ?></td>
<td><?= date("M d, Y", strtotime($row["ExpirationDate"])) ?></td>
<td><input type = "button" class = "btnAccept" value = "Renew" onclick = "renew(<?= $row["Request_ID"] ?>)"/></td>
</tr>
<?php
}
?>
</thead>
</tbody>
</table>
</div>
当我添加了该功能（代码通知）。搜索将无法正常工作，当我在搜索表单中输入一个输入时，结果将只是空白。
<li style = "float:right">
<div style = "float:right">
<?php
$qry = $con->prepare("SELECT * FROM tbllicense, tblrequests WHERE ExpirationDate < DATE_ADD(NOW(), INTERVAL 2 MONTH) AND
tblrequests.ID = Request_ID AND tblrequests.Status = 'accepted'
UNION
SELECT * FROM tblvisa, tblrequests WHERE ExpirationDate < DATE_ADD(NOW(), INTERVAL 2 MONTH) AND
tblrequests.ID = Request_ID AND tblrequests.Status = 'accepted' ORDER BY ExpirationDate"
);
$qry->execute();
$rows = $qry->fetchAll(PDO::FETCH_ASSOC);
if ($qry->rowCount()) {
echo '<img width=15 height=13 src="img/alert.png" />';
}
?>
</div>
<a href='#' id = "notificationLink" class = "notificationLink" title = "Notification"><img src="img/notification.png"
style = " position : relative; width : 15px; height : 13px;"/></a>
<div id="notificationContainer">
<div id="notificationTitle">Notifications</div>
<div id="notificationBody" class="scrollbar2">
<?php
$qry = $con->prepare("SELECT * FROM tbllicense, tblrequests WHERE ExpirationDate < DATE_ADD(NOW(), INTERVAL 2 MONTH) AND
tblrequests.ID = Request_ID AND tblrequests.Status = 'accepted' ORDER BY ExpirationDate");
$qry->execute();
$rows = $qry->fetchAll(PDO::FETCH_ASSOC);
$expiredcount = 0;
?>
<table class = "table" id = "table">
<thead>
<?php
foreach ($rows as $row) {
$expiredcount++;
?>
<tr>
<td><a href='_admin_business_license.php' style = "color: white;" class = "link">The Request <?= $row["Request_ID"] ?> is expired or about to expire on
<?= date("M d, Y", strtotime($row["ExpirationDate"])) ?> from the Business License</a></td>
</tr>
<?php
}
?>
<?php
$qry = $con->prepare("SELECT * FROM tblvisa, tblrequests WHERE ExpirationDate < DATE_ADD(NOW(), INTERVAL 2 MONTH) AND
tblrequests.ID = Request_ID AND tblrequests.Status = 'accepted' ORDER BY ExpirationDate");
$qry->execute();
$rows = $qry->fetchAll(PDO::FETCH_ASSOC);
$expiredcount1 = 0;
?>
<?php
foreach ($rows as $row) {
$expiredcount1++;
?>
<tr>
<td><a href='_admin_visa.php' style = "color: white" class = "link">The Request <?= $row["Request_ID"] ?> is expired or about to expire on
<?= date("M d, Y", strtotime($row["ExpirationDate"])) ?> from the Visa</a></td>
</tr>
<?php
}
?>
</thead>
</table>
</div>
<div id="notificationFooter"><a href="notification.php">See All</a></div>
</div>
</li>
答
非常感谢那些谁回答我的问题:)
我发现为什么它留下一个空白页面的原因是因为即时通讯搜索相同的“表”通知和管理页面。
我改变了导致与搜索代码冲突的“表”的ID。
$("#search").keyup(function(){
if($(this).val() != "")
{
$("#searchtable tbody>tr").hide();
$("#searchtable td:contains-ci('" + $(this).val() + "')").parent("tr").show();
}
else
{
$("#table tbody>tr").show();
}
});
});
这是该表的新ID，搜索必须通过
<table class = "table" id = "searchtable">
<thead>
<th>Record ID</th>
<th>Name</th>
<th>Email</th>
<th>License Type</th>
<th>Expiration</th>
<th>Options</th>
<tbody>
<?php
foreach ($rows as $row) {
?>
<tr>
<td><?= $row["Request_ID"] ?></td>
<td><?= $row["txtFName"] . " " . $row["txtSurname"] ?></td>
<td><?= $row["txtEmail"] ?></td>
<td><?= $row["txtLicense"] ?></td>
<td><?= date("M d, Y", strtotime($row["ExpirationDate"])) ?></td>
<td><input type = "button" class = "btnAccept" value = "Renew" onclick = "renew(<?= $row["Request_ID"] ?>)"/></td>
</tr>
<?php
}
?>
</thead>
</tbody>
</table>
答
您的搜索功能是在tbody中搜索，但您的代码中只有一个。
除非有更多的代码，我们没有看到（我怀疑，因为你关闭表），那么我认为这是问题
变化
$("#table tbody>tr").hide();
到
$("#table thead>tr").hide();
和
$("#table tbody>tr").show();
到
$("#table thead>tr").show();
您还需要做到以下几点
$(document).ready(function(){
$("#search").keyup(function(){
var txtVal = $(this).val();
if(txtVal != "")
{
$("#table > thead > tr").show();
$.each($("#table > thead > tr"), function (i, o) {
var match = $("td:contains-ci('" + txtVal + "')",this)
if (match.length > 0) $(this).show();
else $(this).hide();
});
}
else
{
$("#table thead > tr").show();
}
});
});
+0
我试过你的代码，结果是：页面中的数据仍然显示，但没有筛选出无关的数据 – RufusWilde
+0
它确实有助于阻止代码离开页面空白一旦我输入，现在的问题是：它返回所有的数据 – RufusWilde
+0
@RufusWilde检查我更新的答案 –
运行你检查控制台错误？ –
是的，我没有检查控制台错误，但我没有发现任何与它有关的错误。 – RufusWilde
只是运行你的代码，并检查你的页面源代码，有id“搜索”只有一次在你的HTML？ –