表单.keyup(function()jQuery即时搜索

时间:2011-12-03 19:33:59

标签: php jquery html

我正在尝试显示位于我页面上的表单的即时搜索结果。但是我没有从查询中得到任何结果。我不确定这是不是因为我写的代码没有正确调用表单,或者如果在表单中使用onblur / onfocus值改变了jQuery的编写方式。正如您将看到php解决onblue / onfocus值,以确保查询中不包含默认文本。有什么想法吗?

[HTML]

<script type="text/javascript" src="js/BookSearch.js"></script>
<form action="php/DisplayBooks.php" method="POST" class="searchbooks">
<table width="620" border="0">
<tbody>
<tr>
<td width="114" align="right">By Course :</td>
<td width="144"><input type="text" id="Subject" value="Subject..." onblur="if (this.value == ''){this.value = 'Subject...'; }" onfocus="if (this.value == 'Subject...') {this.value = ''; }" /></td>
<td width="348"><input type="text" id="Course" value="Number..." onblur="if (this.value == ''){this.value = 'Number...'; }" onfocus="if (this.value == 'Number...') {this.value = ''; }" /></td>
</tr>
<tr>
<td align="right">By Title :</td>
<td><input type="text" id="Title" value="Book Title..." onblur="if (this.value == ''){this.value = 'Book Title...'; }" onfocus="if (this.value == 'Book Title...') {this.value = ''; }" /></td>
<td><input type="text" id="Edition" value="Edition..." onblur="if (this.value == ''){this.value = 'Edition...'; }" onfocus="if (this.value == 'Edition...') {this.value = ''; }" /></td>
</tr>
<tr>
<td align="right">By ISBN :</td>
<td><input type="text" id="ISBN" value="ISBN..." onblur="if (this.value == ''){this.value = 'ISBN...'; }" onfocus="if (this.value == 'ISBN...') {this.value = ''; }" /></td>
<td><input type="reset" class="sub-button" value="Reset" /></td>
</tr>
</tbody>
</table>
</form>
<div id="BookSearch_results"></div>

[jQuery的]

$(document).ready(function(){
$('.searchbooks').keyup(function() {
    var subject_term = $('#Subject').val();
    var course_term = $('#Course').val();
    var title_term = $('#Title').val();
    var edition_term = $('#Edition').val();
    var isbn_term = $('#ISBN').val();
    $.post('php/Display.php', { subject_term: subject_term, course_term: course_term, title_term: title_term, edition_term: edition_term, isbn_term: isbn_term }, function(data) { 
    $('#BookSearch_results').html(data);
    });
});
});

[PHP]

<?php
if (isset($_POST['subject_term'], $_POST['course_term'], $_POST['title_term'], $_POST['edition_term'], $_POST['isbn_term'])){

require 'Connect.php';

$subject_term = mysql_real_escape_string(htmlentities($_POST['subject_term']));
$course_term = mysql_real_escape_string(htmlentities($_POST['course_term']));
$title_term = mysql_real_escape_string(htmlentities($_POST['title_term']));
$edition_term = mysql_real_escape_string(htmlentities($_POST['edition_term']));
$isbn_term = mysql_real_escape_string(htmlentities($_POST['isbn_term']));

if ($subject_term == 'Subject...'){
$subject = '';
} else {$subject = "`Subject` LIKE '%$subject_term%' AND";}
if ($course_term == 'Number...'){
$course = '';
} else {$course = "`Course` LIKE '%$course_term%' AND";}
if ($title_term == 'Book Title...'){
$title = '';
} else {$title = "`Title` LIKE '%$title_term%' AND";}
if ($edition_term == 'Edition...'){
$edition = '';
} else {$edition = "`Edition` LIKE '%$edition_term%' AND";}
if ($isbn_term == 'ISBN...'){
$isbn = '';
} else {$isbn = "`ISBN` LIKE '%$isbn_term%' AND";}

$wc = "`ID`>='1'";

    $search = mysql_query("SELECT `Member`, `Subject`, `Course`, `Title`, `Edition`, `ISBN`, `Image`, `Condition`, `Price`, `Comments` FROM `Books` WHERE $subject $course $title $edition $isbn $wc");
    $result_count = mysql_num_rows ($search);
    $suffix = ($result_count !=1) ? 's' : '';
    echo 'Your search for <strong>', $subject,'</strong> returned <strong>', $result_count,'</strong> result', $suffix;

    while ($results_row = mysql_fetch_assoc($search)){
    echo '<div class="book-post"><div class="book-title"><h4>', $results_row['Title'],'.',$results_row['Edition'],'Edition</h4></div><div class="book-content"><span class="pullquote_left"><img src="', $results_row['Image'],'" width="100" height="100"/></span><span class="pullquote_right"><strong>Posted By:</strong><br/>', $results_row['Member'],'<br/><strong>Price:<br/></strong><em>$', $results_row['Price'],'</em><strong><br/>Condition:<br/></strong><em>', $results_row['Condition'],'Like New</em></span><strong>ISBN :</strong>', $results_row['ISBN'],'<br/><strong>Comments: </strong>', $results_row['Comments'],'.</div></div>';    
    }
}else{
echo '<h3>Please log in to view textbook listings</h3>';
}
?>

感谢您的时间,

安东尼

1 个答案:

答案 0 :(得分:0)

这可能不是答案......但要调试此类问题,请使用firebug插件。您将能够查看并检查发送到服务器的请求以及发送的变量。还要在您的firebug脚本选项卡中添加断点,以查看您是否在js端读取正确的值。你将能够迅速解决问题:)

Get Firebug