Search result in slide down list

[giabursu]

I'm working on the slide down listing with search form in it, But I'm not sure how to search the data base and echo the result without reloading page and without closing the slide down div, and I need the results of search in the sliding list, something like search on facebook. I don't know where and how to start. This is what I have do sou far. Any proposal?\[code\] <script> $(document).ready(function () { $('#nav li').hover( function () { $('ul', this).stop(true, true).slideDown(200); }, function () { $('ul', this).stop(true, true).slideUp(200); }); }); </script> <div style=' background-color:#D6DEE6; border-bottom:1px solid #6382A1; height:10px; width:100%; margin-top:-1px; -webkit-box-shadow: 5px 5px 15px #dddddd; box-shadow: 5px 5px 15px #dddddd;'> </div> <ul id='nav'> <li style=' background-color:#D6DEE6; border-bottom:1px solid #6382A1; margin-top:-0.5px; width:268px; margin-left:0%; border-right:1px solid #6382A1; border-left:1px solid #6382A1; height:25px; -moz-border-radius:0px 0px 5px 0px; border-radius:0px 0px 5px 0px; -webkit-box-shadow: 5px 5px 15px #dddddd; box-shadow: 5px 5px 15px #dddddd;'> <div class='linko_slide'> <a href=''><font face='candara' size='4'>Search menu</font><img src='http://stackoverflow.com/questions/10557992/slike_izgled/slide_down.png' width='25' height='10'style='margin-left:15px;'></a></div><ul style='background-color:#D6DEE6; border:1px solid #6382A1; padding:5px; width:350px; margin-top:0px; height:350; -webkit-box-shadow: 5px 5px 15px #dddddd; box-shadow: 5px 5px 15px #dddddd; -moz-border-radius:8px 8px 0px 0px; border-radius:0px 8px 8px 0px; padding-bottom:0px; padding-right:10px;'><!--search in list start!--> <form> <input type='text' name='search_dosje'> <input type='submit' name='search_q' value='http://stackoverflow.com/questions/10557992/Pretra?i' style='border:1px solid #8099B3; background:url(slike_izgled/naslovi_table.png); height:24px;-moz-border-radius:0px 5px 5px 0px; font-family:candara; font-size:15;border-radius:0px 5px 5px 0px; padding-bottom:3; padding-left:3; padding-right:3;'> </form> </div> <!--end of listing!--> </ul> </li> </ul>\[/code\]