Show region if option is selected

[kool_samule]

Hi Chaps,

 

I have a PHP form, with a Customer Select List. Once an option has been selected, the 'custid', is passed to Javascript that collects all the contacts linked to that customer and populates another Select List.

This works fine, but what I'm after is an extra two inputs to appear when a particular customer is selected, but I'm not entirely sure how to go about it.

Here it goes:

Table/Form:

<script type="text/javascript">

var ajax = new Array();

function getTextList(sel)
{
    var Customer = sel.options[sel.selectedIndex].value;
    document.getElementById('text').options.length = 0;
    if(Customer.length>0){
        var index = ajax.length;
        ajax[index] = new sack();
        
        ajax[index].requestFile = 'getText.php?custid='+Customer;
        ajax[index].onCompletion = function(){ createText(index) };
        ajax[index].runAJAX();
    }
}

function createText(index)
{
    var obj = document.getElementById('text');
    eval(ajax[index].response); 
}   
</script>
      <table>
      <tr valign="baseline">
        <th>Customer:</th>
        <td colspan="2" class="normal"><span id="spryselect1">
          <select id="customer" name="FK_custid" onchange="getTextList(this)">
        <option value="">Select Customer</option>
        <?php
            $result = mysql_query("SELECT DISTINCT custname, custid FROM tbl_customers ORDER BY custname") 
            or die(mysql_error());
            while($cust = mysql_fetch_array( $result )) 
            {
                  echo '<option value="'.$cust['custid'].'">'.$cust['custname'].'</option>';
            }
        ?>
    </select><br />
          <span class="selectRequiredMsg">Please select Customer</span></span></td>
      </tr>
      <tr valign="baseline">
        <th>Customer Contact:</th>
        <td colspan="2" class="normal"><span id="spryselect6">
          <select id="text" name="projcontact">
            <option value="">--Select Customer First--</option>
          </select><br />
          <span class="selectRequiredMsg">Please select a Project Contact</span></span></td>
      </tr>
      <tr valign="baseline">
        <th>Purchase Order Ref:</th>
        <td colspan="2" class="normal"><input type="text" id="count" name="projporder" value="" size="32" /></td>
      </tr>
      <?php 
        if ('CustomerID'=='XX'){?>
      <tr valign="baseline">
        <th>Cost Centre:</th>
        <td colspan="2" class="normal"><input type="text" id="count" name="projcostcentre" value="" size="32" /></td>
      </tr>
      <tr valign="baseline">
        <th>Cost Centre Contact:</th>
        <td colspan="2" class="normal"><input type="text" id="count" name="projcostcentrecontact" value="" size="32" /></td>
      </tr>
      <?php 
        };
      ?>
      </table>

GetText.php:

<?php require_once('../../Connections/conndb2.php'); 
    $Customer = $_GET['custid'];
    if(isset($_GET['custid'])){
        $result = mysql_query("SELECT * FROM tbl_contacts WHERE FK_custid='$Customer' ORDER BY contactname") 
        or die(mysql_error());
             while($text = mysql_fetch_array( $result )) 
              {
                echo 'obj.options[obj.options.length] = new Option("'.$text['contactname'].'","'.$text['contactname'].'");';
              } 
    }
?> 

I know that I need the 'custid' to be set somewhere, but not sure at which point to do it. Any ideas welcome!

Apologies if this is a Javascript question, if so I'll move this to a different forum.

[satya61229]

So, if you Ajax function is working correctly then on the callback function, when everything is ready and you populate select option, there you put some js code and put your data on input box. Your input box should be hidden first.

When you got Ajax Complete state then put data on input box and un hide them.

 

[kool_samule]

Hi satya61229, thanks for the reply. That sounds like what I'm after, I know very little about js, so don't know to:

a: pull through the customerid

b: get js to recognise the customerid and show if = $something

Can you give me a few pointers, or some informtion so I can research it further?

Cheers

[satya61229]

See, javascript and PHP do not know each other.

But from serverside if you output like this:

echo "document.getElementById('myID').value= '$myValue'";

 

then it will be execute directly at client side.

also check here for these things:

http://www.satya-weblog.com/2008/05/passing-value-from-php-html-javascript.html

 

For input box, you can go like this:

First try to work with simple input box (no hide/unhide) and fix everything related to functionality.

 

then when you find everything good then you can proceed with hide/unhide play. It will be little difficult.

 

First stage will be:

<div id="div1" style="display:none">

<input name="txt1" type=text value="">

</div>

 

Second stage, when you got a value :

Before the above hidden html code, through js code in Ajax complete section,

write something like:

document.getElementById('div1').style.display = 'block';

etc. Difficult? huh! yes it is but you can do.

Good luck!