Popup on key up

Popup on key up

Please excuse me but this is my first time that I am exposed to Jquery. Could you pleasE help me with this, which I am sure will be straight forward to you?

NOTE ............... 
$row3['service'] IN SEARCHEXEC.PHP DISPLAYS ON THE POPUP BROWSE WHEN I TYPE AND FILTERS ON KEYUP. 
WHEN I SELECT A RECORD IT  SELECTS THE COMPLETE ROW IN SEARCHEXEC.PHP
echo '<a href=home.php?id=' . $row3['mem_id'] . '>' . $row3['fname'] . "</a>\n";AND CALL HOME.PHP
I WANT TO DISPLAY ONLY $row3[‘fname’] IN LIVE.PHP IN TEXT FIELD AMOTS WHEN I SELECT A VALUE FORM THE MENU IN SEARCHEXEC.PHP.

I AM NOT CONCERNED WITH "layer2" AS I WANT TO REMOVE IT. 

CODE BELOW

THANK YOU VERY,VERY MUCH!!


Live.php. 1st file

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script language="JavaScript" type="text/javascript" src="search.js"></script>
<style type="text/css">
body{
font-family:Arial, Helvetica, sans-serif;
}
#main{
padding:15px;
margin:0 auto;
width: 265px;
border:2px double gray;
}
#layer2{
width:262px;
border:1px solid gray;
margin-top: -2px;
border-bottom-width: 0px;
}
#layer2 a{
text-decoration:none;
text-transform:capitalize;
padding:5px;
}
.suggest_link{
background-color:#fff;
border-bottom:1px solid gray;
}
.small{
background-color:#fff;
border-bottom:1px solid gray;
}
.suggest_link_over{
background-color:#fff;
border-bottom:1px solid gray;
}
.suggest_link:hover{
background-color:#6d84b4;
border-bottom:1px solid gray;
}
.suggest_link_over:hover{
background-color:#6d84b4;
border-bottom:1px solid gray;
}
#amots{
padding:5px;
border-radius:none;
width:250px;
border:2px solid gray;
background: url("search.png") no-repeat scroll right 0 transparent;
}
</style>
</head>

<body>
<div id="main">
Search Here:<br />
<input type="text" id="amots" name="amots" onKeyUp="bleble();" autocomplete="off"/>
<div id="layer2"></div>
<br />
<table width="262" border="1px" cellpadding="0" cellspacing="0">
<tr>
<td colspan="2">List of Names to Search </td>
</tr>
<?php
require_once('connection.php');
$result3 = mysql_query("SELECT * FROM member");
while($row3 = mysql_fetch_array($result3))
{ 

  echo '<tr>';
    echo '<td width="44">Name</td>';
    echo '<td width="192">'.$row3['fname'].' '.$row3['lname'].'</td>';
  echo '</tr>';
}
?>
</table>

<div>
</body>
</html>





!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

searchexec.php

<?php
//Get our database abstraction file
require('connection.php');

if (isset($_GET['search']) && $_GET['search'] != '') {
//Add slashes to any quotes to avoid SQL problems.
$search = $_GET['search'];
$result3 = mysql_query("SELECT * FROM member where fname like('" .$search . "%')");
while($row3 = mysql_fetch_array($result3))
{
echo '<a href=home.php?id=' . $row3['mem_id'] . '>' . $row3['fname'] . "</a>\n";
}
}
?>



!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

search.js


function getXmlHttpRequestObject() {
if (window.XMLHttpRequest) {
return new XMLHttpRequest();
} else if(window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP");
} else {
alert("Your Browser Sucks!");
}
}

//Our XmlHttpRequest object to get the auto suggest
var searchReq = getXmlHttpRequestObject();

//Called from keyup on the search textbox.
//Starts the AJAX request.
function bleble() {
if (searchReq.readyState == 4 || searchReq.readyState == 0) {
var str = escape(document.getElementById('amots').value);
searchReq.open("GET", 'searchexec.php?search=' + str, true);
searchReq.onreadystatechange = handleSearchSuggest; 
searchReq.send(null);
}
}

//Called when the AJAX response is returned.
function handleSearchSuggest() {
if (searchReq.readyState == 4) {
       var ss = document.getElementById('layer2');
var str1 = document.getElementById('amots');
var curLeft=0;
if (str1.offsetParent){
   while (str1.offsetParent){
curLeft += str1.offsetLeft;
str1 = str1.offsetParent;
   }
}
var str2 = document.getElementById('amots');
var curTop=20;
if (str2.offsetParent){
   while (str2.offsetParent){
curTop += str2.offsetTop;
str2 = str2.offsetParent;
   }
}
var str =searchReq.responseText.split("\n");
if(str.length==1)
   document.getElementById('layer2').style.visibility = "hidden";
else
ss.innerHTML = '';
for(i=0; i < str.length - 1; i++) {
//Build our element string.  This is cleaner using the DOM, but
//IE doesn't support dynamically added attributes.
var suggest = '<div onmouseover="javascript:suggestOver(this);" ';
suggest += 'onmouseout="javascript:suggestOut(this);" ';
suggest += 'onclick="javascript:setSearch(this.innerHTML);" ';
suggest += 'class="small">' + str[i] + '</div>';
ss.innerHTML += suggest;
}
}
}

//Mouse over function
function suggestOver(div_value) {
div_value.className = 'suggest_link_over';
}
//Mouse out function
function suggestOut(div_value) {
div_value.className = 'suggest_link';
}
//Click function
function setSearch(value) {
document.getElementById('amots').value = value;
document.getElementById('layer2').innerHTML = '';
document.getElementById('layer2').style.visibility = "hidden";
}


!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Load and create database


-- phpMyAdmin SQL Dump
-- version 3.4.9
--
-- Host: localhost
-- Generation Time: May 28, 2012 at 07:18 PM
-- Server version: 5.1.36
-- PHP Version: 5.3.0

SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";
SET time_zone = "+00:00";


/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8 */;

--
-- Database: `simple_login`
--

-- --------------------------------------------------------

--
-- Table structure for table `member`
--

CREATE TABLE IF NOT EXISTS `member` (
  `mem_id` int(11) NOT NULL AUTO_INCREMENT,
  `username` varchar(30) NOT NULL,
  `password` varchar(30) NOT NULL,
  `fname` varchar(30) NOT NULL,
  `lname` varchar(30) NOT NULL,
  `address` varchar(100) NOT NULL,
  `contact` varchar(30) NOT NULL,
  `picture` varchar(100) NOT NULL,
  `gender` varchar(10) NOT NULL,
  PRIMARY KEY (`mem_id`)
) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=6 ;

--
-- Dumping data for table `member`
--

INSERT INTO `member` (`mem_id`, `username`, `password`, `fname`, `lname`, `address`, `contact`, `picture`, `gender`) VALUES
(1, 'argie', 'febe', 'Argie', 'Policarpio', 'Talisay City', '989898989', '98989898', 'male'),
(2, 'ar', 'ar', 'ar', 'ar', 'ar', 'ar', 'ar', 'ar'),
(3, 'arg', 'arg', 'arg', 'arg', 'arg', 'arg', 'arg', 'arg'),
(4, 'bbb', 'bbb', 'bbb', 'bbb', 'bbb', 'bbb', 'bbb', 'bbb'),
(5, 'cccc', 'cccc', 'cccc', 'cccc', 'cccc', 'cccc', 'cccc', 'cccc');

/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;