Learn VBA & Macros in 1 Week!

JavaScript - Batch Moving Options From One Select To Another

Full Excel VBA Course - Beginner to Expert

Batch Moving Options From One Select To Another	View Content

This code is supposed to batch transfer options between selects. It works flawlessly for single values, but when I select multiple options, all of them get deleted, but only one transferred. Any help is greatly appreciated! Thank you.

Code:

<html>
    <head>
        <title></title>
        <script type="text/javascript">
            function removeOptionSelected(b,j)
                {
                  var elRem = document.getElementById(b);
                  var elAdd = document.getElementById(j);
                  var elOptNew = document.createElement('option');
                  var i;
                  for (i = elRem.length - 1; i>=0; i--) {
                    if (elRem.options[i].selected) {
                        //alert(elRem.options[i].text+' '+elRem.options[i].value+' deleted!')
                        elOptNew.text = elRem.options[i].text;
                        elOptNew.value = elRem.options[i].value;
                        try {
                            elAdd.add(elOptNew, null); // standards compliant; doesn't work in IE
                        }
                            catch(ex) {
                            elAdd.add(elOptNew); // IE only
                        }
                        elRem.remove(i);
                    }
                  }
                }
        </script>
        <style type="text/css">
            div {
                float: left;
                /*border: 1px solid black;*/
            }
            div.contain {
                width: 536px;
                height: 500px;
                border: none;
            }
            div.side {
                width: 215px;
                height: 500px;
            }
            div.middle {
                width: 100px;
                height: 300px;
                padding-top: 200px;
            }
            select {
                width: 200px;
                height: 500px;
            }
            input {
                width: 82px;
                margin-bottom: 10px;
            }
        </style>
    </head>
    <body>
        <div class="contain">
            <div class="side">
                <form name="left">
                    <select id="left" class="left" multiple name="out">
                        <option value="apple">apple</option>
                        <option value="banana">banana</option>
                        <option value="orange">orange</option>
                        <option value="tangerine">tangerine</option>
                        <option value="pineapple">pineapple</option>
                        <option value="carrot">carrot</option>
                        <option value="grapefruit">grapefruit</option>
                        <option value="plum">plum</option>
                        <option value="blueberry">blueberry</option>
                        <option value="strawberry">strawberry</option>
                        <option value="cashews">cashews</option>
                        <option value="peanuts">peanuts</option>
                    </select>
                </form>    
            </div>
            <div class="middle">
                <input type="button" value="Add-->" onClick="removeOptionSelected('left','right');" />
                <input type="button" value="<--Remove" onClick="removeOptionSelected('right','left')" />
            </div>
            <div class="side">
                <form name="right">
                    <select id="right" class="right" multiple name="out">
                        <option value="greenbeans">greenbeans</option>
                        <option value="walnuts">walnuts</option>
                    </select>
                </form>    
            </div>
        </div>
    </body>
</html>

Full Excel VBA Course - Beginner to Expert

Forms: Select Options, Filtered By Another Select Option

Similar Tutorials

View Content

Hey chaps, hope someone can help with this:
I have a PHP form, with a couple of dynamic Select menus, which are populated from two SQL tables:
// tbl_main_colour:
Code:

ID, NAME
1, Red
2, Blue
3, Green

// tbl_shade_colour:
Code:

ID, NAME, FK_MAIN_COLOUR_ID
1, Light Red, 1
2, Dark Red, 1
3, Light Blue, 2
4, Dark Blue, 2
5, Light Green, 3
6, Dark Green, 3

What I'm after is something to filter the second select option, after the first select option has been chosen
// Select 1:
Code:

Red

// Select 2:
Code:

Light Red
Dark Red

I'm pretty sure this is possible, but not sure how to go about it, any help would be most appreciated.

Change Options Of Select Based On Selection In Other Select

Similar Tutorials

View Content

I've been having problems getting my select option to change the options of another select option. I'm not much of a javacsript coder, so I'm at a lost.

