single id to fill out two divs in ajax ???

[fire eaters]

textbox to search for employees

<div id="searchform">
    <div id = "courses">
        <form id="searchempform" name="searchempform"  method="post" "/> 
        <li> SEARCH <b>EMPLOYEES</b> &nbsp;<input type="text" name="searchemployees" class="textbox" [B]onkeyup="searchemp();[/B]" /> </li>
        </form>
    </div>

=======================================================
typed characters sent ... ajax call to another page look out for data

<script type="text/javascript">
	function [B]searchemp()[/B]
	{
	if (window.XMLHttpRequest)
	  {// code for IE7+, Firefox, Chrome, Opera, Safari
	  xmlhttp=new XMLHttpRequest();
	  }
	else
	  {// code for IE6, IE5
	  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	  }
	xmlhttp.onreadystatechange=function()
	  {
	  if (xmlhttp.readyState==4 && xmlhttp.status==200)
		{
		document.getElementById("results").innerHTML=xmlhttp.responseText;
		}
	  }
	 xmlhttp.open('GET','employeeajax.php?searchemployees='+document.searchempform.searchemployees.value,true);
     xmlhttp.send();
}
</script>

-----------------------------------------------------
using the sent characters .. searching the information using sql query

<?php

include("sql2.php");
 
           $searchemp = $_GET['searchemployees'];

           if(!empty($searchemp))
		   {
 
		  $sql="SELECT `empid`, `Rank`, `Name`, `serviceno` FROM `frsemployees` WHERE `Name` LIKE '".mysql_real_escape_string($searchemp)."%'";
		   $result = mysql_query("$sql") or die ("could not connebbbbct to database");
		   
		   
				echo'<select name="listbox" class="listbox" size="28" onclick = "[B]getinfo2(this.value);[/B] " >';
						while($row=mysql_fetch_array($result))
						{
						  $empid = $row[0];
						  $rank = $row[1];
						  $name = $row[2];
						  $Serviceno = $row[3];
			
						echo"<option value='$empid' class='b'> $Serviceno $rank  $name  </option>";
						}
						
                     echo '</select>'; 
		   }
?>

--------------------------------------------------------------
using the selected id again populating for another information

<script type="text/javascript">
	function [B]getinfo2(employeeinformation)[/B]
	 {
	if (window.XMLHttpRequest)
	  {// code for IE7+, Firefox, Chrome, Opera, Safari
	  xmlhttp=new XMLHttpRequest();
	  }
	else
	  {// code for IE6, IE5
	  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	  }
	xmlhttp.onreadystatechange=function()
	  {
	  if (xmlhttp.readyState==4 && xmlhttp.status==200)
		{
		document.getElementById("employeeinformation").innerHTML=xmlhttp.responseText;
		}
	  }
	 xmlhttp.open("GET","employeedetailsajax.php?id="+employeeinformation,true);

     xmlhttp.send();
     }
</script>

-----------------------------------------
look out for data using the clicked employees id

<?php

 include("sql2.php");

 $employeeserviceno = $_GET["id"];

 
 
    $sql1=  "SELECT frsemployees.photo, frsemployees.serviceno, frsemployees.Rank, frsemployees.Name
    FROM frsemployees WHERE frsemployees.empid = '$employeeserviceno' ";
	
	$result1 = mysql_query("$sql1") or die ("could not connebbbbct to database");
	
	while($row=mysql_fetch_array($result1))
						{
						  $empid = $row[0];
						  $rank = $row[1];
						  $name = $row[2];
						  $Serviceno = $row[3];
						  
		
  echo'<tr>';
   echo' <td width="122" rowspan="3"><center><img src=../img/5247.PNG height=140 width = 120 border="1" style="padding:3px;"></center>  </td>';
    echo"<td>SN: $rank </td>";
   echo'</tr>';
   echo'<tr>';
    echo"<td width=235>Rank:$name</td>";
   echo'</tr>';
   echo'<tr>';
    echo"<td >SNumber:$Serviceno</td>";
   echo'</tr>';

						  
						}
