ajax jquery returns the whole page - php

Question

this question has been asked before but the answers seem not to work on me. My Ajax returns the whole page when i perform a autocomplete search
ajax to search from database
$(function(){ $(".search_keyword").keyup(function() {
var search_keyword_value = $(this).val();
var dataString = 'search_keyword='+ search_keyword_value;
if(search_keyword_value!='')
{
$.ajax({
type: "POST",
url: "/ajax/search.php",
data: dataString,
cache: false,
success: function(html)
{
$("#result").html(html).show();
}
});
} else{
document.getElementById('result').innerHTML ='';
}
return false; });
html page
<form method="get" action="/?page=results" class="navbar-form" autocomplete="off">
<input type="text" name="query" class="search_keyword"/>
<button type="submit" nam>Search</button>
</form>
<div id="result"></div>
would really appreciate the help Guys

Answer 1

check whether the page you are calling correct path or not...
due to 404 error only, it will returns whole page. may be the ajax url not found

Answer 2

The url used in ajax should be used to return(echo) the required data only, nothing else.
I've usually resolve this problem passing a 'action' POST to to php page wich contains what i would like to request from it and it gets selected with a switch.
The php code usually looks like this:
if(isset($_POST["action"]))
{
switch(action){
case "func_1":
func_1();
break;
case "func_2":
func_2();
break;
case "func_2":
func_3();
break;
case "func_2":
func_4();
break;
}
} else {
echo "error";
}
function func_1{
//do something
}
function func_2{
//do something
}
function func_3{
//do something
}
function func_4{
//do something
}
Inside the function I write the desired code, like getting autocompletion data, then echo it wia json, or something.
Also, the ajax 'data' tag capable to do html post/get paramteres via prebuilding a string:
$.ajax({
type: "POST",
url: "/ajax/search.php",
data:
{
search_keyword : search_keyword_value
}
cache: false,
success: function(html)
{
$("#result").html(html).show();
}
});