When I select the first option nothing appears in the second option.

here's the javascript code:

Code:

function createOption(OptionText, OptionValue){
var temp = document.captcha_form("option");
temp.innerHTML = OptionText;
temp.value = OptionValue;
return temp;
}

function valChange(){
    var firstList = document.getElementById("emailaddress");
    var secondList = document.getElementById("subject");
    while(secondList.hasChildNodes())
        secondList.removeChild(secondList.childNodes[0]);
    switch(firstList.value){
        case "1":{
             secondList.appendChild(createOption("Report Site Browsing Issue", Report Site Browsing Issues));
             secondList.appendChild(createOption("Report Page Errors", Report Page Errors));
             secondList.appendChild(createOption("Other", Other));
             break;
        }
        case "2":{
             secondList.appendChild(createOption("Report Unauthorized Game", Report Unauthorized Game));
             secondList.appendChild(createOption("Report Spam", Report Spam));
             secondList.appendChild(createOption("Report Harassment", Report Harassment));
			 secondList.appendChild(createOption("Report Illegal Activities", Report Illegal Activities));
			 secondList.appendChild(createOption("Request Account Removal", Request Account Removal));
             break;
        }
// ....
        default:{
             secondList.appendChild(createOption("Please select from the first list", ""));
             break;
        }
    }
}
 
window.onload = valChange;

this is the form code

Code:

<div class="mailto_form">
<form method="POST" id="captcha_form" name="captcha_form" action="../includes/mailform.php">
<div style="padding-bottom: 1em;">Choose Recipient: <select name="emailaddress" id="emailaddress" onchange="valChange();">
	<option value=""></option>
	<option value="1">Webmaster</option>
		<option value="2">Admin</option>
		</select>
  </div>
	

<div style="padding-bottom: 1em;">Subject: <br /><select name="subject" id="subject">
  </div>
  
  	<div style="padding-bottom: 1em;">From: <br /><input type="text" name="email" id="email" value="">
	</div>
  
		<div style="padding-bottom: 1em;">Enter the text contained in the image into the text box:
					<br /><img src="../includes/captcha.php" />
					<br /><input type="text" name="userpass" value="">
	</div>
	<div style="padding-bottom: 1em;">Message:
					<br /><textarea name="message" id="message" rows="10" cols="60"><?php echo "</tex" . "tarea>"; ?>				
	</div>
	
	<div style="padding-bottom: 1em;"><input name="submit" type="submit" value="Submit">
	</div>
</form>


</div>

Link to the page http://www.netgamegurus.com/contact/

Add/remove Select Options Based On Another Select Value

Similar Tutorials

View Content

Hello, I am trying to make a simple code that has a selection list (with the choice fruit or veggie). When the user chooses fruit, the second list displays the options apple, orange, banana. When the user changes their choice to veggie, the second select list then contains carrot, corn, potatoes (and the apple, orange, banana disappear).

I need some advice on how to do this

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Untitled</title>
</head>
<body>
<form name = "form1">
 <fieldset>
  <legend>Fruit or Veggie</legend>
	<select name = "S1">
	  <option name = "fruit">Fruit </option>
		<option name = "veggie">Veggie</option>
	</select>
	<select name = "S2"
	</select>
 </fieldset>
</form>

<script language="JavaScript" type="text/javascript">

???

</script>
</body>
</html>

Load Select Options From Other Select Box

Similar Tutorials

View Content

I have a select box that has ~7000 options, that based on a different dropdown select & input field, gets filtered to 0 - 300 entries.

I have another select dropdown that has 13000+ options in total for all the ~7000 entries, but each entry may have 1 to 5 options of these 13000.

Is there a way to change the options of the last select dropdown based on what the user chooses in the filtered select box? Currently the idea I'm having is to have the browser load all 13000+ items and filter out the ones that don't apply to the currently selected item, but I'm not sure what kind of lag the user would experience while the browser loads & filters through all these items.

