I found this search auto suggest script on the net. The script works fine but everytime i hit enter on the selected suggestion, the form submits itself. i want to disable the submit when i hit enter so i tried adding this part to Case 13. but it doesnt work. am i missing out on something?
thank you very much.
Heres the javascript
Heres the html.
thank you very much.
PHP:
event.returnValue = false;
if (event.preventDefault) {
event.preventDefault();
}Heres the javascript
PHP:
$(document).ready(function(){
$(document).click(function(){
$("#ajax_response").fadeOut('slow');
});
$("#keyword").focus();
var offset = $("#keyword").offset();
var width = $("#keyword").width()-2;
$("#ajax_response").css("left",offset.left);
$("#ajax_response").css("width",width);
$("#keyword").keyup(function(event){
//alert(event.keyCode);
var keyword = $("#keyword").val();
if(keyword.length)
{
if(event.keyCode != 40 && event.keyCode != 38 && event.keyCode != 13)
{
$("#loading").css("visibility","visible");
$.ajax({
type: "POST",
url: "/javascript/ajax_server.php",
data: "data="+keyword,
success: function(msg){
if(msg != 0)
$("#ajax_response").fadeIn("slow").html(msg);
else
{
$("#ajax_response").fadeIn("slow");
$("#ajax_response").html('<div style="text-align:left;">No Matches Found</div>');
}
$("#loading").css("visibility","hidden");
}
});
}
else
{
switch (event.keyCode)
{
case 40:
{
found = 0;
$(".list li").each(function(){
if($(this).attr("class") == "selected")
found = 1;
});
if(found == 1)
{
var sel = $(".list li[class='selected']");
sel.next().addClass("selected");
sel.removeClass("selected");
}
else
$(".list li:first").addClass("selected");
}
break;
case 38:
{
found = 0;
$(".list li").each(function(){
if($(this).attr("class") == "selected")
found = 1;
});
if(found == 1)
{
var sel = $(".list li[class='selected']");
sel.prev().addClass("selected");
sel.removeClass("selected");
}
else
$(".list li:last").addClass("selected");
}
break;
case 13:
event.returnValue = false;
if (event.preventDefault) {
event.preventDefault();
} /* I ADDED THIS PART */
$("#ajax_response").fadeOut("slow");
$("#keyword").val($(".list li[class='selected'] a").text());
break;
}
}
}
else
$("#ajax_response").fadeOut("slow");
});
$("#ajax_response").mouseover(function(){
$(this).find(".list li a:first-child").mouseover(function () {
$(this).addClass("selected");
});
$(this).find(".list li a:first-child").mouseout(function () {
$(this).removeClass("selected");
});
$(this).find(".list li a:first-child").click(function () {
$("#keyword").val($(this).text());
$("#ajax_response").fadeOut("slow");
});
});
});
HTML:
<form action="/search.php" method="post">
<table border="0">
<tr>
<td width="130" class="style8"><input type="text" id="keyword" tabindex="0" autocomplete=off name="searchdata"></td>
<td><input type="submit" name="searchcheck" value="Search"></td>
</tr>
</table>
</form>