HTML - Javascript Route
can somebody change this code so it work i don't understand why its not working its a router planner for google maps. if you type your adres in the text box he must plan a route
HTML Code: <form name="thisform" action="" method="get" onsubmit="window.open('http://maps.google.nl/maps?saddr='+document.thisform.adres.value,'_self')('+&daddr=Gemeenteweg+180+7951+CT+Staphorst&hl=nl&sll=52.649594 ,6.217762&sspn=0.010467,0.033023&geocode=FQ8BIwMdQRhcACnxa5xBMHfIRzHmGEdWCkhZ2A3BFXpeIwMdIuBeAClXUCEANXPIRzE6f2uCVLYVUw&oq=gree&mra=ls&t=h&z=13');return false;"> <input name="adres" type="text" /> <input name="submit" type="submit" value="Zie route" /> </form> Similar TutorialsHello, I was wondering if it is possible to filter visitors to a website based on their location. For example: If a Visitor is from Ohio, route them to ohio.html If a visitor is from Montana, rote them to montana.html. I'm not sure how to make this happen, any help would be greatly appreciated. Thanks, Brian I am currently working on a currency converter for my D&D website and have run into a bit of a problem. The basic idea is to select the appropriate currency you have from a row of radio buttons, insert the amount you have in a text area and in the next text area it will kick out a list of different currencies and the amount you will have in those currencies. My problem is that my JAVA skills are extremely poor. I figured out how to set up most of it but I cannot figure out how to grab the input and plug it into my formulas. Can anyone help me with this? Here is a link to the page: Currency Converter Any and all hope is greatly appreciated. Thanks. Take care and have a great day.... ciao, john., Here is the basic code without the web page info: Code: <script type = "text/javascript"> function radio_map(prefix) { var coins; // The type of coin selected // Go through all options to find the one that was selected for (cnt = 0; cnt < prefix.cointype.length; cnt++) { // If the coin was selected, checked will be true if (prefix.cointype[cnt].checked) coins = cnt; // Save that coin number } switch (coins) { // Copper case 0: prefix.matharea.value = "\n" + 1 * 1 + " Copper Coins \n" + 1 * .1 + " Silver Coins \n" + 1 * .01 + " Gold Coins \n" + 1 * .005 + " Platinum Coins \n" + 1 * .0001 + " Mithril Coins \n"; break; // Silver case 1: prefix.matharea.value = "\n" + 1 * 10 + " Copper Coins \n" + 1 * 1 + " Silver Coins \n" + 1 * .1 + " Gold Coins \n" + 1 * .05 + " Platinum Coins \n" + 1 * .001 + " Mithril Coins \n"; break; // Gold case 2: prefix.matharea.value = "\n" + 1 * 100 + " Copper Coins \n" + 1 * 10 + " Silver Coins \n" + 1 * 1 + " Gold Coins \n" + 1 * .5 + " Platinum Coins \n" + 1 * .01 + " Mithril Coins \n"; break; // Platinum case 3: prefix.matharea.value = "\n" + 1 * 1000 + " Copper Coins \n" + 1 * 10 + " Silver Coins \n" + 1 * 5 + " Gold Coins \n" + 1 * 1 + " Platinum Coins \n" + 1 * .1 + " Mithril Coins \n"; break; // Mithil case 4: prefix.matharea.value = "\n" + 1 * 10000 + " Copper Coins \n" + 1 * 1000 + " Silver Coins \n" + 1 * 100 + " Gold Coins \n" + 1 * 5 + " Platinum Coins \n" + 1 * 1 + " Mithril Coins \n"; break; } } </script> <form name="frmRadio"> <p> Please choose your coin type.</p> <div onclick ='radio_map(document.frmRadio)'> <input type="radio" name="cointype" value="Evanston"> Copper <input type="radio" name="cointype" value="Arlington Hts."> Silver <input type="radio" name="cointype" value="Oakbrook"> Gold <input type="radio" name="cointype" value="Downers Grove"> Platinum <input type="radio" name="cointype" value="Vernon Hills"> Mithril </div> Please input the number of coins that you have: <textarea name="coinarea" rows=1 cols=35> </textarea> Here are your converted coin numbers: <textarea name="matharea" rows=10 cols=35> </textarea> </form> OK so I'm making an application and I've hit a snag with my Javascript. So I have a form and a list with some value, and under the list I have a button (not a submit) HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Untitled Document</title> <script type="text/javascript"> <!-- function popUp(URL,WIDTH,HEIGHT){ day = new Date(); id = day.getTime(); var user = document.getElementById('user').value; eval("page" + id + " = window.open(URL, '"+ id + "', 'toolbar=1,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width="+WIDTH+",height="+HEIGHT+",left = 362,top = 234');"); } </script> <style type="text/css"> form{ margin: 0px; } .menu{ width: 200px; } #mem_list{ width: 200px; } </style> </head> <body> <div id="mem_list"> <center> Online User Info </center> <form method="get" action="/antrix/index.php"> <select name="color" size="5" class="menu" id="user"> <option value="Marlo">Marlo level 70 Warrior</option> <option value="Dsadasd">Dsadasd level 1 Warlock</option> <option value="Dsadasdd">Dsadasdd level 1 Priest</option> <option value="Asdassg">Asdassg level 1 Rogue</option> </select> <center> <input type="button" value="user options" onclick="javascript:popUp('mailmod.php','800','200')"/> </center> </form> </div> </body> </html> OK so when someone clicks the user options button i want the popup to go to the url and have the selected name in the GET value of the url like: mailmod.php?user=marlo if Marlo was selected. anyone got any ideas? *EDIT* yeh just realised this was in the wrong section, sorry ^_^ Hope this is the correct place for this question. What I want to do is have a webpage which asks a question, e.g. "What is your name?" and when the user enters a name, e.g. "Bob" a button pops up with "are you ready?" The user clicks that button and the page then tells the visitor: "Good morning, Bob; nice to see you" (or the button could be there from the beginning; it does not have to pop up) Just want this to learn how to do this and hope I can carry on from there. I am assuming I need a javascript to do this. For the website I'm working on i want to store the text someone enters in an imput box to be stored as a variable so i can have an alert that welcomes them to my site. any suggestions. this one isn't illegal. Hey Team I am New to the boars this is my first html/java script code i wrote.. but it doesnt wan work could some body see wr my mistake is .. thx HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 4.1 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Reservation Form</title> </head> <body> <form action="res.php" method="post" name="pricecheck"> <input type="text" value="Limousine" disabled="disabled" /> <br> <table width="352" border="3" cellspacing="1" cellpadding="3"> <tr> <td><strong>Party size:</strong></td> <td> <select name="pasn" id="pasn" size="1"> <option value="0"></option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> </select> </td> </tr> <tr> <td><strong> Trip Type:</strong></td> <td> <select name="tt" id="tt" size="1"> <option selected="">Select One</option> <option value="One Way">One Way</option> <option value="Round Trip">Round Trip</option> <option value="Land&Sea/Sea&Land">Land&Sea/Sea&Land</option> </select> </td> </tr> <tr> <td><strong>Transfare type</strong></td> <script type="text/javascript"> <td> if(tt="One Way") { <select name="trant1" id="trant" size="1"> <option>Select One</option> <option value="12">MCO To Disney</option> <option value="13">Disney To MCO</option> <option value="14">MCO To Cruis</option> <option value="15">Cruis To MCO</option> <option value="16">Disney To Cruis</option> </select> }else if (tt="Round Trip") { <select name="trant2" id="trant" size="1"> <option>Select One</option> <option value="17">MCO To Disney To MCO</option> <option value="18">MCO To Cruis To MCO</option> <option value="19">Disney To Cruis To Disney</option> <option value="20">Dsiney To Cruis To MCO</option> }else (tt="Land&Sea/Sea&Land") { <select name="trant3" id="trant" size="1"> <option>Select One</option> <option value="21 ">MCO To Disney to Cruis To MCO</option> <option value="22">MCO To Cruis To Dsiney to MCO</option> } </script> </td> </tr> </table> </form> </body> </html> thx again iehab ********* okay made a little changes still not work.. HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 4.1 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Reservation Form</title> </head> <body> <form action="res.php" method="post" name="pricecheck"> <input type="text" value="Limousine" disabled="disabled" /> <br> <table width="352" border="3" cellspacing="1" cellpadding="3"> <tr> <td><strong>Party size:</strong></td> <td> <select name="pasn" id="pasn" size="1"> <option value="0"></option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> </select> </td> </tr> <tr> <td><strong> Trip Type:</strong></td> <td> <select name="tt" id="tt" size="1"> <option selected="">Select One</option> <option value="One Way">One Way</option> <option value="Round Trip">Round Trip</option> <option value="Land&Sea/Sea&Land">Land&Sea/Sea&Land</option> </select> </td> </tr> <tr> <td><strong>Transfare type</strong></td> <td> <script type="text/javascript"> var trant = array("MCO To Disney","MCO To Disney","MCO To Cruis","Cruis To MCO","Disney To Cruis","MCO To Disney To MCO","MCO To Cruis To MCO","Disney To Cruis To Disney","Dsiney To Cruis To MCO","MCO To Disney to Cruis To MCO","MCO To Cruis To Dsiney to MCO") if(tt="One Way") { for (i=0; i<=4; i++); document.write(<select name="trant[i]">tran[i]</select>); }else if (tt="Round Trip") { for (i=5; i<=8; i++); document.write(<select name="trant[i]">tran[i]</select>); }else (tt="Land&Sea/Sea&Land") { for (i=9; i<=10; i++); document.write(<select name="trant[i]">tran[i]</select>); } </script> </td> </tr> </table> <br> <input name="Submit" type="submit" value="Get Price>>" /> <input type="reset" name="Reset" id="button" value="Reset"> </form> </body> </html> Hello everyone, I'm building a html page that (I think) needs Javascript directly written into it because it won't be uploaded into a directory I can edit. A few questions: 1. Would this code "<script type="text/javascript" src="the matrix.js">" work if the file was within the document? 2. Does a JavaScript file need to be within the same web directory as a document that's referencing it? Thanks Hello everyone, newbie to this forum humbly seeking help. I'll got a javascript working to display an alt image on hover and at the same time an image box appearing at another place on the page (describing the link). After preparing the linked page I discovered that the link doesn't work. When I add "a href" within the code which already only has a "href" in the javascript the complex image cutting becomes apparent with a pixel or so space between each of the cuts. I had alt images working nicely, now I find something is very much a miss. Here is the code which delivers the two alt images well but doesn't link to the target page. "<tr><td><div id="NavigationImage3" href="about_us.html" onMouseOver="F_roll('NavigationImage3',1)" onMouseOut="F_roll('NavigationImage3',0)"><img id="NavigationImage3" name="NavigationImage3" src="images/b2-3a.jpg" onLoad="F_loadRollover(this,'images/b2-3b.jpg')" alt="Sample Text" onMouseOver="swap(3, 'imgDefault')" onMouseOut="swap(0,'imgDefault')"></a></td></tr>" Be very grateful if someone can help. Cheers, Mal from Cessnock (Aus) So I want to make an image that has mouseover tables that pop up. This is what the code looks like now: Code: <html> <table> <tr><td><img src= "pic.bmp" usemap="#mapareas"/></td></tr> </table> <map NAME ='mapareas'> <script language='JavaScript' type='text/javascript'> function show(id) { document.getElementById(id).style.visibility='visible'; return true; } function hide(id) { document.getElementById(id).style.visibility='hidden'; return true; } </script> <area shape = "rect" coords="0,0,100,100" title="one" onmouseover='javascript:show('one') onmouseout='javascript:hide('one')> <area shape = "rect" coords= "150,0,250,100" title="two" onmouseover='javascript:show('two') onmouseout='javascript:hide('two')> <area shape = "rect" coords= "0,150,100,250" title="three" onmouseover='javascript:show('three') onmouseout='javascript:hide('three')> <area shape = "rect" coords= "150,150,250,250" title="four" onmouseover='javascript:show('four') onmouseout='javascript:hide('four')> <area shape = "default" title="The Rest"> </map> <table border=0 cellPadding=0 cellSpacing=1 id='one' style='position:absolute; left:10px; top:120px; background:lightGrey; visibility:hidden'> <tr><td>ONE</td></tr> </table> <table border=0 cellPadding=0 cellSpacing=1 id='two' style='position:absolute; left:10px; top:120px; background:lightGrey; visibility:hidden'> <tr><td>TWO</td></tr> </table> <table border=0 cellPadding=0 cellSpacing=1 id='three' style='position:absolute; left:10px; top:120px; background:lightGrey; visibility:hidden'> <tr><td>THREE</td></tr> </table> <table border=0 cellPadding=0 cellSpacing=1 id='four' style='position:absolute; left:10px; top:120px; background:lightGrey; visibility:hidden'> <tr><td>FOUR</td></tr> </table> </html> everything is ok when the page is first loaded, but when I try the mouseovers, firefox's error console gives me this message: "syntax error javascript:show(" and "syntax error javascript:hide(" Can someone help me figure out what is going wrong? Thanks hi, I'm not sure if its javascript that does it or any other language, but I being googling an cant find it.I am building a site and wanna create a "question sign" ? that when users hover over it , a dialogue box appears explaining what it is.I'm sure most of us have seen it on some site or the other. what I am looking for is like http://www.alexa.com/siteinfo/linuxquestion.org where it says,"Alexa traffic rank" and you hover over the question sign.Thats exactly what I want Can I get some help or links to text on how to create one? Thank you Hi all, I've been asked to develop a tool using HTML and JavaScript to target two numbers in a 19 digit combination. The numbers I need to target are in location 8 & 9 (#######89##########) and need to yield one of two responses dependant if the number is less than or equal to what has been entered. So if number less than or equal to 12 I figure I can use layers to hide and reveal the responses and using JavaScript or HTML to target and make the correct layer visible after the complete number has been entered I'm at a loss on how to do this and where to start with my code to make this possible. If anyone can shed some light on what this type of feature is called so I can research it or if you can help me with some code or advice I'd be grateful Thanks Hi. I am making a java scipt code for my link's image to change on mouse over. Is there a way to detect if a user has Java instaled? (And if they dont, just be a link without the change) Thanks. I am trying to create a frontpage with a main image that is replaced by other images that can be clicked as thumbnails. I have succeeded in doing that, but am now looking to have a headline that links to another page in my site that would change as the images change. Here's my code, please help. <script language="javascript"> function swapPhoto(photoSRC) { document.images.imgPhoto.src = photoSRC; } </script> <table width=550 height=45 style="background-color: #000000" style="color: #ffffff"> <tr><td><center><p><font size=5 style="color: #ffffff">New Articles</p></font></center></tr></td> </table> <table width=550 style="text-align:center" border=3 style="border-color: #000000"> <tr><td border=5 style="border-color:#000000"> <img src="http://blog.masslive.com/parquetpride/2008/08/large_jr-giddens-huge.jpg" id="imgPhoto" width="510" height="340" alt="Main Image" /></tr></td> <tr><td border=5 style="border-color:#000000"><a href="javascript:swapPhoto ('http://blog.masslive.com/parquetpride/2008/08/large_jr-giddens-huge.jpg')"; return false;"><img src="http://blog.masslive.com/parquetpride/2008/08/large_jr-giddens-huge.jpg" width="123" height="82" border=0 /></a></a> <a href="javascript:swapPhoto ('http://cdn.picapp.com/ftp/Images/4/a/f/a/NBA_MAY_10_5253.JPG?adImageId=1825421&imageId=4792284')"; return false;"><img src="http://cdn.picapp.com/ftp/Images/4/a/f/a/NBA_MAY_10_5253.JPG?adImageId=1825421&imageId=4792284" width="123" height="82" border=0 /></a> <a href="javascript:swapPhoto ('http://cdn.picapp.com/ftp/Images/3/e/3/5/NBA_Summer_League_1d14.JPG')"; return false;"><img src="http://cdn.picapp.com/ftp/Images/3/e/3/5/NBA_Summer_League_1d14.JPG" width="123" height="82" border=0 /></a> <a href="javascript:swapPhoto ('http://cdn.picapp.com/ftp/Images/5/b/b/e/Kansas_State_v_d9d1.jpg?adImageId=1819870&imageId=3772329')"; return false;"><img src="http://cdn.picapp.com/ftp/Images/5/b/b/e/Kansas_State_v_d9d1.jpg?adImageId=1819870&imageId=3772329" width="123" height="82" border=0 /></a></tr></td> </table> I want to have a similar feature that this page has http://dtlr.com/shoes/shoes.html only the part that has the 4 thumbnails of the cropped shoes and then the larger image of the shoe next to it. Is this possible to build with html or javascript or is advanced css or something else needed? thanks I view this website i found out the banner of website quite cool do anyone know this coding? kindly share with me. > below is the website http://www.justalab.com/#home Hi All, Firstly i have looked around this site to find out where i should post this question but i cant find anywhere relevant so please move it if needs be. Right moving on, i have a javascript that validates all the fields on the page and if there in erorr they will be highlighted in red but unfortunatly it doesnt seem to be working....i javascript call is behind a button click which is below HTML Code: <a href="#" runat="server" id="BtnRaise" class="RaiseButton" onclick="javascript:formCheck(document.getElementById('txtTitleContent').value);"> Raise</a> My JavaScript File is in a Folder called Scripts/JScriptTaskChange.js (See attached Image) I have placed the path for this javascript in the SiteMaster Page is this correct? or should it be at the top of the Page im currently working on even though its inheriting the SiteMaster and all its content? I checked my Browser settings and JavaScript is Enabled, this is what i have in the Head section of the site master. HTML Code: <script language="javascript" type="text/javascript" src="/Scripts/JScriptTaskChange.js"></script> Can someone please help me. Thank you Hi All, This doesn't completely relate to HTML, I am more asking questions about Javascript but are related to HTML and CSS. Anyways here are my questions: 1 - Can you create a javascript file (.js) with out using HTML? If so how would you view this file? 2 - Can you link a CSS file to a Javascript file? 3 - Is there a certain program which is dedicated to view/making Javascript files? 4 - Is it legal to call a program that I make JavaScript Beam? and have copyrights to the name JavaScript Beam? If that is illegal then would it be legal (inclduing copyrights) to call the program I make JS Beam? Thanks Hey guys / gals I have been asking around in several forums but they didnt give me correct codes. I am so desperate to get it done. I am using HTML and javascript. Everything is working expect the price list (from table) linked to the dropdown list is not shown up. I inserted the javascript code for displaying image when selected item on the order list (dropdown list), it is working well but the price list linked to this dropdown list was not shown up. Something wrong with Javascript. Can you check up my below code where is incorrect? Your help much appreciated. I urgently need your help. Thanks Look at the red and blue code below: <head> <script type="text/javascript"> window.onload = function() { document.getElementById("dlist1").onchange = function() { var option = this.options[this.selectedIndex]; document.getElementById("price_card").innerHTML = option.getAttribute("data-card") ? option.getAttribute("data-card") : ""; document.getElementById("price_memo").innerHTML = option.getAttribute("data-memo") ? option.getAttribute("data-memo") : ""; document.getElementById("price_tags1").innerHTML = option.getAttribute("data-tags1") ? option.getAttribute("data-tags1") : ""; document.getElementById("price_tags4").innerHTML = option.getAttribute("data-tags4") ? option.getAttribute("data-tags4") : ""; document.getElementById("price_key").innerHTML = option.getAttribute("data-key") ? option.getAttribute("data-key") : ""; document.getElementById("price_fridge").innerHTML = option.getAttribute("data-fridge") ? option.getAttribute("data-fridge") : ""; } } // displaying image when selected item on the order list </script> <script type="text/javascript"> function swapImage1() { var image = document.getElementById("imageToSwap1"); var dropd = document.getElementById("dlist1"); image.src = dropd.value; }; </script> <script type="text/javascript"> function swapImage2() { var image = document.getElementById("imageToSwap2"); var dropd = document.getElementById("dlist2"); image.src = dropd.value; }; </script> </head> <body> <table width="700"> // it is an order list <tr> <td> <p class="Card">ORDER 1:</p> // It is the first dropdown list named order 1 </td> </tr> <tr> <td> <p class="Dropdown"> <select name="ORDER1" size="12" multiple="multiple" id="dlist1" onchange="swapImage1()" > <optgroup label="Sow Seeds of Love"> <option value="None">None</option> <option data-card="32.00" data-memo="62.00" data-tags1="8.50" data-tags4="1.80" data-key="30.00" data-fridge="40.00" value="Images/Order_names/SowSeeds/Faith01_yellow.jpg">Faith</option> <option data-card="35.00" data-memo="65.00" data-tags1="9.50" data-tags4="1.80" data-key="20.00" data-fridge="40.00" value="Images/Order_names/SowSeeds/Grace01_green.jpg">Grace</option> <option data-card="1.00" data-memo="2.00" data-tags1="3.00" data-tags4="4.00" data-key="5.00" data-fridge="6.00" value="Images/Order_names/SowSeeds/Hope01_blue.jpg">Hope</option> <option data-card="6.00" data-memo="5.00" data-tags1="4.00" data-tags4="3.00" data-key="2.00" data-fridge="1.00" value="Images/Order_names/SowSeeds/Peace01_pink.jpg">Peace</option> <option data-card="21.00" data-memo="22.00" data-tags1="23.00" data-tags4="24.00" data-key="25.00" data-fridge="26.00" value="Images/Order_names/SowSeeds/FlowerSeedSachet01_two girls.jpg">Flower Seed</option> </optgroup> </select> </p> </td> <td> //it should display image when selected item from the order list - it is working well <img class= "ImageToSwap" id="imageToSwap1" src="Images/DropdownImages.gif" width="147" height="207" /> </td> </tr> </table> //This price list is not shown up when selected item from the order 1 (first dropdown list) Why not shown up???. <table> <tr> <th>Description</th> <th>Price</th> </tr> <tr> <td><label><input type="radio" name="medium" value="card" /> Card A6 (blank)</label></td> <td id="price_card"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="memo" /> Memo Book A6</label></td> <td id="price_memo"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="tags4" /> Gift Tags (4 designs per packet)</label></td> <td id="price_tags4"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="tags1" /> Gift Tags - Single - Assorted</label></td> <td id="price_tags1"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="key" /> Key Rings Perspex</label></td> <td id="price_key"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="fridge" /> Fridge Art</label></td> <td id="price_fridge"></td> </tr> </table> <table width="700"> // it is the second dropdown list named Order 2 <tr> <td> <p class="Card">ORDER 2:</p> </td> </tr> <tr> <td> <p class="Dropdown"> <select name="ORDER2" size="12" multiple="multiple" id="dlist2" onchange="swapImage2()" > <optgroup label="Sow Seeds of Love"> <option value="None">None</option> <option data-card="32.00" data-memo="62.00" data-tags1="8.50" data-tags4="1.80" data-key="30.00" data-fridge="40.00" value="Images/Order_names/SowSeeds/Faith01_yellow.jpg">Faith</option> <option data-card="35.00" data-memo="65.00" data-tags1="9.50" data-tags4="1.80" data-key="20.00" data-fridge="40.00" value="Images/Order_names/SowSeeds/Grace01_green.jpg">Grace</option> <option data-card="1.00" data-memo="2.00" data-tags1="3.00" data-tags4="4.00" data-key="5.00" data-fridge="6.00" value="Images/Order_names/SowSeeds/Hope01_blue.jpg">Hope</option> <option data-card="6.00" data-memo="5.00" data-tags1="4.00" data-tags4="3.00" data-key="2.00" data-fridge="1.00" value="Images/Order_names/SowSeeds/Peace01_pink.jpg">Peace</option> <option data-card="21.00" data-memo="22.00" data-tags1="23.00" data-tags4="24.00" data-key="25.00" data-fridge="26.00" value="Images/Order_names/SowSeeds/FlowerSeedSachet01_two girls.jpg">Flower Seed</option> </optgroup> </select> </p> </td> <td> // displaying image when select item from the second dropdown - it is working well <img class="ImageToSwap" id="imageToSwap2" src="Images/DropdownImages.gif" width="147" height="207" /> </td> </tr> </table> [color="RoyalBlue"]//This price list is also not shown up when selected item from the order 2 (second dropdown). Why not shown up???/COLOR] <table> <tr> <th>Description</th> <th>Price</th> </tr> <tr> <td><label><input type="radio" name="medium" value="card" /> Card A6 (blank)</label></td> <td id="Td1"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="memo" /> Memo Book A6</label></td> <td id="Td2"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="tags4" /> Gift Tags (4 designs per packet)</label></td> <td id="Td3"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="tags1" /> Gift Tags - Single - Assorted</label></td> <td id="Td4"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="key" /> Key Rings Perspex</label></td> <td id="Td5"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="fridge" /> Fridge Art</label></td> <td id="Td6"></td> </tr> </table> </body> Thank you Natz K so I'm making my brother an inventory website that leads to a digital order sheet. On the order sheet, it has a dropdown of the items he has in the database. It's supposed to show the quantity of what he has in stock, but here's the thing: In this database, there are two tables, called Dishes, and Cables. These two tables are assigned to 1 id, so that I can display them in <td id = 'quantity'/>. The problem is, it displays the Cables only, but I want it to be so that if I select one of the dishes, it selects the quantity for the dishes, and if I select one of the cables. Here's the code I have. Code: <html> <head> <script type="text/javascript" > var data = null; var data2 = null; function GETSTUFF(stuff) { var xmlhttp = new XMLHttpRequest(); xmlhttp.open('GET', stuff, false); xmlhttp.send(); return xmlhttp.responseText; } function buildList() { data = eval('('+ GETSTUFF('inventory_2.php') +')'); console.log(data); for (var i=0;i<data.length;i++) { document.getElementById('materials').innerHTML += '<option onclick="showQuantity(\''+ data[i]['Quantity'] +'\'">'+ data[i]['Supplier'] +'</option>'; } data2 = eval('('+ GETSTUFF('inventory_21.php') +')'); console.log(data2); for (var i2=0;i2<data2.length;i2++) { document.getElementById('materials').innerHTML += '<option onclick="showQuantity(\''+ data2[i2]['Quantity (Boxes)'] +'\'">'+data2[i2]['Type'] +'</option>'; } } function showQuantity() { var supplier = document.getElementById('materials').options[document.getElementById('materials').selectedIndex].value; var type = document.getElementById('materials').options[document.getElementById('materials').selectedIndex].value; var amount = 0; var amount2 = 0; for (var i=0;i<data.length;i++) { if (data[i]['Supplier'] == supplier) { amount = (data[i]['Quantity']); } } document.getElementById('quantity').innerHTML = 'Quantity : '+amount; for (var i2=0;i2<data2.length;i2++) { if (data2[i2]['Type'] == type) { amount2 = (data2[i2]['Quantity (Boxes)']); } } document.getElementById('quantity').innerHTML = 'Quantity (Boxes) : '+amount2; } </script> </head> <body onload="setTimeout('buildList()' ,100)"/> <center> <img src="images.jpg" width=125px height=125px/> <br> <font size="8" color="grey" face="purisa">Home </font> <font size="8" color="red" face="purisa"> Communications</font> <br> <font size="5" color="grey" face="purisa">Order </font> <font size="5" color="red" face="purisa"> Sheet</font> <br> <table border="3" width="100%"> <tr> <th>Material:</th> <th>Quantity in stock:</th> <th>Quantity needed:</th> </tr> <tr> <td> <select id="materials" name= "" onchange = "showQuantity()"> <option disabled>Select</option> </select> </td> <td id="quantity"> </td> <td> <form> <input type = "quantityNeeded" /> </form> </td> </tr> </table> <br> <input type = "button" value="Submit"/> </center> </body> </html> I know the if statement involves selectedIndex, but I can't figure it out. Please help. |