Any help would be appreciated. Thanks.

How To Wipe An Existing Select Options And Add New

Similar Tutorials

View Content

If i have an existing HTML Select statement with options specified, and then based on an even, i want to rebuild that options list, how do I wipe the existing options parameters in order to add new ones? Is that even possible?

Cycle Through Options In Select Box Using Onclick

Similar Tutorials

View Content

Hello!

I'm trying to figure out a way of having + and - buttons which cycle through the options in a select box such as:

<select name="distance" id="jr_radius">
<option value="0.5">0.5 Miles</option>
<option value="1">1 Mile</option>
<option value="3" selected="selected">3 Miles</option>
<option value="5">5 Miles</option>
<option value="10">10 Miles</option>
</select>

So far I've only been able to have a button change the select box to a specific value, or add or subtract to a numerical value. Both of which aren't quite right.

Ideally if the default value is "3" then clicking the + button could make it "5" and clicking the same button again would make it "10". Visa versa, the minus button would make the value "1" and then if pressed again it would become "0.5".

Does that make sense? Any help will be greatly appreciated!

Help With Dynamically Added Select Options

Similar Tutorials

View Content

Hi all,
I have table in Javascript and it has addrow, deleterow, submit, and functions.
when i click it automatically adds new row and it has select option to choose some of them
for ex. in added two rows and one of drop down combox i chose Motherboard Asus and from other i chose Motherboard Gigabyte.

So i need once i select the name from combobox, should not allow user to select same name in coming rows

Here is my code.

Thanks beforehands

PHP Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head><title>dinamik sheet</title>
<script>
var i=iteration;
function addrow(){
    var tbl = document.getElementById('sheet');
    var iteration = tbl.rows.length;
document.getElementById('count_rows').value = iteration;
    var row=tbl.insertRow(iteration);

    var cellLeft = row.insertCell(0);
    var textNode = document.createTextNode(iteration);
    cellLeft.appendChild(textNode);

    var cellRight = row.insertCell(1);
    var el = document.createElement('input');
    el.type = 'text';
    el.name = 'txtRow'+iteration;
    el.id = 'txtRow'+iteration;
    el.size = 15;
    el.value = '0';
    el.onblur = sum;
    cellRight.appendChild(el);

    var cellRight = row.insertCell(2);
    var elaz = document.createElement('input');
    elaz.type = 'text';
    elaz.name = 'txtRowaz'+iteration;
    elaz.id = 'txtRowaz'+iteration;
    elaz.size = 20;
    elaz.value = '0';
    elaz.onblur = sum;
    cellRight.appendChild(elaz);



    var cellRight1 = row.insertCell(3);
    var ela = document.createElement('input');
    ela.type = 'text';
    ela.name = 'txtRowe'+iteration;
    ela.id = 'txtRowe'+iteration;
    ela.size = 20;
    ela.value = '0';
    ela.onblur = sum;
    cellRight1.appendChild(ela);

    var cellRightsel = row.insertCell(4);
    var sel = document.createElement('select');
    sel.name = 'selRow' + iteration;
    sel.id = 'selRow' + iteration;
    sel.onchange = sum;
    sel.options[0] = new Option('MotherBoard ASUS', 'MotherBoard ASUS');
    sel.options[1] = new Option('MotherBoard Gigabyte', 'MotherBoard Gigabyte');
    sel.options[2] = new Option('MotherBoard MSI', 'MotherBoard MSI');
    sel.options[3] = new Option('Graphiqcard ASUS', 'Graphiqcard ASUS');
    sel.options[4] = new Option('GraphigCard ATI', 'GraphigCard ATI');
    sel.options[5] = new Option('GraphigCard GefORCE', 'GraphigCard GefORCE');
    cellRightsel.appendChild(sel);
    sum();
}
function removeRowFromTable()
{
  var tbl = document.getElementById('sheet');
  var lastRow = tbl.rows.length;
  if (lastRow > 2) tbl.deleteRow(lastRow - 1);
}

