How to obtain a column for selected ID via dynamic form?

Question

I have a small script which consists of 2 select fields and 1 input field. First select box pulls from one table, once an item is selected from it, it populates the second select box with a pull from a second table.

What I need, is for the third input box, to display the next column pertaining to the selections.

Table 1 consists of 2 columns (CAT_ID and CATDESC)

Table 2 consists of 4 columns (SUB_ID, CAT_ID, SUBCATDESC, and NAME)

So when I select an option in the first drop down box, it matches the CAT_ID from Table 1 and Table 2, and inserts the SUBCATDESC in the second drop down.

But I have no idea how to make it prepopulate the input field with the NAME for the given CAT_ID > SUBCAT_ID.

Hope someone can chime in.

Note, that the code below has been stripped from a working environment, I am just trying to add an extra field to a working form.

<script type="text/javascript">
function AjaxFunction()
{
var httpxml;
try
 {
 // Firefox, Opera 8.0+, Safari
 httpxml=new XMLHttpRequest();
 }
catch (e)
 {
 // Internet Explorer
      try
                    {
                 httpxml=new ActiveXObject("Msxml2.XMLHTTP");
                }
            catch (e)
                {
            tray
            {
            httpxml=new ActiveXObject("Microsoft.XMLHTTP");
             }
            catch (e)
            {
            alert("Your browser does not support AJAX!");
            return false;
            }
        }
 }
function stateck() 
   {
   if(httpxml.readyState==4)
     {
//alert(httpxml.responseText);
var myarray = JSON.parse(httpxml.responseText);
// Remove the options from 2nd dropdown list 
for(j=document.contactform.subcat.options.length-1;j>=0;j--)
{
document.contactform.subcat.remove(j);
}
for (i=0;i<myarray.data.length;i++)
{
var optn = document.createElement("OPTION");
optn.text = myarray.data[i].subcategory;
optn.value = myarray.data[i].subcategory;  // You can change this to subcategory 
document.contactform.subcat.options.add(optn);

} 
     }
   } // end of function stateck
var url="dd.php";
var cat_id=document.getElementById('s1').value;
url=url+"?cat_id="+cat_id;
url=url+"&sid="+Math.random();
httpxml.onreadystatechange=stateck;
//alert(url);
httpxml.open("GET",url,true);
httpxml.send(null);
 }
</script>
<?php require "config.php"; ?>
<form name="contactform" method="post" action="" id="contactform">
<select name="cat" id='s1' onchange=AjaxFunction(); required>
  <option value=''></option>
  <?php
     $sql="select * from testtable"; // Query to collect data from table 
     foreach ($dbo->query($sql) as $row) {         ?>
  <option value=<?php echo "$row[cat_id]"; ?>><?php echo "$row[category]"; ?></option>
  <?php }  ?>
</select>
<select name="subcat" id='s2' style="width:200px;"></select>
<input name="name" id="name" type=text required >
<input value="send email" type=submit id="sendemail">
<?php
  if(isset($_POST['subcat'])) {
  // EDIT THE 2 LINES BELOW AS REQUIRED
  $email_to = $_POST['subcat'];
  $email_subject = "Request";
  function died($error) {
      // your error code can go here
      echo "We are very sorry, but there were error(s) found with the form you submitted. ";
      echo "These errors appear below.<br /><br />";
      echo $error."<br /><br />";
      echo "Please go back and fix these errors.<br /><br />";
      die();
  }


  // validation expected data exists
  if( !isset($_POST['s1']) ||
      !isset($_POST['s2']) ||
      !isset($_POST['name'])) {
      died('We are sorry, but there appears to be a problem with the form you submitted.');       
  }

  $s1 = $_POST['s1']; // required
  $s2 = $_POST['s2']; // required
  $name = $_POST['name']; // required

  $email_message = "Form details below.\n\n";

  function clean_string($string) {
    $bad = array("content-type","bcc:","to:","cc:","href");
    return str_replace($bad,"",$string);
  }

  $email_message .= "S1: ".clean_string($s1)."\n";
  $email_message .= "S2: ".clean_string($s2)."\n";
  $email_message .= "Name: ".clean_string($name)."\n";

  // create email headers
  $headers = 'From: '."test@test.com"."\r\n";
  $headers .= 'Reply-To: '."test@test.com"."\r\n";
  $headers .= 'CC: '."testing@test.com"."\r\n";
  $headers .= 'MIME-Version: 1.0\r\n';
  $headers .= 'Content-Type: text/html; charset=ISO-8859-1\r\n';
  @mail($email_to, $email_subject, $email_message, $headers);
  ?>
<div><font color=green><b>Your request has been sent.</b></div>
<?php } ?>
</form>

Answer 1

I am no expert in SQL, but I know a bit of PHP. Maybe this will help. Get both tables. From the first table you want to get the first row, as a default value, and store it. Then loop over the second table and compare each row from the first table with the rows from the second table. When a cat_id is the same in both rows the second row will be stored.

Change the FIRSTTABLE and SECONDTABLE strings to your own table names

<?php

// Query to collect data table 1.
// Change the FIRSTTABLE and SECONDTABLE to your table names.
$table_1_sql = "select * from FIRSTTABLE";  
$table_2_sql = "select * from SECONDTABLE";

// Query both tables
$query_table_1 = $dbo->query( $table_1_sql );
$query_table_2 = $dbo->query( $table_2_sql );

// Set the initial values to false.
$selected_row_1 = false;
$selected_row_2 = false;

// Loop over the first table to get the first row.
foreach( $query_table_1 as $row_table_1 ) {
  if ( $selected_row_1 === false ) {
    $selected_row_1 = $row_table_1
  }
}

// Loop over the second table to get the row that matches that cat_id from the first table row.
foreach( $query_table_2 as $row_table_2 ) {
   if ( $selected_row_1 !== false ) {
      if ( $selected_row_1[ 'cat_id' ] === $row_table_2[ 'cat_id' ] ) {
        $selected_row_2 = $row_table_2;
      }
   }
}

// The values from the first and second row.
// Both rows with the same 'cat_id' value.
var_dump( $selected_row_1 ); // array( 'cat_id' => SOMENUMBER, 'catdesc' => 'SOMEDESCRIPTION' );
var_dump( $selected_row_2 ); // array( 'cat_id' => SOMENUMBER, 'sub_id' => SOMENUMBER, 'catdesc' => 'SOMEDESCRIPTION', 'name' => 'SOMENAME' );

?>

Now you should have the data you need to populate the fields. The $selected_row_2 variable now holds an array with name you need for your input field.

Disclaimer

This all is based on the little info you gave and I hope it will help you out. If not I will do my best to get you where you need to be.