Fill a Text Field from a Drop-Down Box

[giza]

Hi All,

Being a newbie I've found all the threads on this forum about this topic extremely useful. So, i've cobbled together the attached javascript/html/php/mysql code that uses a first selection box to populate a second selection box that, in turn, populates a text box. i.e. the user selects either bead or utensil that populates the second selection box with the relevant items (either beads or utensils). I link to a database. When the user selects an item in the second drop-down box, a price appears in the text field.

My problem is that I can only seem to get the prices for the first selection, i.e. beads. When I select utensils from the drop-down box I get the same set of prices (i.e. the bead prices) instead of the utensil prices. I would be very grateful for some help on this! Here is my code:

<hmtl>
<?php
require_once("/..../...php");
?>

<form name="form1"> 
    <select name="types" onChange="fillItems(0);"> 
        <option value="1">Beads</option> 
        <option value="2">Utensils</option> 
    </select> 
    <select name="items" onChange="fillPrices(0);"></select>
    <input type="text" name="prices" value= " " />

</form> 
 
<script type="text/javascript">

var arItems = new Array() 
arItems = [
<?php 

$query = "SELECT item_type, stock_id, model_name, price FROM stock"; 
$result = mysqli_query($dbc, $query); 
$num_rows = mysqli_num_rows( $result ); 
$i = 1; 
while ($row_result = mysqli_fetch_row($result)) { 
    echo "['".$row_result[0]."', '".$row_result[1]."', '".$row_result[2]."', '".$row_result[3]."']"; 
    if ( $i < $num_rows ) 
        echo ", 
        "; 
    $i++;  
} 
?> 
]


function fillItems(int_Start) {
    var fTypes = document.form1.types;
    var fItems = document.form1.items;
    var a = arItems;
    var b, c, d, intItem, intType, intPrice; 

    if ( int_Start >= 0 ) {
	
        for ( b = 0; b < a.length; b++ ) {
            if ( a[b][1] == int_Start )
                intType = a[b][0];
        }
   
        for ( c = 0; c < fTypes.length; c++ ) {
            if ( fTypes.options[ c ].value == intType )
                fTypes.selectedIndex = c;
        }
    }

    if ( intType == null )
        intType = fTypes.options[ fTypes.selectedIndex ].value;

    fItems.options.length = 0;

    for ( d = 0; d < a.length; d++ ) {
        if ( a[d][0] == intType )
            fItems.options[ fItems.options.length ] = new Option( a[d][2], a[d][1] );

        if ( a[d][1] == int_Start )
            fItems.selectedIndex = fItems.options.length - 1; 
        }
    }

function fillPrices() {
    var fItems = document.form1.items;
    var fPrices = document.form1.prices;
    fPrices.length = fItems.options.length;    
    var a = arItems;
    var x = fItems.selectedIndex;

		fPrices = a[x][3];
   		document.form1.prices.value = fPrices;
 
}

</script>

</html>