function sum(){
    var s1 = 0;
    var s2 = 0;
    var tbl=document.getElementById('sheet');
    var iteration=tbl.rows.length-1;
    for(var i=1; i<=iteration; i++){//loop through table rows
        var el1 = document.getElementById('txtRow'+i);//Row's Income field
        var el2 = document.getElementById('selRow'+i);//Row's percentage menu
        var ela = document.getElementById('txtRowe'+i);//Row's Tax cell
        var elaz=document.getElementById('txtRowaz'+i);

        if(!el1 || !el2 || !ela||!elaz) continue;
        var txt = el1.value;
        if(txt != ( '' + Number(txt) )) continue;  //reject non-numeric entries

var tax = Number(txt) * Number(130);

if(el2[el2.selectedIndex].value=="MotherBoard Gigabyte"){
    var  tax = Number(txt) * Number(150);


}
if(el2[el2.selectedIndex].value=="MotherBoard MSI"){
    var  tax = Number(txt) * Number(100);

}
if(el2[el2.selectedIndex].value=="Graphiqcard ASUS"){
    var  tax = Number(txt) * Number(85);

}
if(el2[el2.selectedIndex].value=="GraphigCard ATI"){
    var  tax = Number(txt) * Number(95);

}
if (el2[el2.selectedIndex].value=="GraphigCard ATI")
{

        var tax = Number(txt) * Number(88);
}

        ela.value = tax.toFixed(2);
        elaz.value=tax.toFixed(2)/Number(txt);
        if(isNaN(elaz.value)){
        elaz.value=0;
        }
        s1 += Number(txt);
        s2 += tax;

}
    var t1 = document.getElementById('total');
    var t2 = document.getElementById('taxtotal');
    if(t1){ t1.value = s1.toFixed(2); }
    if(t2){ t2.value = s2.toFixed(2); }
}

onload = function(){
    addrow();
}
</script>
</head>
<body>
<form name="eval_edit" method="POST" action="part1.php?id=iteration-1">
<table align="center" width="75%">
<tr>
<td align="center">Balance sheet</td></tr>
<tr>
<td align="center">
    <table id="sheet" border="1">
    <tr><td>object</td><td>Total amount</td><td>One ITEM Price</td><td name="amount">Total Item Price </td><td>Name</td></tr>

    </table>
</td>
</tr>
<tr>
<td align="center">
<input type="hidden" name="count_rows" id="count_rows" />
<input type="button" value="Add" onclick="addrow()" />
<input type="button" value="Remove" onclick="removeRowFromTable()" />
<input type="button" value="SUM" onClick="sum()"/>
<input type="submit" value="Submit" /><br />
</td>
</tr>
<tr>
<td align="left">
<input id="total" name="total" type="text"/>total amount of products<br />
<input id="taxtotal" name="taxtotal" type="text"/>total price of products
</td>
</tr>
</table>
</form>

</body>
</html>

Removal Of Select Options - Last Option Won't Remove

Similar Tutorials

View Content

Hey guys.... me again.... tried doing this a few different ways but it seems no matter what I do the last option won't remove for some reason..... if it's the only option, it won't remove either. as it's the last one.

Here is my code..

PHP Code:
function removeCats() {

    // Set selected category list
    var sel_cats = document.getElementById('cat_sel');

    for (i = sel_cats.length-1; i >= 0; i--) {

        // Check if the cat is selected

        if (sel_cats.childNodes[i].selected == true) {

            // Remove the category
            sel_cats.removeChild(sel_cats.childNodes[i]);

        }

    }

}

Thanks again guys!

Assigning Indices Of Options In A Select Menu In Ie

Similar Tutorials

View Content

*Edit: I thread title should probably be "Initialize indices..."*

I've done quite a bit of research but couldn't find what I need to know so here I am.