?>
</table>
------------------------------------------------------------------------
<div id="results">
</div>
<div id="employeeinformation">
</div>
<div id="coursesinf">
</div>

--------------------------------------
using [B]getinfo2(this.value);[/B] i want to populated a new result to a new div
for instance the result div is populated with the employees personal information, when clicked to his id..how can i click to his same id and populated his courses information to "coursesinfdiv"

[AleMonteiro]

In a <select> you must use the onChange event to do this kind of stuff. Because click event will be fired before the user select some option.

[fire eaters]

In a <select> you must use the onChange event to do this kind of stuff. Because click event will be fired before the user select some option.

my problem is onchange= getinfo2(); will send the user selected id to the function getinfor2(employeesinformation) function... then this function will send the id to another file.

how can i use the same onchange = getinfor2(); id to populate antother div with some other information.

[ddymacek]

Since it appears that you are using the same 'id' to pull for the first set of employeeinformation and then want to also get additional info, just make another call at the end of getinfo2(); chain your requests together. not saying this is ideal, but should get the job done.

<script type="text/javascript">
	function getinfo2(employeeinformation)
	 {
	if (window.XMLHttpRequest)
	  {// code for IE7+, Firefox, Chrome, Opera, Safari
	  xmlhttp=new XMLHttpRequest();
	  }
	else
	  {// code for IE6, IE5
	  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	  }
	xmlhttp.onreadystatechange=function()
	  {
	  if (xmlhttp.readyState==4 && xmlhttp.status==200)
		{
		document.getElementById("employeeinformation").innerHTML=xmlhttp.responseText;
		}
	  }
	 xmlhttp.open("GET","employeedetailsajax.php?id="+employeeinformation,true);

     xmlhttp.send();
     // yet another request....
     get_course_info(employeeinformation);
     }
     
     function get_course_info(employeeinformation)
	 {
	if (window.XMLHttpRequest)
	  {// code for IE7+, Firefox, Chrome, Opera, Safari
	  xmlhttp=new XMLHttpRequest();
	  }
	else
	  {// code for IE6, IE5
	  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	  }
	xmlhttp.onreadystatechange=function()
	  {
	  if (xmlhttp.readyState==4 && xmlhttp.status==200)
		{
		document.getElementById("coursesinf").innerHTML=xmlhttp.responseText;
		}
	  }
	 xmlhttp.open("GET","coursesinfoajax.php?id="+employeeinformation,true);

     xmlhttp.send();
     }
</script>

[Taywin]

You could chain it using javascript calls as ddymacek, or you could do it on the server side. I prefer calling the info from the server side because it is being transferred once. What you need to do on your client side is to know how to break the response and put each piece into the correct places...

[fire eaters]

doesnt work :(

[Taywin]

What info you get back from the server? When you said "doesn't work," it means nothing to me. How would I know what "doesn't work" is? Could you give us a scenario from enter data and what you see afterward?

Also, do the chaining call using Ajax may not result the way you want. You should send the employee ID to the server once, and the server return all data you want to be displayed back. Then use JavaScript to populate the respond data in different places on the page. One way to deal with this is to use a delimiter. If you get the return value as "text" create a delimiter which will be used in split() string.

/*
On the server side, you collect all data and concatenate them as string
using --::-- as delimiter. Therefore you are supposed to have 2 of the
delimiter in your string.
i.e. "--::--ENG101--::--Instructor"
 This means there is no "results" data but has course info and employee info.
 The array result from splitting the respondText will be ["", "ENG101", "Instructor"]
*/
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
  var tmpArr = xmlhttp.responseText;.split("--::--")  // your delimiter is --::--
  document.getElementById("results").innerHTML = tmpArr[0]
  document.getElementById("coursesinf") = tmpArr[1]
  document.getElementById("employeeinformation") = tmpArr[2]
}