|
JavaScript - Drop Down List + Action & Remeber Selection
hello,
i am more a designer than a developer so i need your help. i want to create a form containing : 1. drop down list of countries (that i managed to create) 2. action on selection (redirect to a link on country selection) 3. post the selected option into a text box below and remeber (if possible) The remeber part is optional . I want a form where user will select country , based on the selection to be redirected to a link and message display , you selected : [textarea]Option[/textarea] can it be done? Similar TutorialsHi all, I have been struggling on a bit of code for a while now. I need to populate a second drop down list (Region) based upon the selection of the first (County). I have found a piece of code that works on its own and have adapted to suit my needs - see below. However, when I drop it into my main page the javascript is not working. It's because of the formObject but I just don't know enough to resolve this! Furthermore, I need the textboxes the user has already completed in the form to retain their value once the javascript kicks in as the completed form will submit to a database. This piece of code is working well . . . . Code: <?php
$link = mysql_connect('myhost', 'myusername', 'mypassword') or die('Could not connect: ' . mysql_error());
mysql_select_db('mydatabase') or die('Could not select database');
if(isset($_GET["County"]) && is_numeric($_GET["County"]))
{
$County = $_GET["County"];
}
if(isset($_GET["Region"]) && is_numeric($_GET["Region"]))
{
$Region = $_GET["Region"];
}
?>
<script language="JavaScript">
function autoSubmit()
{
var formObject = document.forms['theForm'];
formObject.submit();
}
</script>
<form name="theForm" method="get">
<!-- County SELECTION BASED ON city VALUE -->
<?php
?>
<select name="County" onChange="autoSubmit();">
<option value=''</option>
<?php
//POPULATE DROP DOWN MENU WITH COUNTRIES FROM A GIVEN city
$sql = "SELECT * FROM county_regions";
$counties = mysql_query($sql,$link);
while($row = mysql_fetch_array($counties))
{
echo ("<option value=\"$row[CountyID]\" " . ($County == $row["CountyID"]? " selected" : "") . ">$row[County]</option>");
}
?>
</select>
<?php
?>
<br><br>
<?php
if($County!= null && is_numeric($County))
{
?>
<select name="Region" onChange="autoSubmit();">
<?php
//POPULATE DROP DOWN MENU WITH RegionS FROM A GIVEN city, County
$sql = "SELECT * FROM county_regions WHERE CountyID = $County ";
$Regions = mysql_query($sql,$link);
while($row = mysql_fetch_array($Regions))
{
echo ("<option value=\"$row[CountyID]\" " . ($Region == $row["CountyID"]? " selected" : "") . ">$row[Region]</option>");
}
?>
</select>
<?php
}
?>
What follows is my form where the javascript is not working - edited quite a bit to save on space! Code:
<head>
<script language="JavaScript">
function autoSubmit()
{
var formObject = document.forms['subform'];
formObject.submit();
}
</script>
</head>
<form enctype="multipart/form-data" method="post" action="add_attraction01.php" FORM NAME="FormName">
<input type="hidden" name="MAX_FILE_SIZE" value="32768" />
<label for="Business_name">Business Name</label>
<input type="text" size="60" STYLE="color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 12px; background-color: #72A4D2;"
<id="Business_name" name="Business_name" maxlength=60/><font size="1" face="arial" color="red">Required field</font><br />
<label for="StreetAddress">Address</label>
<input type="text" size="60" rows="2" id="StreetAddress" name="StreetAddress" maxlength=120/><font size="1" face="arial" color="red">Required field</font><br />
<label for="Town">Town</label> <input type="text" size="25" id="Town" name="Town" maxlength=25/><font size="1" face="arial" color="red">Required field</font><br />
<?php
$link = mysql_connect('myhost', 'myusername', 'mypassword') or die('Could not connect: ' . mysql_error());
mysql_select_db('mydatabase') or die('Could not select database');
if(isset($_GET["County"]) && is_numeric($_GET["County"]))
{
$County = $_GET["County"];
}
if(isset($_GET["Region"]) && is_numeric($_GET["Region"]))
{
$Region = $_GET["Region"];
}
?>
<form name = "subform" method="get">
<select name="County" onChange="autoSubmit();">
<option value=''</option>
<?php
$sql = "SELECT * FROM county_regions";
$counties = mysql_query($sql,$link);
while($row = mysql_fetch_array($counties))
{
echo ("<option value=\"$row[CountyID]\" " . ($County == $row["CountyID"]? " selected" : "") . ">$row[County]</option>");
}
?>
</select>
<?php
?>
<br><br>
<?php
if($County!= null && is_numeric($County))
{
?>
<select name="Region" onChange="autoSubmit();">
<?php
$sql = "SELECT * FROM county_regions WHERE CountyID = $County ";
$Regions = mysql_query($sql,$link);
while($row = mysql_fetch_array($Regions))
{
echo ("<option value=\"$row[CountyID]\" " . ($Region == $row["CountyID"]? " selected" : "") . ">$row[Region]</option>");
}
?>
</select>
<?php
}
?>
<input type="text" size="20"id="Tel_No" name="Tel_No" maxlength=20 onkeypress="return isNumberKey(event)"/><font size="1" face="arial" color="red">Required field</font><br />
<br/>
<input type="submit" value="Submit your attraction" name="submit" onclick="return BothFieldsIdenticalCaseSensitive();"/>
</form>
</body>
</html>
It's probably obvious to you guys!! Thanks in advance for your help. How can I open a selection from this drop down list in a new window? Code:
<html>
<!-- Stop Underline script available from http://www.themssforum.com/FontpageProgramming/Hyperlink-underline/ -->
<style type="text/css">
a { text-decoration: none;color: #003366; } /*makes the underline disappear for
all links*/
a:visited { color: #003366; }
a:hover { color: red; text-decoration: underline; } /*underlines links
when hovered over */
a:active { color: #003366; }
</style>
<head>
<TITLE>Travel</TITLE>
<META name="description" content="Premier online guide to leisurely travel">
<META name="keywords" content="English Lake District">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 6.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<SCRIPT LANGUAGE="JavaScript">
<!--
v=false;
//-->
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript1.1">
<!--
if (typeof(Option)+"" != "undefined") v=true;
//-->
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript">
<!-- Original: webreference.com -->
<!-- Web Site: http://webreference.com -->
<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Begin
if(v){a=new Array();aln=0;}
function getFormNum (formName) {
formNum =-1;
for (i=0;i<document.forms.length;i++){
tempForm = document.forms[i];
if (formName == tempForm) {
formNum = i;
correctForm = tempForm;
break;
}
}
return formNum;
}
function jmp(formName,elementNum) {
getFormNum(formName);
if (formNum>=0) {
with (document.forms[formNum].elements[elementNum]) {
i=selectedIndex;
if (i>=0) location=options[i].value;
}
}
}
function O(txt,url) {
a[k]=new Option(txt,url);k++;
}
function relate(formName,elementNum,j) {
if(v) {
k=1;
if(j==0) { // default category item
a=new Array();
O(">","");
}
<!-- Alston -->
if(j==1) { // 1st category items
a=new Array();
O("Local Directory : ->","");
O("South Tynedale Railway","http://www.lakesandcumbria.com/view/travel/index.htm#South Tynedale Railway");
}
<!-- Ambleside -->
if(j==2) { // 2nd category items
a=new Array();
O("Local Directory : ->","");
O("Lakeland Safari Tours","http://www.lakesandcumbria.com/view/travel/p2.htm#Lakeland Safari Tours");
}
<!-- Bowness-on-Windermere -->
if(j==3) { // 3rd category items
a=new Array();
O("Local Directory : ->","");
O("Adaptours","http://www.lakesandcumbria.com/view/travel/p2.htm#Adaptours");
O("Windermere Lake Cruises","http://www.lakesandcumbria.com/view/travel/index.htm#Windermere Lake Cruises");
}
<!-- Carlisle -->
if(j==4) { // 4th category items
a=new Array();
O("Local Directory : ->","");
O("Settle-Carlisle Railway","http://www.lakesandcumbria.com/view/travel/index.htm#Settle-Carlisle Railway");
}
<!-- Coniston -->
if(j==5) { // 5th category items
a=new Array();
O("Local Directory : ->","");
O("Coniston Launch","http://www.lakesandcumbria.com/view/travel/index.htm#Coniston Launch");
O("Steam Yacht Gondola","http://www.lakesandcumbria.com/view/travel/index.htm#Steam Yacht Gondola");
}
<!-- Glenridding -->
if(j==6) { // 6th category items
a=new Array();
O("Local Directory : ->","");
O("Ullswater Steamers","http://www.lakesandcumbria.com/view/travel/index.htm#Ullswater Steamers");
}
<!-- Keswick -->
if(j==7) { // 7th category items
a=new Array();
O("Local Directory : ->","");
O("Keswick launch","http://www.lakesandcumbria.com/view/travel/index.htm#Keswick Launch");
O("Landscape Minibus Tours","http://www.lakesandcumbria.com/view/travel/p2.htm#Landscape Minibus Tours");
}
<!-- Lakeside -->
if(j==8) { // 8th category items
a=new Array();
O("Local Directory : ->","");
O("Lakeside & Haverthwaite Railway","http://www.lakesandcumbria.com/view/travel/index.htm#Lakeside & Haverthwaite Railway");
}
<!-- Penrith -->
if(j==9) { // 9th category items
a=new Array();
O("Local Directory : ->","");
O("Cumbrian Discoveries","http://www.lakesandcumbria.com/view/travel/index.htm#Cumbrian Discoveries");
}
<!-- Ravenglass -->
if(j==10) { // 10th category items
a=new Array();
O("Local Directory : ->","");
O("Ravenglass & Eskdale Railway","http://www.lakesandcumbria.com/view/travel/index.htm#Ravenglass & Eskdale Railway");
}
<!-- Windermere -->
if(j==11) { // 11th category items
a=new Array();
O("Local Directory : ->","");
O("Alistairs of Windermere","http://www.lakesandcumbria.com/view/travel/p2.htm#Alistairs of Windermere");
O("Lakes Supertours","http://www.lakesandcumbria.com/view/travel/p2.htm#Lakes Supertours");
O("Mountain Goat","http://www.lakesandcumbria.com/view/travel/p2.htm#Mountain Goat");
O("Park Tours and Travel","http://www.lakesandcumbria.com/view/travel/p2.htm#Park Tours and Travel");
}
aln2=a.length;
getFormNum(formName);
if (formNum>=0) {
formNum = formNum + 1;
with (document.forms[formNum].elements[elementNum]) {
for (var i=options.length-1;i>0;i--) options[i]=null;
for (var i=1;i<aln2;i++) options[i-1]=a[i];
options[0].selected=true;
}
}
} else {
jmp(formName,elementNum);
}
}
function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs[i]=new Image; d.FP_imgs[i].src=a[i]; }
}
// End -->
</SCRIPT>
<meta name="Microsoft Border" content="none">
</head>
<body link="#003366" onload="FP_preloadImgs(/*url*/'file:///C:/Documents%20and%20Settings/Mike/My%20Documents/MAI/My%20Webs/L%26C_COM/navigation/utils/about/about_h.jpg', /*url*/'file:///C:/Documents%20and%20Settings/Mike/My%20Documents/MAI/My%20Webs/L%26C_COM/navigation/utils/a-z/a-z_h.jpg', /*url*/'file:///C:/Documents%20and%20Settings/Mike/My%20Documents/MAI/My%20Webs/L%26C_COM/navigation/utils/join/join_h.jpg', /*url*/'file:///C:/Documents%20and%20Settings/Mike/My%20Documents/MAI/My%20Webs/L%26C_COM/navigation/utils/privacy/privacy_h.jpg', /*url*/'file:///C:/Documents%20and%20Settings/Mike/My%20Documents/MAI/My%20Webs/L%26C_COM/navigation/utils/terms/terms_h.jpg', /*url*/'navigation/utils/contact/contact_h.jpg', /*url*/'navigation/utils/copyright/copyright_h.jpg', /*url*/'navigation/utils/sitemap/sitemap_h.jpg', /*url*/'navigation/utils/suggest/suggest_h.jpg')">
<div align="center">
<center>
<table border="0" cellpadding="0" cellspacing="0" width="975">
<tr>
<td width="25%" align="center" rowspan="2" valign="top">
</td>
<td height="25">
<p align="center"><font face="Comic Sans MS" color="#FF0000"><b>TRAVEL</b></font>
</td>
<td width="25%" align="center" rowspan="2" valign="top">
<p> </p>
<p> </p>
<p> </td>
</tr>
<tr>
</center>
<td valign="top" align="center">
<table border=0 cellspacing="0" cellpadding="0">
<tr valign=top>
<TD align=center bgcolor="#FFFFFF"><form name=f1 method=post action="" onSubmit="return false;">
<select name=m1 onChange="relate(this.form,0,this.selectedIndex); document.f2.m2.focus();" style="background-color: #FFE0C1" size="1">
<option value="/">Location...
<option value="/">Alston,
<option value="/">Ambleside,
<option value="/">Bowness-on-Windermere,
<option value="/">Carlisle,
<option value="/">Coniston,
<option value="/">Glenridding,
<option value="/">Keswick,
<option value="/">Lakeside,
<option value="/">Penrith,
<option value="/">Ravenglass,
<option value="/">Windermere,
</select><br>
<br>
<br>
</form></td>
<td align=center valign="top"> </td>
<td bgcolor="#FFFFFF" valign="top"><form name=f2 method=post action="" onsubmit="return false;">
<select name="m2" onchange="jmp(this.form,0)" style="background-color: #FFE0C1" size="1">
<option value="/">>
<option value="/">
</select></form></td>
</tr>
</table>
<div align="center">
<center>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="50%" valign="top" align="center">
</td>
<td width="50%" valign="top" align="center">
</td>
</tr>
</center>
</table>
</div>
</td>
</tr>
</table>
</div>
<p></p>
</body>
</html>
Hi there, I need help in form validation! I want this to be validated upon selection of the drop down list (not when it comes to submit button) I have 2 drop down lists: Starting date (June 5th, 6th 7th) Ending date (June 5th, 6th 7th) I want to write a script that would NOT ALLOW one to choose: - Starting date June 6th and Ending date June 5th - Starting date June 7th and Ending date June 6th - Starting date June 7th and Ending date June 5th I appreciate your help Thanks for all the help Old Pedant. You're nice enough to lend people a hand when you don't have to, and this makes the second or third time you've helped me solve a problem I've had with my website. Thanks so much. So I'm making a page where when someone clicks on the second drop list, then it carrys out a function first, and it calculates it based on what the first droplist is picked. Here's the code I have: Code: <html>
<head>
<title></title>
<script type="text/javascript">
function first()
{
var gold = 4;
var green = 6;
var red = 30;
var blue = 0;
var total = 100;
if (calculate.color.GetElementById('gold').select)
{
var depends = gold/total
};
if (calculate.color.GetElementById('green').select)
{
var depends = green/total
};
if (calculate.color.GetElementById('red').select)
{
var depends = red/total
};
if (calculate.color.GetElementById('blue').select)
{
var depends = blue/total
};
if (calculate.choice1.GetElementById('first').select)
{
calculate.results.value = 1 * calculate.howmany.value * depends;
}
}
</script>
</head>
<body>
<form name="calculate">
<table>
<td>
I need: <input type="text" name="howmany" />
<br />
My choice is:
</td>
<td>
<select name="color">
<option selected id="gold">Gold</option>
<option id="green">Green</option>
<option id="red">Red</option>
<option id="blue">Blue Charms</option>
</select>
<br />
<select name="choice1">
<option id="first" onClick="first()">
First
</option>
</select>
</td>
</tr>
<tr>
<td colspan="2" align="center" valign="top">
You will need <input type="text" name="results" />
</td>
</tr>
</table>
</form>
</body>
</html>
Any help is well appreciated. Thanks. i'm trying to make a form where if 2 particular options are chosen from 2 dropdown boxes, it puts a value in a text field. Its not working and i hope you can help so far i've got Code: if (document.profile_quote.thickness.selectedIndex == "3" && document.profile_quote.machine.selectedIndex == "1") document.profile_quote.cutspeed.value = "34444" Okay I Don't Know Much About Javascript, But I Need A Hand I Have A Drag And Drop Script Along With A Simple Script To Make Things Appear And Disappear Bt Using This Line: ShowHide('Table'); return false; I Want to Make It So That When I Drag Something over a Div, More Preferably a Table or an Image and Then Let Go of Your Mouse (onMouseUp) It Makes the Object Disappear Or Have An Action Happen Thanx ________________________________________________________________________________________ Alright, I wrote this a while ago and This Time I'll Be More Clear And Simple. I Want To Make It So That If A Div Hovers Over A Table By Drag And Drop And You Drop Your Div in The Table An Action happens Hi, I have a page with a drop down and there are external js file that are included in the page which define handlers and other actions for onchange of this drop down. So if the selection in the drop down changes, we display a different color map (based on the selection). Now I have to pre-select an option on a specific page (which has been completed) and the drop down shows the correct selection, but the event is not fired (that changes the map color). Any idea what I need to do? Thanks Hi, I have two dropdown lists with the second one being dependent on the selection in the first. Options in list 1: 1,3 or 4 List two should be enabled when 3 or 4 is selected in list 1. So far so good, managed to get it to work with only one set of lists, but I actually have 18 of those sets in this form: Code: <select name="fw[$i]" id="fw[$i]"> <option value="1">FWH</option> <option value="3">links</option> <option value="4">rechts</option> <option value="0" selected></option> </select><br /> <select name="lie[$i]" id="lie[$i]" disabled="disabled" onchange="showBox($i,xxx);"> <option value="0" selected>---</option> <option value="1">gut</option> <option value="2">schlecht</option> <option value="3">Strafschlag</option> <option value="4">OB</option> </select> $i is my index generated by my PHP script and runs from 1 to 18. Everything works just fine as long as the index is not in play. With the index my function breaks, most probably due to my inability to extract the second parameter (xxx above) from the selection field. Here's my function, there could be something wrong there too with how exactly to specify the proper dropdown list to enable. Code: function showBox(field,val) {
if (val > 1) {
var box = 'lie[' + field + ']';
document.form1.box.disabled == false;
}
else {
document.form1.box.disabled == true;
}
}
Finally, I'm not that adept in javascript programming, more like a trial and error guy, how has hit the wall with this problem. Thanks in advance! Joe Hey all, I was just wondering if you could help me out with the following, I've done a bit of google searching but haven't come up with anything. Basically, there will be 3 drop down boxes (Option a, Option b, Option c) In each drop down box there will be 3 options (One, Two, Three) Whats a script I can use that will write on page :Yellow If they select: Option a - One Option b - One Option c - Three Of the script will write blue if they selection Option a - Two Option b - One Option c - One Hey everyone, I have a simple html form that asks a user to select a state from a drop down list. Later, in the same form, there's a question that needs to display an image of the state they previously selected from the drop down menu. How can I accomplish this using javaScript?
I have created this form. I would like to use javascript to mail the form to the selected email from the selection list when the submit button is pressed. could anyone help with this? <form name="Contact Us" id="contact" action="mailto:" method="post"> <fieldset id="selection"> Who would you like to email: <select> <option value="email1" >email1</option> <option value="email2" >email2</option> <option value="email3">email3</option> </select> <fieldset id="Name" > Name <input type="text" id="firstname" name="firstname"> <input type="text" id="email" name="email"> </fieldset> <fieldset id="question"> Comments and Questions <input type="text" id="comment" name="comment" style="width: 500; height: 300"> </fieldset> </form> Hello Folks, Here is my dropdown menu: Code: <select name="peeps"> <option value="Frank Tompson">Frank Tompson</option> <option value="Henry Wilson">Henry Wilson</option> <option value="Bill Kent">Bill Kent</option> <option value="Jessi McDonald"> Jessi McDonald</option> <option value="John Hays">John Hays</option> How can i make it so if i click on John Hays a JavaScript pop up will say Hello John Hays, and if i click on Bill Kent a popup will say hello Bill Kent and if i click on any other name nothing happens? Hi all.This is part of my code which I am using to edit the record from database.Initially the input boxes show the values from database and if any one of the value is changed, I want to reflect the change according to the changes made in the fields.The code works fine but if I change values in qty,rate or amount, the other values are not changing.Can experts over here tell me why?Here is my code: Code:
<html>
<head>
<script type="text/javascript">
function tot() {
var d=document.getElementById("total").value;
var st=Number(d);
var e=document.getElementById("vat_amt").value;
var tx=Number(e);
var f=document.getElementById("cash_discount").value;
var ad=Number(f);
var g=document.getElementById("vat").value;
var vat=Number(g);
var h=(st+tx)-ad;
document.getElementById("amount").value = Math.ceil(h);
var z=vat+100;
var y=(st*100)/z;
var i=st-y;
var result=Math.round(i*100)/100; //returns 28.45
document.getElementById("vat_amt").value =result;
}
var total = 0;
function getValues() {
var qty = 0;
var rate = 0;
var obj = document.getElementsByTagName("input");
for(var i=0; i<obj.length; i++){
if(obj[i].name == "qty[]"){var qty = obj[i].value;}
if(obj[i].name == "rate[]"){var rate = obj[i].value;}
if(obj[i].name == "amt[]"){
if(qty > 0 && rate > 0){obj[i].value = qty*rate;total+=(obj[i].value*1);}
else{obj[i].value = 0;total+=(obj[i].value*1);}
}
}
document.getElementById("total").value = total*1;
total=0;
}
</script>
</head>
<body>
<table width="23%" cellpadding="0" cellspacing="0" class="normal-text" border="0" style="margin-top:0px; padding-top:0px; margin-bottom:0px; padding-bottom:0px;">
<tr>
<td>Qty</td>
<td>Rate</td>
<td>Amount</td>
</tr>
<tr>
<td class="forhead"><input type="text" name="qty[]" onkeyup="getValues()" style="width:120px;" value="<?PHP echo "$row3[qty]" ?>" class="text medium"></td>
<td class="forhead"><input type="text" name="rate[]" onKeyUp="getValues()" style="width:120px;" value="<?PHP echo "$row3[rate]" ?>" class="text medium"></td>
<td class="forhead"><input type="text" name="amt[]" style="width:120px;"
onKeyUp="getValues()" class="text medium" value="<?PHP echo "$row3[amt]" ?>"></td>
</tr>
<tr>
<td class="dt" colspan="2">Sub Total:</td>
<td class="forhead"><input type="text" id="total" name="total" style="width:120px;" value="<?PHP echo "$row[total]" ?>" class="text medium"></td>
</tr>
<tr>
<td class="dt" colspan="2">Vat:</td>
<td class="forhead"><?PHP
$query5=mysql_query("SELECT * FROM vat");
echo "<select name='vat' id='vat' style='width:120px; border: 1px solid #BFBFBF;' onChange='tot()'>";
echo "<option value='0'>
Select</option>";
while($row5=mysql_fetch_array($query5))
{?>
<option value= <?PHP echo $row5[vat]; ?> <?PHP echo($row5[vat]==$row[vat])?'selected':''?>> <?PHP echo $row5[vat]; ?> </option>
<?PHP }
echo "</select>";
?></td>
</tr>
<tr>
<td class="dt" colspan="2">Vat Amt :</td>
<td class="forhead"><input type="text" id="vat_amt" name="vat_amt" style="width:120px;" value="<?PHP echo "$row[vat_amt]" ?>" class="text medium" onKeyUp="tot()"></td>
</tr>
<tr>
<td class="dt" colspan="2">Cash Discount :</td>
<td class="forhead"><input type="text" id="cash_discount" name="cash_discount" style="width:120px;" value="<?PHP echo "$row[cash_discount]" ?>" class="text medium" onKeyUp="tot()"></td>
</tr>
<tr>
<td class="dt" colspan="2">Total :</td>
<td class="forhead"><input type="text" name="amount" id="amount" style="width:120px;" class="text medium" onKeyUp="tot()" value="<?PHP echo "$row[amount]" ?>"></td>
</tr>
</table>
</body>
</html>
Hi coders, I need to achieve two things upon making a selection from a drop down field: 1) Changing the background picture of a cell. 2) Changing the size of a uploaded foreground picture within the same cell. Code: <select name=ADDITIONALINFO> <option value="25 x 25">25 x 25</option> <option value="35 x 35">35 x 35</option> <option value="45 x 45">45 x 45</option> <option value="55 x 55">55 x 55</option> </select> Any guidance how to achieve this is appreciated. I have been to this forum many times as a lurker and I have picked up some good information. For this I give Thanks wholeheartedly. My situation: I enter information in a system based on the # of a report that comes in. So if I see a report that says "333" i want to enter specific information for "333" same with "444" and "555" and so on and so forth. So I want to have a drop down menu for 111, 222, 333, 444 etc... Basically what I need is, if I select the report # from the drop down menu, I want it to copy information from a HIDDEN textbox to the clipboard. That's it! I've been trying to figure it out, but to no avail. Sorry I am fake coder Hello everyone! =] I need help with Javascript. I want to have a script that if one chooses to register for dinner, then validation will be performed to ensure whether the user have chosen that they are Vegetarian or not. If the user chooses not to attend dinner, then there is no need to validate the Vegetarian option. Here's the code: Code: <p>Register for Conference Dinner?<select type="text" name="conf_dinner" id="conf_dinner">
<option> Please Select </option> <option value="N">No</option>
<option value="Y">Yes</option>
</select></p>
<p>
Are you a vegetarian?<select type="text" name="vegetarian" id="vegetarian">
<option value="N">No</option>
<option value="Y">Yes</option>
</select></p>
Hello i use a javascript to use drop down lists so i display the appropriate products to user. Atm no matter the user option i display 3 drop down lists in whole products. Lets say the drop down lists are like manufacturer/order by/sochet. When the user wish to see "processors" then the sochet list have values, but when he choose "printers" the sochet list is empty since the printers dont contan sochets. In this case i want to hide the sochet drop down list in order to be more familiar to the user is that possible? My js looks like this Code: <script type="text/javascript">
function showUser()
{
var q=document.getElementById("manuf");
var q_val = q.options[q.selectedIndex].value;
var t=document.getElementById("soch");
var t_val = t.options[t.selectedIndex].value;
var c=document.getElementById("order");
var c_val = c.options[c.selectedIndex].value;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else {// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
var q=document.getElementById("manuf");
var q_val = q.options[q.selectedIndex].value;
var t=document.getElementById("soch");
var t_val = t.options[t.selectedIndex].value;
var c=document.getElementById("order");
var c_val = c.options[c.selectedIndex].value;
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","productsdata.php?q=" + q_val + "&t=" + t_val+"&c=" +c_val, true);
xmlhttp.send();
}
</script>
and my drop down lists like PHP Code: <select name="products2" id="soch" onchange="showUser()"> <option value="" selected="selected">Sochet</option> <?php do { ?> <option value="<?php echo $row_sochet['sochet']?>"><?php echo $row_sochet['sochet']?></option> <?php } while ($row_sochet = mysql_fetch_assoc($sochet)); $rows = mysql_num_rows($sochet); if($rows > 0) { mysql_data_seek($sochet, 0); $row_sochet = mysql_fetch_assoc($sochet); } ?> </select> i need help on designing a drop down list menu. this rolls down and shows other list of options to click on. i work in dreamweaver so javascripts and others can be incorporated. thanks all I am working on a website that involves a pizza. I have a drop down box with the following options: small, medium, large, and extra large. When the user selects small the topping price is $0.75 each, when the user selects medium the topping price is $1.00 each, when the user selects large the topping price is $1.25 each, and when the user selects extra large the topping price is $1.25 each. I the problem is no matter what size the user selects the topping price is always $0.75. Here is code that goes with the drop down box : Code: <td height="49" align="right"><label for="Pizza_Size">Size</label>
<select name="Pizza_Size" id="Pizza_Size" onchange = "SetToppingPrice()" />
<option value="Small_Pizza">Small ($4.99)</option>
<option value="Medium_Pizza">Medium ($5.99)</option>
<option value="Large_Pizza">Large ($7.99)</option>
<option value="X_Large_Pizza">X-Large ($10.99)</option>
</select></td>
Here is the Javascript code: Code: // JavaScript Document
function SetToppingPrice() {
var Pizza_Topping_Price = document.getElementById("Pizza_Size");
divOutput = document.getElementById("Display_Topping_Price");
if(Pizza_Topping_Price = "Small_Pizza") {
divOutput.innerHTML = "$0.75 per topping";}
else if (Pizza_Topping_Price = "Medium_Pizza") {
divOutput.innerHTML = "$1.00 per topping";}
else if (Pizza_Topping_Price = "Large_Pizza") {
divOutput.innerHTML = "$1.25 per topping";}
else if (Pizza_Topping_Price = "X_Large_Pizza") {
divOutput.innerHTML = "$1.50 per topping";}
}
Any advice is greatly appreciated. Hi There. I've been reading this forum for quite sometime, but today is my first post, hope you guys can help. Here is how the code works: (its like a phone directory) -User first selects the dept. -Once selected, a second drop down populates with the names of each person in that department. -I want the contact info to show on the page once they select this last step. I need for when the user selects this second options for a link to open inside a iFrame inside of the same html page. I uploaded the file here for you to see: www.pioneer-energy.us/tf2/contact-us.html Here is the code for the HTML doc: Code: <body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080" alink="#ff0000" onLoad="fillCategory();"> <FORM name="drop_list" action="yourpage.php" method="POST" > <SELECT NAME="Department" onChange="SelectSubCat();" > <Option value="">Select Department</option> </SELECT> <SELECT id="SubCat" NAME="SubCat"> <Option value="">SubCat</option> </SELECT> </form> Here is the .js file code Code: function fillCategory(){
// this function is used to fill the category list on load
addOption(document.drop_list.Department, "Executive-Management", "Executive Management");
addOption(document.drop_list.Department, "Marketing", "Marketing", "");
addOption(document.drop_list.Department, "Annuities", "Annuities", "");
addOption(document.drop_list.Department, "Underwriting/Case Management", "Underwriting/Case Management", "");
addOption(document.drop_list.Department, "Human Resources", "Human Resources", "");
addOption(document.drop_list.Department, "Commissions", "Commissions", "");
addOption(document.drop_list.Department, "Policy Owner Services", "Policy Owner Services", "");
addOption(document.drop_list.Department, "Information Technology", "Information Technology", "");
addOption(document.drop_list.Department, "APS", "APS", "");
}
function SelectSubCat(){
// ON selection of category this function will work
removeAllOptions(document.drop_list.SubCat);
addOption(document.drop_list.SubCat, "", "SubCat", "");
if(document.drop_list.Department.value == 'Executive-Management'){
addOption(document.drop_list.SubCat,"MartyGreenberg", "Marty Greenberg - President");
addOption(document.drop_list.SubCat,"LisaGreenberg ", "Lisa Greenberg - Vice President");
addOption(document.drop_list.SubCat,"CraigBrown", "Craig Brown - CFO");
addOption(document.drop_list.SubCat,"RitaBogan", "Rita Bogan - Executive Secretary & Case Management");
addOption(document.drop_list.SubCat,"DianaGreenberg", "Diana Greenberg - Underwriting Manager");
}
if(document.drop_list.Department.value == 'Marketing'){
addOption(document.drop_list.SubCat,"RonBielefelt", "Ron Bielefelt - Chief Marketing Officer");
addOption(document.drop_list.SubCat,"PeterMilanez", "Peter Milanez - Brokerage Manager");
addOption(document.drop_list.SubCat,"MarkRBugli", "Mark R. Bugli - CLU, ChFC ");
addOption(document.drop_list.SubCat,"HowardMandel", "Howard Mandel - Director of Business Development");
addOption(document.drop_list.SubCat,"DeborahSanchez", "Deborah Sanchez - Brokerage Supervisor ");
addOption(document.drop_list.SubCat,"SylviaMariscal", "Sylvia Mariscal - Life Settlements");
addOption(document.drop_list.SubCat,"PeterMilanez", "Peter Milanez - Brokerage Manager");
addOption(document.drop_list.SubCat,"JosephTanner", "Joseph Tanner - Brokerage Manager Assistant", "");
}
if(document.drop_list.Department.value == 'Annuities'){
addOption(document.drop_list.SubCat,"SethMoses", "Seth Moses - Director of Annuities");
addOption(document.drop_list.SubCat,"SteveAvila", "Steve Avila - Assistant to Seth Moses");
}
if(document.drop_list.Department.value == 'Underwriting/Case Management'){
addOption(document.drop_list.SubCat,"DianaGreenberg", "Diana Greenberg - Underwriting Manager");
addOption(document.drop_list.SubCat,"KimberlyFleming", "Kimberly Fleming - Case Manager ");
addOption(document.drop_list.SubCat,"LarissaBurton", "Larissa Burton - Case Manager Assistant to Kimberly Fleming");
addOption(document.drop_list.SubCat,"MariaAntebi", "Maria Antebi - Case Manager");
addOption(document.drop_list.SubCat,"LilianaGalvan", "Liliana Galvan - Case Manager");
addOption(document.drop_list.SubCat,"KimberlyKoontz", "Kimberly Koontz - Case Manager Assistant to Liliana Galvan");
addOption(document.drop_list.SubCat,"ChastaSpikes", "Chasta Spikes - Case Manager");
addOption(document.drop_list.SubCat,"SylviaMarsicalShank", "Sylvia Marsical-Shank - Case Manager");
addOption(document.drop_list.SubCat,"TriciaRomain ", "Tricia Romain - Case Manager");
addOption(document.drop_list.SubCat,"BetoRuiz", "Beto Ruiz - Case Manager");
addOption(document.drop_list.SubCat,"DavidGarcia", "David Garcia - Case Manager Assistant");
}
if(document.drop_list.Department.value == 'Human Resources'){
addOption(document.drop_list.SubCat,"MarieOkamura", "Marie Okamura - Human Resources Director");
}
if(document.drop_list.Department.value == 'Commissions'){
addOption(document.drop_list.SubCat,"WalterHelbig", "Walter Helbig, FLMI - Licensing");
addOption(document.drop_list.SubCat,"KenFong", "Ken Fong - Licensing");
addOption(document.drop_list.SubCat,"JimTigrak", "Jim Tigrak - Commissions");
}
if(document.drop_list.Department.value == 'Licensing'){
addOption(document.drop_list.SubCat,"TessSlezak ", "Tess Slezak - Licensing");
addOption(document.drop_list.SubCat,"ArleneAuerhan ", "ArleneAuerhan - Licensing");
addOption(document.drop_list.SubCat,"JimTigrak", "Jim Tigrak - Forms & Supplies");
}
if(document.drop_list.Department.value == 'Policy Owner Services'){
addOption(document.drop_list.SubCat,"LanTran", "Lan Tran - Policy Services");
addOption(document.drop_list.SubCat,"GianSanchez ", "Gian Sanchez - Receptionist");
addOption(document.drop_list.SubCat,"ArmonTodd ", "Armon Todd - Office Support");
}
if(document.drop_list.Department.value == 'Information Technology'){
addOption(document.drop_list.SubCat,"HenryCholakyan ", "Henry Cholakyan - IT Director");
}
if(document.drop_list.Department.value == 'APS'){
addOption(document.drop_list.SubCat,"CarmenAllen ", "Carmen Allen - APS Supervisor");
}
}
//////////////////
function removeAllOptions(selectbox)
{
var i;
for(i=selectbox.options.length-1;i>=0;i--)
{
//selectbox.options.remove(i);
selectbox.remove(i);
}
}
function addOption(selectbox, value, text )
{
var optn = document.createElement("OPTION");
optn.text = text;
optn.value = value;
selectbox.options.add(optn);
}
Thanks for any help in advanced! |
|||||||