| Octavi Fors 2006-04-25, 7:04 pm |
| Josh and everybody,
> Well this is really just pure JavaScript at this point.
>
> <select id="Cities"></select>
>
> <input id="CitiesBox" style="display:none">
>
> var callbacks = {
> getStates: function(result) {
> _fillInMenu("States", result);
> },
>
> getCities: function(result) {
> if (result == false) {
> document.getElementById('Cities').style.display = 'none';
> document.getElementById('CitiesBox').style.display =
> 'inline';
> }
> else {
> document.getElementById('Cities').style.display =
> 'inline';
> document.getElementById('CitiesBox').style.display =
> 'none';
>
> _fillInMenu("Cities", result);
> }
> }
> }
>
> Updating the callback to something like that should do it.
> -josh
yes, it worked fine. Now the drop menu and input box controls appear and
disapear depending the value in 'States' (now renamed as 'PAISUVPREV')
drop menu. Thanks a lot!
Now I would like to duplicate this set of controls (parent drop menu +
secondary drop menu or input box controls) in the same webpage form. To
avoid idname confusion, I added a numeric index suffix ('_1','_2') to the
former controls. I am passing this index in the getUniv call, but I'm
getting it with 'undefined' value (see source below). In my case, index
value is assigned the first time the form is generated by PHP script.
Is there any option in HTML_AJAX for passing a parameter to JS
callback code which handles result?
Thanks in advance,
Octavi.
<script type="text/javascript" src="server.php?client=all&stub=Universities"></script>
<script type="text/javascript" src="menuhandler.js"></script>
</head>
<script>
var callback = {
getUniv: function(result, index) {
var index_lit_idcouvprev='LIT_IDCOUVPREV_'+i
ndex;
var index_idcouvprev='IDCOUVPREV_'+index;
var index_lit_descuvprev='LIT_DESCUVPREV_'+i
ndex;
var index_descuvprev='DESCUVPREV_'+index;
if (result == false) {
document.getElementById(index_lit_idcouvprev).style.display = 'none';
document.getElementById(index_idcouvprev).style.display = 'none';
document.getElementById(index_lit_descuvprev).style.display = 'inline';
document.getElementById(index_descuvprev).style.display = 'inline';
}
else {
document.getElementById(index_lit_idcouvprev).style.display = 'inline';
document.getElementById(index_idcouvprev).style.display = 'inline';
document.getElementById(index_lit_descuvprev).style.display = 'none';
document.getElementById(index_descuvprev).style.display = 'none';
_fillInMenu(index_idcouvprev, result);
}
}
}
var remote = new universities(callback); // our php5/4 compat version
</script>
class Universities {
function getUniv($state,$index)
{
if($state==100)
{
return array(
'BOS' => 'Boston',
'CAM' => 'Cambridge',
'SAL' => 'Salem',
);
}
else {
return FALSE;
}
}
}
<!-- Set of controls 1 -->
<select onchange="remote.getUniv(this.value,1)" name="PAISUVPREV_1" class="camp_form1">
<!-- BEGIN paisuvprev_option -->
<option {SELECTED} value="{PAISUVPREV}">{DESC_PAISUVPREV}</option>
<!-- END paisuvprev_option -->
</select>
<div align="right">
<div id="LIT_IDCOUVPREV_1" align="right" style="display:none">{LIT_IDCOUVPREV}</div>
</div>
<select id="IDCOUVPREV_1" name="IDCOUVPREV_1" class="camp_form1" style="display:none"></select>
<div align="right">
<div id="LIT_DESCUVPREV_1" align="right" style="display:none">{LIT_DESCUVPREV}</div>
</div>
<input type="text" size="50" maxlength="255" id="DESCUVPREV_1" name="DESCUVPREV_1" style="display:none">
<!-- Set of controls 1 -->
.....
<!-- Set of controls 2 -->
<select onchange="remote.getUniv(this.value,2)" name="PAISUVPREV_2" class="camp_form1">
<!-- BEGIN paisuvprev_option -->
<option {SELECTED} value="{PAISUVPREV}">{DESC_PAISUVPREV}</option>
<!-- END paisuvprev_option -->
</select>
<div align="right">
<div id="LIT_IDCOUVPREV_2" align="right" style="display:none">{LIT_IDCOUVPREV}</div>
</div>
<select id="IDCOUVPREV_2" name="IDCOUVPREV_2" class="camp_form1" style="display:none"></select>
<div align="right">
<div id="LIT_DESCUVPREV_2" align="right" style="display:none">{LIT_DESCUVPREV}</div>
</div>
<input type="text" size="50" maxlength="255" id="DESCUVPREV_2" name="DESCUVPREV_2" style="display:none">
<!-- Set of controls 2 -->
|