PHP ajax 搜索结果搞砸了我的页面
PHP ajax search results in mucking up my page
嗨,伙计们,这是我第一次尝试对我的网站进行实时 ajax 搜索。我是 php 的新手,所以在这个问题上的任何帮助都会很棒。我在这里和那里遵循一些教程并试图让它工作,但每次我按搜索时都没有出现任何结果。关于此事的任何帮助都会很棒。
法典:
<?php
mysql_connect("localhost","root","") or die ("could not connect");
mysql_select_db("reg") or die ("could not find db");
if (isset($_POST['search_term']) == true && empty($_POST['search_term']) == false) {
$search_term = mysql_real_escape_string($_POST['search_term']);
$query = mysql_query("SELECT `ingName` FROM `ing` WHERE `ingName` LIKE '$search_term%'");
while(($row = mysql_fetch_assoc($query)) !== false) {
echo '<li>',$row['ingName'],'</li>';
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<div class="container">
<input type="text" class="searchFunction"> <input type = "submit" value ="Search">
<div class = "dropdown">
<ul class = "result">
</ul>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.searchFunction').keyup(function() {
var search_term = $(this) .attr('value');
$.post('build.php', {search_term:search_term}, function(data) {
$('.result').html(data);
$('.result li').click(function() {
var result_value = $(this).text();
$('.searchFunction').attr('value', result_value);
$('.result').html('');
});
});
});
});
</script>
</body>
</html>
同样,我对此很陌生,所以我只是想围绕这个领域建立我的知识。解决这个大问题的任何帮助都会很棒
附言我知道sql注入:)但现在一步一步 X
正如已经指出的那样 - 到目前为止使用的方法存在SQL注入的风险,因此在致力于使用现已弃用的mysql
函数套件之前,明智的做法是阅读并实现mysqli
当您使用prepared statements
时,它将提供针对恶意SQL注入攻击的重要保护。
由于您的ajax查询被发送到同一页面(通过发布的代码的外观),要做的一件重要事情是在发送响应后退出php-否则您最终会发送整个页面(这也将是格式不正确的,因为html标签之外会有内容),我怀疑这不是您想要的目标。
在我未经训练的眼中,ajax 函数看起来不错,但由于我不使用 jQuery,我很可能错了,错过了一些重要的东西。
<?php
/*
as the rest of the page doesn't use a db connection,
only load the db conn if the page is requested via post
*/
if( $_SERVER['REQUEST_METHOD']=='POST' ){
/* assign db connection to a variable */
$conn=mysql_connect("localhost","root","") or die ("could not connect");
mysql_select_db("reg") or die ("could not find db");
/* empty() does an implied `isset` */
if ( !empty( $_POST['search_term'] ) ) {
$search_term = mysql_real_escape_string( $_POST['search_term'] );
/*
You ought to look at using mysqli ( prepared statements )
rather than the now deprecated `mysql_*` functions
*/
$query = mysql_query( "SELECT `ingName` FROM `ing` WHERE `ingName` LIKE '$search_term%'", $conn );
if( $query ){/* only send response if the query succeeds */
while( $row = mysql_fetch_assoc( $query ) ) {
echo '<li>',$row['ingName'],'</li>';
}
}
}
mysql_close( $conn );
/* make sure that the rest of the page is not sent back with the response data */
exit();
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Gotta have a title!</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
$( document ).ready( function() {
$('.searchFunction').keyup( function( event ) {
/* I could not get this to work - I don't know what this is doing as I don't use jQuery */
/*var search_term = $(this).attr('value');*/
/* this however does work */
var el=event.target || event.srcElement;
var search_term=el.value;
/* maybe better to search after a few letters have been added? */
if( search_term.length < 2 )return;
/* it appears you are posting to the same page */
$.post( document.location.href, { search_term:search_term }, function( data ) {
$('.result').html( data );
$('.result li').click( function( event ) {
var result_value = $(this).text();
$('.searchFunction').attr('value', result_value );
$('.result').html('');
});
});
});
});
</script>
</head>
<body>
<div class="container">
<input type="text" name='search_term' class="searchFunction">
<input type="submit" value="Search">
<div class="dropdown">
<ul class="result"></ul>
</div>
</div>
</body>
</html>
完整的工作示例
<?php
if( $_SERVER['REQUEST_METHOD']=='POST' ){
if ( !empty( $_POST['search_term'] ) ) {
$dbhost = 'localhost';
$dbuser = 'root';
$dbpwd = 'xxx';
$dbname = 'xxx';
$db = new mysqli( $dbhost, $dbuser, $dbpwd, $dbname );
/* using lower() helped account for vagueries in spelling */
$sql='select * from `maps` where
lower( `location_name` ) like lower( "%'.$_POST['search_term'].'%" );';
$res=$db->query( $sql );
if( $res ){
while( $rs=$res->fetch_object() ){
echo "<li>".$rs->location_name."</li>";
}
}
}
exit();
}
?>
<!doctype html>
<html lang='en'>
<head>
<title>Gotta have a title!</title>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js'></script>
<script type='text/javascript'>
$( document ).ready( function() {
$('.searchFunction').keyup( function( event ) {
var search_term=this.value;
/* maybe better to search after a few letters have been added? */
if( search_term.length < 5 )return;
/* it appears you are posting to the same page */
$.post( document.location.href, { search_term:search_term }, function( data ) {
$('.result').html( data );
$('.result li').click( function( event ) {
var result_value = $(this).text();
$('.searchFunction').attr( 'value', result_value );
$('.result').html('');
});
});
});
});
</script>
</head>
<body>
<div class='container'>
<input type='text' name='search_term' class='searchFunction'>
<input type='submit' value='Search'>
<div class='dropdown'>
<ul class='result'></ul>
</div>
</div>
</body>
</html>
您可以尝试编写不带引号的查询,即:
$query = mysql_query("SELECT ingName FROM ing WHERE ingName LIKE '$search_term%'");
您还可以通过使用'%$search_term%'
而不是'$search_term'
来放松搜索。
另一个可能的问题是 mysql_connect()
.我正在使用该功能,但它对我不起作用,所以我决定使用对我有用的mysqli_connect()
功能。
还有一些建议,你不需要==true
你也可以使用 !empty($_POST['search_term'])
.
一旦你通过学习,你也可以尝试PDO功能,这比启动你自己的连接要好得多。您可以像这样启动 PDO 连接。
$dbh1 = new PDO('mysql:dbname=dbname;host=127.0.0.1', 'username', 'dbpass');
然后你可以像这样搜索。 - 使用初始化的连接。
$query = "SELECT ingName from ing WHERE ingName LIKE %$search_term%";
$stmt = $dbh1->prepare($query);
$stmt->execute();
$allRows = count($stmt);
$row = $stmt->fetch(PDO::fetch_assoc);
foreach($row as $one){
echo "<li>".$one['ingName']."</li><br>";
}
干杯!
- 我可以让我的Ajax调用引起一个“;进行中”;光标
- 为什么我的ajax在提交用@HtmlRenderPartial加载的表单时只调用fire一次
- 当在文档中拖动mouseup/mouseleve时,我想调用我的Ajax请求
- 我的ajax表单没有提交
- 为什么我的 ajax 调用没有生成,因为我包含 ajax 的 js 文件包含在 iframe 中
- 我的 AJAX 请求对象无法正确解析 URL 的协议部分
- 我的 Ajax php 代码无法正常工作
- 为什么我的 Ajax 加载 php 页面
- Jsonresult在我的Ajax调用中使用参数失败.为什么会发生这种事
- 为什么event.prventDefault()和'return false'停止我的AJAX表单提交操
- 我的ajax加载栏出了什么问题?为什么它不能正常工作
- 我的AJAX代码出了什么问题
- 为什么我的ajax调用返回null
- 为什么当我指定POST时,即使我已经尝试了类型和方法选项,我的ajax代码仍然会触发GET请求
- 如何使我的ajax请求更安全
- 为什么我的ajax请求返回一个空响应
- 我的Ajax请求返回成功,但脚本不是't已执行
- 我的AJAX文件不起作用
- 我的Ajax GET是't工作
- 我的 AJAX 表单没有发送到我的 PHP