Search example

In the current example we have a drop down box instead of the text field as in second example, drop down box having some names of user and while you select a name the information regarding to the user will display in the same page, the information of the user coming from the database and the event is fires on selecting the name of the dropdown box.
WE here taking the information coming from the data on selection, but you can change the script as your convenience.
Page name: selectUser (HTML page)
<script type="text/javascript" src="user.js"></script>
	Select a User:  <select name="users" onChange="showUser(this.value)">
			        <option value="">Select a name</option>
			        <option value="10">kamal</option>
			        <option value="9">Ajay</option>
<br />
<div id="txtHint"><b>Person info will be listed here.</b></div>
Page name: getUser.php(Php scipt page)

$con = mysql_connect('localhost', 'root', '');
if (!$con)
  die('Could not connect: ' . mysql_error());

mysql_select_db("test", $con);

$sql="SELECT * FROM user WHERE id = '".$q."'";

$result = mysql_query($sql);

echo "<table border='1'>

while($row = mysql_fetch_array($result))
  echo "<tr>";
  echo "<td>" . $row['name'] . "</td>";
  echo "<td>" . $row['editor'] . "</td>";
  echo "</tr>";
echo "</table>";

page name: user.js (javascript page)
var xmlhttp;

function showUser(str)
if (xmlhttp==null)
  alert ("Browser does not support HTTP Request");
var url=" getUser.php"; <!-- changes may be done here, 
Note Here Page get_user.php is the page
 which contains the php code(sql fo data retriving) -->

function stateChanged()
if (xmlhttp.readyState==4)
<!--  cahanges may be done here,
 Note Here txtHint stands for the id of the div,
 taken in html page-->

function GetXmlHttpObject()
if (window.XMLHttpRequest)
  // code for IE7+, Firefox, Chrome, Opera, Safari
  return new XMLHttpRequest();
if (window.ActiveXObject)
  // code for IE6, IE5
  return new ActiveXObject("Microsoft.XMLHTTP");
return null;
The first page is a html page which display the drop – down box, having the name the employee in the drop – down box. The second page contains the php script and the third page consists the java script this java script page is included in the first page and the second page is called in the .js file.
This example uses the database you can use the example as your convenience it can be change to an hard coded data in place of the data coming from the database.
Scroll to Top