Hi,

I have webpage that I used jquery for autocomplete of process_name field and I used Ajax for getting the compound type and reject type based on process_id.

here is my index.php
Code:
<?php
 session_start();
  ob_start();
  date_default_timezone_set("Asia/Singapore");
  error_reporting(0);  
  include('connection.php');
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<title>Operator's Shift Report </title>
<head>
<link rel="stylesheet" type="text/css" href="op_report.css" />
<link rel="stylesheet" type="text/css" href="calendar.css" />

<script type="text/javascript" src="jquery.js"></script>
<script type='text/javascript' src='jquery.autocomplete.js'></script>
<link rel="stylesheet" type="text/css" href="jquery.autocomplete.css" />

<script type="text/javascript">
//----auto complete process name---//
$().ready(function() {
    $("#process_name").autocomplete("get_process_list.php", {
       width: 205,
        matchContains: true,
        mustMatch: true,
        selectFirst: false
    });
    
    $("#process_name").result(function(event, data, formatted) {
        $("#process_id").val(data[1]);
    });  
});

//------AJAX-----//
function AJAX(){
        var xmlHttp;
        try{
            xmlHttp=new XMLHttpRequest(); // Firefox, Opera 8.0+, Safari
            return xmlHttp;
            }
        catch (e){
            try{
                xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
                return xmlHttp;
                }
            catch (e){
                try{
                    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
                    return xmlHttp;
                    }
                catch (e){
                    alert("Your browser does not support AJAX!");
                    return false;
                    }
                }
            }
        }

//-----get reject---//
function getmat()
        {
            divid = "op_output_fieldset";
            var url = "get_process_reject_list.php";
            var str = "id=" + document.getElementById("process_name").value;
            var xmlHttp = AJAX();
            xmlHttp.onreadystatechange =  function(){
            if(xmlHttp.readyState > 0 && xmlHttp.readyState < 4){
               // document.getElementById(divid).innerHTML=loadingmessage;
                }
            if (xmlHttp.readyState == 4) {
                if (xmlHttp.status == 200) {
                    var jsonart = xmlHttp.responseText;
                    document.getElementById(divid).innerHTML = jsonart;
                    }
                }
            }
            xmlHttp.open("POST", url, true);
            xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            xmlHttp.setRequestHeader("Content-length", str.length);
            xmlHttp.setRequestHeader("Connection", "close");
            xmlHttp.send(str);
        }
        
</script>
</head>
<body onload=document.getElementById("process_name").focus();>
<form name="operator_report" action="" method="post" autocomplete="off">
    <!--Tab List -->
<div id="ddcolortabs">
<ul>
<li id="current"> <a href="index.php" title="Operator's Shift Report"><span>Operator's Shift Report</span></a></li>
</ul>
</div>
<div id="operators_report">
<fieldset>
<legend><h1>Operator's Shift Report</h1></legend>
<table>
<tr>
<td>Process:</td>
<td><input type="text" name="process_name" id="process_name" value="" size="30" onkeyup="getmat();"></td>
</tr>
</table>

</fieldset>
</div>
<input type="hidden" name="process_id" id="process_id" value="" />


<div id="op_output_fieldset">

</div>

</form>
</body>
</html>
and here is my get_project_reject_list.php
PHP Code:
<?php
ob_start
();
include 
"connection.php";
if(
$_POST["id"])
{    
$sql "select r.reject_acro from process_list AS p LEFT JOIN reject_list AS r ON 
p.reject_id = r.reject_process_id
 where p.process_name LIKE '" 
. ($_POST["id"]) . "'";
 
$rsd mysql_query($sql);
echo 
"<table>";
        while(
$rs mysql_fetch_assoc($rsd)) {
            
$reject[] = $rs['reject_acro'];
        }   
            
            echo 
"<tr>";
            if(empty(
$reject))
            {
                echo
"";
            }
            else
            {   
                    echo 
"<th>Compound</th>";
                    echo 
"<th>Output</th>";
                    foreach (
$reject as $reject)
                    {   
                        echo 
"<th>$reject</th>";
                    }
        
            echo 
"<tr>";        
            
$sql_comp "SELECT compound_id, compound_type FROM compound_list ORDER BY compound_type ASC";
            
$res mysql_query($sql_comp);
            while(
$comp mysql_fetch_assoc($res)){
                
$compound_type $comp['compound_type'];
            
                echo 
"<td>$compound_type</td>";
                echo 
"<td><input type='text' name='output' id='output' value=''></td>";
                echo 
"<td><input type='text' name='reject' id='reject' value=''></td>";
            }   
            echo 
"</tr>";        
            echo 
"</tr>";  
            }
            echo 
"</table>";
        

 }
?>
I felt difficulty in my table layout.

I want is like this:

Compound|Output|HS|B|D|C|E
P35-------textbox-tb-tb-tb-tb-tb
P45-------textbox-tb-tb-tb-tb-tb
P46-------textbox-tb-tb-tb-tb-tb
P47-------textbox-tb-tb-tb-tb-tb
P48-------textbox-tb-tb-tb-tb-tb


I hope somebody can help me.

Thank you so much.