PDA

View Full Version : how to exit from a auto complete



ishakya
30 May 2011, 2:06 AM
Hi,
I am using a auto complete function to list down results according to a database field.
Here is the code:
<input name="txt_search_job_no" type="text" id="txt_search_job_no" value="" style="border:0px; font-family:Tahoma, Geneva, sans-serif; font-size:8.5pt; width:175px;" maxlength="100" onkeyup="lookup_search_job(this.value);" onblur="fill_search_job();" autocomplete="off"/>
And i list down a division to display the results.
<div class="suggestionsBox" id="suggestions_searchjob" style="display: none;">

<div class="suggestionList" id="autoSuggestionsList_searchjob">
&nbsp;
</div>
</div>

This is the script which i have been using.
<script type="text/javascript">
function lookup_search_job(txt_search_job_no) {
//document.write(com_id);
//document.write(txt_shipper);
if(txt_search_job_no.length == 0) {
// Hide the suggestion box.
$('#suggestions_searchjob').hide();
} else {
$.post("rpc_searchjob.php", {queryString: ""+txt_search_job_no+""}, function(data){
if(data.length >0) {
$('#suggestions_searchjob').show();
$('#autoSuggestionsList_searchjob').html(data);
}
});
}
} // lookup

function fill_search_job(thisValue) {
$('#txt_search_job_no').val(thisValue);
setTimeout("$('#suggestions_searchjob').hide();", 200);
}
</script>
This is the style which i used to for the division.
<style type="text/css">
body {
font-family: Helvetica;
font-size: 11px;
color: #333;
}

h3 {
margin: 0px;
padding: 0px;
}

.suggestionsBox {
position: absolute;
left:100px;
margin: 5px 0px 0px 0px;
width: 200px;
background-color: #FFF;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: 0px solid #09F;


}

.suggestionList {
margin: 0px;
padding: 0px;
}

.suggestionList li {

margin: 0px 0px 3px 0px;
padding: 3px;
cursor: pointer;
list-style:none;
}

.suggestionList li:hover {
/*background-color: #659CD8;*/
background-color: #69C;

}
</style>

Once i type on the search box, it will display related data on that division.So if i dont any data from the search i can type.I need to close the division when mouse out from that division.
So can anyone help me to figure this out???



Thanks in advance....