I have some javascript generated by php that reads a configuration file to add options to a select menu. This is somewhat irrelevant but... these options are removed from the menu when clicked and data related to the option is shown on the page... and the option gets re-added when the data is closed. I need the option to go back in the correct place/order in the select menu... which wouldn't be a problem if I could initialize the indices of the menu's options. They need to be initialized because when the page is created, saved settings are read and certain options are not shown in the list because they may already be shown according to the settings... meaning... since browsers automatically increment the indices of the options by 1 (starting at 0), if data is closed that was initially open and therefore not in the select menu at first... the key/index associated with that data will likely not match the correct menu order.

Code:

<script type="text/javascript">
	function addOptionToSelect(selectID,index,offset,val,txt) {
		var elSel = document.getElementById(selectID);
		elSel.options[index+offset].value = val;
		elSel.options[index+offset].text = txt;
	}
	function addLoadEvent(func) {
		var oldonload = window.onload;
		if (typeof window.onload != 'function') {
			window.onload = func;
		} else {
			window.onload = function() {
				if (oldonload) {
					oldonload();
				}
				func();
			}
		}
	}
<?php
	foreach ($props as $k => $prop) {
		if (!in_array($prop, $_SESSION['crProps'])) {
?>
	addLoadEvent(addOptionToSelect('propertySelect',<?php echo $k; ?>,1,'?p=<?php echo $prop; ?>&k=<?php echo $k; ?>','<?php echo $prop; ?>'));
<?php
		}
	}
?>
</script>

For example, suppose I have the following potential data sets: a,b,c,d,e,f

In the config file that helps create the page, suppose it is something like: <Default>0:a|2:c|3:d</Default>
(FYI: I've designed it so that the data set names/options are separated by the pipe character ("|") and their corresponding index is the number to the left of the colon.)

Then the select menu that is initially generated would be something like:
(Every other data set name except for what is already open by default.)
<select id="bleh">
<option value="b">b
<option value="e">e
<option value="f">f
</select>

And by default, browsers would assign the indices like so:
(skipping getElementById and all that...)
select.options[0].value = b
select.options[1].value = e
select.options[2].value = f

Whereas, I need it to be initialized like this:
select.options[1].value = b
select.options[4].value = e
select.options[5].value = f

So that when the data sets initially open are closed (a, c, or d)... they get put in the correct position in the list.

I just thought of something... it's a little inefficient (OCD lol) but it should work and at worst would only cost a couple of milliseconds of processing time. A solution to this problem might be to load the menu with all options so that their indices are correct... and remove the defaults afterward. I'll try it.

How Do You Change The Image Upon Changing The Options In Select Drop Down Box?

Similar Tutorials

View Content

all i have to do is the image to change automatically based on the option you selected from the drop down list.
here is the code, any help is appreciable. thanks in advance.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
img{
height:95px;
width:95px;
display:block;
margin-top:10px;
}
#caption{
font-family:Verdana,tahoma,arial;
font-size:8pt;
text-align:left;
display:block;
width:250px;
}
</style>
<script type="text/javascript">
window.onload=function()
{
var caption=['Default Image Caption',
'begonia',
'daffodils',
'mixture',
'natural',
'purple',
'red flower',
'sunflower',
'tulip',
'two flowers'], // This will be your images caption
bp='..\images', //base url of your images
imgnum=9, //Number of your images. This should match on your comboboxes options.
thumb=document.getElementById('thumb'), //id of your image that will be changing
description=document.getElementById('caption'), //id of your caption
combobox=document.getElementById('selection'); // id of your combobox.

combobox.onchange=function()
{
thumb.src=bp+'Picture'+this.value+'.jpg';
description.innerHTML=caption[this.value];
}
}
</script>
</head>
<body>
<label>Please Change the pictu </label>
<select id="selection">
<option>Change Picture</option>
<option value="1">begonia</option>
<option value="2">daffodils</option>
<option value="3">mixture</option>
<option value="4">natural</option>
<option value="5">purple</option>
<option value="6">red flower</option>
<option value="7">sunflower</option>
<option value="8">tulip</option>
<option value="9">two flowers</option>
</select>
<br>
<img src="..\images" alt="mypic" id="thumb">
<span id="caption">Caption for the default Image</span>
</body>
</html>
thanks again

