Tom's Guide | Tom's Hardware | Tom's Games
 |
 |
 |
What I am trying to do is create a join form to an rpg for a friend. What I need is to link 2 a set of radio buttons to a drop down menu.
I found a code at http://www.htmlgoodies.com/tutorial... however it doesn't work. I've edited the code for my form and options. http://tsa-36.com/join2.html you can check the code and see that it isn't working.
If anyone else has a better code or can help it would be appreciated
There's a lot of problems with that code.
Some of the functions are referring to field 'section' and some are referring to 'section2'. Some radio button fileds have the same value.
And you are not paying attention to your quote marks. You should enclose parameter values within tags inside double quote marks. In the first onclick trigger the value has an extra quote at the end of the value. And in the first new Option you have a single quote inside single quotes ('Counselor's Aide','1'); } Basically, the whole code is "messy".
Also, the code you are using for repopulating the select list is very inefficient.
Here is what I would do:
1) Create arrays for the different lists like this to populate the select list. Name them exactly the same as the values of the various radio button options, like this:
Counseling = new Array("Counselor","Counselor's Aide");
2) Add an id to any select fields that you will want to repopulate like this:
<select name="section" id="section">
3) Add this function:
function changeSelect(selectID, arrayList) {
optionList = arrayList; //arrayList[arrayKey];
selectObj = document.getElementById(selectID);
selectObj.options.length = 0;
for (i=0; i<optionList.length; i++) {
selectObj.options[selectObj.options.length] = new Option(optionList[i],i);
}
}4) On the onclick triggers just call the function passing the select field id and the value of the radio button option being clicked, like this:
<input onclick="changeSelect('section', this.value);" type="radio" value="Counseling" name="Department">That's it. It makes the code much cleaner and maintenance will be a breeze.
Michael J
0 
First if you'll notice the value's in the two lists are the same not the "name"
one set of options is named "department1" the other "department2". As for the "section" it is that way so I can tell first choice from second.
I'll try yours though.
These scripts confuse me. I often have to stare at it for awhile before I can begin to understand it.
Right now I'm trying to figure out which part of that code I need to edit.
0
First if you'll notice the value's in the two lists are the same not the "name"
I have no idea what you are trying to say here. If you are referring to my statement of "Some radio button fileds have the same value." you did not check your code.
The radio button labeled "Counseling" has the value "Counseling" AND the radio button labeled "Engineering" ALSO has the value "Counseling".
I just noticed that I made a last minute change to my code before posting that would not make it work. On step 4 you would need to use the name of the array with the list of values in place of this.value.
The code is very simple. The onclick trigger will pass two values to the function: 1-The ID of the select field you want to modify and 2) the name of the array with the values to populate. The function will then repopulate the select list identified by the ID with the values of the array. Here is a working example using s sample of your data:<html>
<head>
<script>
//Arrays w/ Select values
Counseling = new Array(
"Counselor","Counselor's Aide");
Engineering = new Array(
"Communications","Computer Systems","Damage Control","Impulse Systems","Matter/Energy Systems",
"Sensor Systems","Shuttlecraft Maintainance","Structural/Environmental Systems",
"Transporter Chief","Warp/Quantum Transwarp Systems","Engineer");
Medical = new Array(
"Doctor","Nurse","Medical Technician");function changeSelect(selectID, arrayList) {
optionList = arrayList; //arrayList[arrayKey];
selectObj = document.getElementById(selectID);
selectObj.disabled = false;
selectObj.options.length = 0;
for (i=0; i<optionList.length; i++) {
selectObj.options[selectObj.options.length] = new Option(optionList[i],i);
}
}</script>
</head>
<body>
<input onclick="changeSelect('section',Counseling);" type="radio" value="Counseling" name="Department"> Counseling
<br>
<input onclick="changeSelect('section',Engineering);" type="radio" value="Engineering" name="Department"> Engineering
<br>
<input onclick="changeSelect('section',Medical);" type="radio" value="Medical" name="Department"> Medical
<br>
<select name=section disabled>
<option>Please Select a Department</option>
</select></body>
</html>
0
I got the script to work but in the email i recieve where the drop down list with the options are it gives numbers. Is there anyway to have it input the text of the option?
0
Is there anyway to have it input the text of the option?
Of course, I was just following the code from your original script which was populating the values with numbers.
function changeSelect(selectID, arrayList) {
optionList = arrayList; //arrayList[arrayKey];
selectObj = document.getElementById(selectID);
selectObj.disabled = false;
selectObj.options.length = 0;
for (i=0; i<optionList.length; i++) {
selectObj.options[i] = new Option(optionList[i],optionList[i]);
}
}Michael J
0 0
It's not perfect by any means - I only put it together for this post (for example there should be some error handling). But, I have had a lot of experience in my previous employment in creating highly dynamic forms with a lot of validation.
But, I am always surprised by the poor quality of sample scripts that are made available.
Michael J
0  |
 |
 |
This post is quite old and has been locked from receiving new replies. Please create a new posting instead.
| Ads by Google |
