aspose file tools*
The moose likes HTML, CSS and JavaScript and the fly likes Kiddie problem on my form Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of Soft Skills this week in the Jobs Discussion forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "Kiddie problem on my form " Watch "Kiddie problem on my form " New topic
Author

Kiddie problem on my form

dela cruz juan
Greenhorn

Joined: Nov 21, 2012
Posts: 13
Hi,

Its me again, sorry but my learning skills are still not yet enough to finish my school project. My form here does not work when I click the "Math" on the 1st selection box:


<html>
<head>
<title>OHAB SCHOOL</title>
<script type='text/javascript'>

function toggle(tbl_show,total_tbl)
{
for (i=1;i<total_tbl+1;i++)
{
eval("document.getElementById(\"thetbl"+i+"\").style.display='none'");
}
if (tbl_show!="") {
obj=document.getElementById("thetbl"+tbl_show);
obj.style.display='';
}
}

function updatehosts(selectedchostgroup){
hostslist.options.length=0
if (selectedhostsgroup>0){
for (i=0; i<hosts[selectedhostsgroup].length; i++)
hostslist.options[hostslist.options.length]=new Option(hosts[selectedhostgroup][i].split("|")[0], hosts[selectedhostgroup][i].split("|")[1])
}
}
<!-- check Button -->
function enable_bld_button(){
document.pogi.bld_button.disabled=false
}
function getAllSelections(box) {
var options = box.options;
var selectedOptions = [];
for (var i = 0; i < options.length; i++)
if (options[i].selected)
selectedOptions.push(options[i].value);
return selectedOptions;
}
function BuildAlert() {
alert("Selected for " + getAllSelections(document.getElementById("build_lst")));
}


<!-- ADDED -->
var ohabo = [];
ohabo["startList"] = ["activemq","activemqconfig"];

ohabo["activemq"] = ["Verizon","Att","Sprint"];

var nLists = 3; // number of select lists in the set

function fillSelect(currCat,currList){
var step = Number(currList.name.replace(/\D/g,""));
for (i=step; i<nLists+1; i++) {
document.forms['pogi']['List'+i].length = 1;
document.forms['pogi']['List'+i].selectedIndex = 0;
}
var nCat = ohabo[currCat];
for (each in nCat) {
var nOption = document.createElement('option');
var nData = document.createTextNode(nCat[each]);
nOption.setAttribute('value',nCat[each]);
nOption.appendChild(nData);
currList.appendChild(nOption);
}
}

function init() {
fillSelect('startList',document.forms['pogi']['List1'])
}


</script>
</head>
<body >
<form name="pogi">
<table border="1">
<tr>
<td width="50%">
<p>Select Subject</p>
</td>
<td>
<select name="select_task" onchange="toggle(this.value,2)">
<option value="">---SELECT ONE---</option>
<option value="1">1 - Science</option>
<option value="2">2 - Math</option>
<option value="3">3 - Politics</option>
<option value="4">4 - Pehm</option>
<option value="5">6 - Others</option>
</select>
</td>
</tr>
</table>
</br>
<table border="1" id="thetbl1" style="display:none">
<tr>
<td width="50%" align='center'><p>Select a Subject</p></td>
<td ><select size="3" name="build_list" multiple="yes" id="build_lst" onchange="enable_bld_button()">
<option>Phisics</option>
<option>Chemistry</option>
<option>Anatomy</option>
<option>Botany</option>
<option>Geology</option>

</select></td>
</td>
</tr>
<tr>
<td align='center'><p>Exceute</p></td>
<td align='center'><input type='button' name="bld_button" disabled value='COMMIT' onclick="BuildAlert()")></td>
<!--onclick="get_build(getBUILDSelections this.form['build_list'].value)"-->
</tr>
</table>
<table border="1" id="thetbl2" style="display:none">
</tr>
<tr>
<td><p>Select a Subject</p></td>
<td><p>Select a Topic</p></td>
<td><p>Select Topic2</p></td>
</tr>
<tr>
<tr>
<td>
<select name='List1' onchange="fillSelect(this.value,this.form['List2'])">
<option selected>Choose a Subject</option>
</select>

<td>
<select name='List2' onchange="fillSelect(this.value,this.form['List3'])">
<option selected>Choose a Topic </option>
</select>
</td>
<td>
<select name='List3' size="2" multiple="yes" onchange="getValue(this.value, this.form['List2'].value,
this.form['List1'].value)">
<option selected >Choose Topic2</option>
</select>
</td>
</tr>
</table>
<form>
</body>
</html>





What I want to happen is when I select the "Math" the corresponding list should validate just like this old one that worked:





<html>
<head>
<title>OHAB SCHOOL</title>
<script type='text/javascript'>
var ohab = [];
ohab["startList"] = ["Science","Math", "Politics", "PEHM", "Others"]
ohab["Science"] = ["Phisics","Astronomy","Anatomy"];
ohab["Phisics"] = ["one","two","three"];
ohab["Astronomy"] = ["Stars","Moon","Planets"];
ohab["Anatomy"] = ["Phisical","Muscular","Skeletal"];
ohab["Math"] = ["Basic","Algebra","Calculus"];
ohab["Politics"] = ["Government","Congress","Presidential"];
ohab["PEHM"] = ["Basketball","Volleyball","Soccer"];
ohab["Others"] = ["Homeroom","Discussion","Councelling"];
ohab["Basic"] = ["ADD","Subtract","Mult"];
ohab["Algebra"] = ["Graphic","Spreadsheet","Scetch"];
ohab["Calculus"] = ["Graphic","Spreadsheet","Scetch"];

var nLists = 3; // number of select lists in the set

function fillSelect(currCat,currList){
var step = Number(currList.name.replace(/\D/g,""));
for (i=step; i<nLists+1; i++) {
document.forms['ohabForm']['List'+i].length = 1;
document.forms['ohabForm']['List'+i].selectedIndex = 0;
}
var nCat = ohab[currCat];
for (each in nCat) {
var nOption = document.createElement('option');
var nData = document.createTextNode(nCat[each]);
nOption.setAttribute('value',nCat[each]);
nOption.appendChild(nData);
currList.appendChild(nOption);
}
}

function getValue(L3, L2, L1) {
alert("Your selection was:- \n" + L1 + "\n" + L2 + "\n" + L3);
}

function init() {
fillSelect('startList',document.forms['ohabForm']['List1'])
}

navigator.appName == "Microsoft Internet Explorer" ? attachEvent('onload', init, false) : addEventListener('load', init, false);
</script>
</head>
</script>
<body>
<form name="ohabForm" action="">
<table border="1">
<tr>
<td>
<p>Select Subject</p>
</td>
<td><p>Select a Topic</p></td>
<td><p>Select a Topic 2</p></td>
</tr>
<tr>
<td>
<select name='List1' onchange="fillSelect(this.value,this.form['List2'])">
<option selected>Choose a Subject</option>
</select>
</td>
<td>
<select name='List2' onchange="fillSelect(this.value,this.form['List3'])">
<option selected>Choose a Topic </option>
</select>
</td>
<td>
<select name='List3' size="2" multiple="yes" onchange="getValue(this.value, this.form['List2'].value,
this.form['List1'].value)">
<option selected >Choose Topic2</option>
</select>

</td>
</form>
</body>
</html>


I've been doing some tweaks on how to make the behavior just like this but still no luck. sorry for being spoon-feeded guy

 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: Kiddie problem on my form