Change Image Based On Multiple Select Options

Similar Tutorials

View Content

Hello, I just joined the forum. I'm hoping someone could help me out or point me in the right direction.

I am trying to set up a simple interaction for users. The user would be required to select a width then height from two separate drop down menus. I used this as an example to work from: http://www.w3.org/TR/WCAG20-TECHS/wo...dynselect.html

The list of heights would not be available until the user selects a width.(similar to the example link above). Each width would have slightly different heights associated with it. After the user selects a width then height an image would be displayed based on that combination. So for example if the user selects 12w/30h they would see "01.jpg" if the user selects 12w/36h they would see "02.jpg". This would all be done on the same page. The user should be able to update the image by combining the different width/height options indefinitely.

If anyone has a link to an example or can provide a basic structure I could build of off I would be extremely grateful, thanks.

Change From Input Field To Select Options Causes Problems

Similar Tutorials

View Content

Hi there,

I am a new javascript guy - struggling a bit but marching on -

The following code works fine to set a form field -

Code:

document.getElementById("ZS_Land").value = (empLand.innerHTML);

However, I changed to form field into a select with option list, and I need it to set an option from the select now - the select has the same name/id as the field had, but is not working

Any ideas how I do that ?

Many thanks in advance

Glorifindal

Changing Html Select Options Based On Other Selection With Javascript And Php

Similar Tutorials

View Content

Dear all,

background information:
I did code a timesheet management system for my company with PHP where the user has to submit time entries and has an online form with several start and end times. The start and end times are all simple HTML select option dropdowns. I want that the first End time selection will be the next start time selection. Basically a simple dependency of the dropdown. My approach was that I want to solve this with JavaScript. In my php code I am echoing the following (in this select the end times are the values):

echo "<select class='normal' name='$field_id' onChange=set_time_hour(this.value,'$field_id_js')>";

When the user changes then the end time dropdown the next field (next start time entry) should be changed accordingly.

The javascript looks like this

function set_time_hour(hour_value,next_field){
alert (hour_value);
alert (next_field);
document.getElementById(next_field).value = hour_value;
}

The alert calls are giving me the right values. but the

document.getElementById(next_field).value = hour_value;

is not working. What is wrong there? Do you have an idea?

How can I change the value of a select box with Javascript?

The select box values are already popoluated with PHP so I just want to select the right value.

Adding Options In Select Widget Not Working In Internet Explorer

Similar Tutorials

View Content

Hi All,

I have a javascript function which adds a label and value to a select widget in its parent window. The function is working fine in firefox and chrome without any errors or warnings. But it is not working in internet explorer. Please tell me what the issue is. Thanks in advance for your help.

Code:

function addToParent( formName, selectName, name, label ) {

    var parent       = window.opener;
    var selectWidget = parent.document.forms[formName].elements[selectName];

    if( selectWidget ) {

        var length = selectWidget.length;
        selectWidget[length] = new Option( name, label, false, false );
    }
}

When I tried to debug, internet explorer shows an error in the following line

Code:

selectWidget[length] = new Option( name, label, false, false );

Is there anything wrong with this statement ??

Batch File Issue

Similar Tutorials

View Content

I'm trying to code something in batch and i need some help...

I need to change the batch files dir to the only folder in the next folder
IE:
move from folder 1 to folder 2

contents of folder 1:
folder 2

however i don't know the real name of folder 2 so I need batch file to like pick the folder by its number or something....

is there a solution(i would like to code this in batch)

Drop-down - Show Options Dependent On Options In Another Drop-down

Similar Tutorials

View Content

Okay, I'm having some trouble getting my head around how to do this..

Code:

<select>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>

<select>
<option value="Rhino">Rhino</option>
<option value="Bird">Bird</option>
<option value="Rooster">Rooster</option>
</select>

