<?
set_include_path(get_include_path() . PATH_SEPARATOR . CFG_LIB_PATH."pear\\");

require_once 'HTML/QuickForm.php';

$form =& new HTML_QuickForm('frmTest', 'post');

$main[ 0 ] = "Pop";
$main[ 1 ] = "Rock";
$main[ 2 ] = "Classical";

$secondary[ 0 ][ 0 ] = "Belle & Sebastian";
$secondary[ 0 ][ 1 ] = "Elliot Smith";
$secondary[ 0 ][ 2 ] = "Beck";
$secondary[ 1 ][ 3 ] = "Noir Desir";
$secondary[ 1 ][ 4 ] = "Violent Femmes";
$secondary[ 2 ][ 5 ] = "Wagner";
$secondary[ 2 ][ 6 ] = "Mozart";
$secondary[ 2 ][ 7 ] = "Beethoven";
$opts[] = $main;
$opts[] = $secondary;

$hs =& $form->addElement('hierselect', 'ihsTest', 'Hierarchical select:', array('style' => 'width: 20em;'), '<br />');
$hs->setOptions($opts);

// Tries to validate the form
if ($form->validate()) {
    // Form is validated, then processes the data
    $form->freeze();
    $form->process('myProcess', false);
    echo "\n<HR>\n";
}

// Process callback
function myProcess($values)
{
    echo '<pre>';
    var_dump($values);
    echo '</pre>';
}

$form->display();
?>

<form action="/elements.php" method="post" name="frmTest" id="frmTest">
<div>
<table  style="BORDER: #3F89C3 1px solid;" align=center border="0">

	<tr>
		<td width= 50 % align="right" valign="top"><b>Hierarchical select:</b></td>
		<td valign="top" align="left"><script type="text/javascript">
//<![CDATA[
hs_ihsTest_0 = {
"0":"Belle & Sebastian",
"1":"Elliot Smith",
"2":"Beck"
}
hs_ihsTest_1 = {
"3":"Noir Desir",
"4":"Violent Femmes"
}
hs_ihsTest_2 = {
"5":"Wagner",
"6":"Mozart",
"7":"Beethoven"
}
function swapOptions(frm, grpName, eleIndex, nbElements, arName)
{
    var n = "";
    var ctl;

    for (var i =  0 ; i < nbElements; i++) {
        ctl = frm.form[grpName+'['+i+']'];
        if (!ctl) {
            ctl = frm.form[grpName+'['+i+'][]'];
        }
        if (i <= eleIndex) {
            n += "_"+ctl.value;
        } else {
            ctl.length =  0 ;
        }
    }

    var t = eval("typeof("+arName + n +")");
    if (t != 'undefined') {
        var the_array = eval(arName+n);
        var j =  0 ;
        n = eleIndex +  1 ;
        ctl = frm.form[grpName+'['+ n +']'];
        if (!ctl) {
            ctl = frm.form[grpName+'['+ n +'][]'];
        }
        for (var i in the_array) {
            opt = new Option(the_array[i], i, false, false);
            ctl.options[j++] = opt;
        }
    }
}
//]]>
</script><select style="width: 20em;" name="ihsTest[0]" onchange="swapOptions(this, 'ihsTest', 0, 2, 'hs_ihsTest');">
	<option value="0">Pop</option>
	<option value="1">Rock</option>
	<option value="2">Classical</option>
</select><br /><select style="width: 20em;" name="ihsTest[1]">
	<option value="0">Belle & Sebastian</option>
	<option value="1">Elliot Smith</option>
	<option value="2">Beck</option>
</select></td>
	</tr>
</table>
</div>
</form>