<select>
<option value="0202A">Rhino - Text</option>
<option value="0203A">Rhino - Text2</option>
<option value="0204A">Bird - Text1</option>
<option value="0205A">Bird - Text2</option>
<option value="0202B">Rhino - Text</option>
<option value="0204B">Rhino - Text2</option>
<option value="0204C">Rooster - Text1</option>
<option value="0205C">Rooster - Text2</option>
<option value="0206C">Rooster - Text3</option>
</select>

So say we had those three drop-downs. I'm looking to make it so that second drop-down only has options corresponding to a relationship between the first and the third drop-down. Example - if you select A in the first drop-down you only see Rhino and Bird in the second drop-down. If you select B you will only see Rhino in the second drop-down. Lastly, if you select C you will only see Rooster in the second drop-down.

Just can't figure this out. >.<

Drop Down Options

Similar Tutorials

View Content

I've got 2 drop down boxes, dropdown1 and dropdown2, and i want certain options on dropdown2 to be greyed out or unavailable if certain selections are made in dropdown1.

is this possible? and if so, how?

thanks

Overlib Other Options

Similar Tutorials

View Content

Hi

I am trying to use Overlib code to develop a dropdown box area that I can populate with categories and buttons, however the Overlib seem to lie relevent to the mouse and not the button.

Does anyone know any good examples maybe jquery, to create this type of large dropdown.

I want to be able to populate the area with images, and categories using php.

I hope this make some sense.

Steve

Change 2nd Select Values Based On 1st Select

Similar Tutorials

View Content

Hi JS Experts,

I am working on a class registration system that requires students to register for a main class (101, 102 or 103). The student is supposed to select one main course as well as provide a second choice in case the first is not available. I have two dropdown select fields to capture data

1) Choice -1: 101 / 102 / 103 ( Student needs to select one - Reading the classID from classes table)
2) Choice -2: 101 / 102 / 103 ( If student selects 101 in Choice-1 then the only classes available under Choice-2 should be 102 or 103).

How can I accomplish the above?

Further to this there are two fields on the form where I would like to auto populate based on what they have selected in Choice-1 and Choice-2.

For Example:
If a parent selects choice1: 101 the child Choice1 field should autopopulate with 100.
If a parent selects Choice2: 201 the child Choice2 field should autopopulate with 200

Any help would be really appreciated. Thanks

Vinny

One Select List Updates All Select Lists

Similar Tutorials

View Content

Hey Guys
When a user changes the select list called "reason_code_master" I need the uodatecodes() function to update all the other select list with the id of "reason_codes" with the same . How can I do this.

<select size='1' onchange="updatecodes()" name='reason_code_master'>
<option value='' > - SET REASON - </option>
<option value='BROKEN' >BROKEN</option>
<option value='ENTERED' >ENTERED</option>
<option value='SHORT' >SHORT</option>
</select>

<select size='1' name='reason_codes' id='reason_codes'>
<option value='' > - SET REASON - </option>
<option value='BROKEN' >BROKEN</option>
<option value='ENTERED' >ENTERED</option>
<option value='SHORT' >SHORT</option>
</select>
<select size='1' name='reason_codes' id='reason_codes'>
<option value='' > - SET REASON - </option>
<option value='BROKEN' >BROKEN</option>
<option value='ENTERED' >ENTERED</option>
<option value='SHORT' >SHORT</option>
</select>
<select size='1' name='reason_codes' id='reason_codes'>
<option value='' > - SET REASON - </option>
<option value='BROKEN' >BROKEN</option>
<option value='ENTERED' >ENTERED</option>
<option value='SHORT' >SHORT</option>
</select>
<select size='1' name='reason_codes' id='reason_codes'>
<option value='' > - SET REASON - </option>
<option value='BROKEN' >BROKEN</option>
<option value='ENTERED' >ENTERED</option>
<option value='SHORT' >SHORT</option>
</select>