Hi i have the a drop down list that depending on the user selection display the list of results for example if (select color) display (red, blue, pink) if select car display(ford,bentley,ferrari) and so on but now i am trying to put the result in a table each element to their own or column. this my code can easy be run on w3school site can someone help me please thanks in advance <HTML> <HEAD> <SCRIPT TYPE="TEXT/JAVASCRIPT"> function setup(ans) { lit = '' if (ans == 'color') { lit = lit + '<br/>blue<br/>' lit = lit + '<br/>red<br/>' lit = lit + '<br/>green<br/>' lit = lit + '<br/>pink<br/>' lit = lit + '<br/>yellow<br/>' } if (ans == 'number') { lit = lit + '<br/>one<br/>' lit = lit + '<br/>two<br/>' lit = lit + '<br/>three<br/>' lit = lit + '<br/>four<br/>' lit = lit + '<br/>five<br/>' } if (ans == 'car') { lit = lit + '<br/>ferrari<br/>' lit = lit + '<br/>bentley<br/>' lit = lit + '<br/>ford<br/>' lit = lit + '<br/>mustang<br/>' } document.getElementById('rep').innerHTML=lit } </SCRIPT> </HEAD> <BODY> <FORM ACTION="#" NAME="quest"> <SELECT NAME="q1" ONCHANGE="setup(document.quest.q1.value)"> <OPTION VALUE="">- Please select -</OPTION> <OPTION VALUE="color">Color</OPTION> <OPTION VALUE="number">Number</OPTION> <OPTION VALUE="cars">Cars</OPTION> </SELECT> <SPAN ID="rep"></SPAN> </FORM> </BODY> </HTML> Code (markup):
Tables are made with <table>, <tr>, and <td>. w3schools will tell you all about them. You don't make tables with <br/> tags.. ;-)
Thanks i manage dto fixe the ussie but now i have another one from the code a i posted earlier it display date depending on what the user selection from the drop down but as the user open the page nothing shows so i wanted when the user opens the page to show the drop down but also one of the data options date as at moment i have if (ans == 'car') { lit = lit + '<br/>ferrari<br/>' lit = lit + '<br/>bentley<br/>' lit = lit + '<br/>ford<br/>' lit = lit + '<br/>mustang<br/>' } Code (markup): so i tried leave empty so when you open the page that list shows but still doesnt show if (ans == '') { lit = lit + '<br/>ferrari<br/>' lit = lit + '<br/>bentley<br/>' lit = lit + '<br/>ford<br/>' lit = lit + '<br/>mustang<br/>' } Code (markup): so how can i get to display one of the list from the drop down as you open the page then
On the page as you have it now, your function won't even be called first time around. Try putting it as <body onload="setup('')">.
<select> <option selected value="v1">option 1 label</option> <option value="v2">option 2 label</option> </select> You'd probably need that "selected" too.
i have tried test one of the onload but it just makes the page blank like if i put that on my page <head> <script type="text/javascript"> function OnLoadDocument () { document.write("The document has been ."); } </script> </head> <body onload="OnLoadDocument ();"> <p>sdkuhfiosuhg</p> </body> Code (markup): but all it does hes showing a black page with the document writen message i want to show my page as normal with the dropdown selected already
this my whole code you can run on w3school page acn you show me wher do i put that onload to just show one of the options for example onload lit = lit + '<br/>blue<br/>' lit = lit + '<br/>red<br/>' lit = lit + '<br/>green<br/>' lit = lit + '<br/>pink<br/>' lit = lit + '<br/>yellow<br/>' Code (markup): <HTML> <HEAD> <SCRIPT TYPE="TEXT/JAVASCRIPT"> function setup(ans) { lit = '' if (ans == 'color') { lit = lit + '<br/>blue<br/>' lit = lit + '<br/>red<br/>' lit = lit + '<br/>green<br/>' lit = lit + '<br/>pink<br/>' lit = lit + '<br/>yellow<br/>' } if (ans == 'number') { lit = lit + '<br/>one<br/>' lit = lit + '<br/>two<br/>' lit = lit + '<br/>three<br/>' lit = lit + '<br/>four<br/>' lit = lit + '<br/>five<br/>' } if (ans == 'car') { lit = lit + '<br/>ferrari<br/>' lit = lit + '<br/>bentley<br/>' lit = lit + '<br/>ford<br/>' lit = lit + '<br/>mustang<br/>' } if (ans == '') { lit = lit + '<br/>ferrari<br/>' lit = lit + '<br/>bentley<br/>' lit = lit + '<br/>ford<br/>' lit = lit + '<br/>mustang<br/>' } document.getElementById('rep').innerHTML=lit } </SCRIPT> </HEAD> <BODY> <FORM ACTION="#" NAME="quest"> <SELECT NAME="q1" ONCHANGE="setup(document.quest.q1.value)"> <OPTION VALUE="">- Please select -</OPTION> <OPTION VALUE="color">Color</OPTION> <OPTION VALUE="number">Number</OPTION> <OPTION VALUE="cars">Cars</OPTION> </SELECT> <SPAN ID="rep"></SPAN> </FORM> </BODY> </HTML> Code (markup):
thank this what i did i just inserted this <body onload="setup('color')"> it works when i run but on dreaweaver shows a sintax error warning even thou it the code runs so i'm i missing something to end the sintax propely or something?
are you sure i dnt have to drop it somewher because i just put it like this i am not suppost to put inside the javascript tags or anythinge else? <body> <body onload="setup('color')"> </body>
ok is working now just one browser issue i manage to get on a table but now the table shows on firefox but not on chrome this how it look with tables tag you can just run the code on w3school <HTML> <HEAD> <SCRIPT TYPE="TEXT/JAVASCRIPT"> function setup(ans) { lit = '' if (ans == 'color') { lit = lit + '<tr bgcolor="#FF0000"><td>green</td></tr>' lit = lit + '<tr bgcolor="#FF0000"><td>pink</td></tr>' lit = lit + '<tr bgcolor="#FF0000"><td>yellow</td></tr>' } if (ans == 'number') { lit = lit + '<tr bgcolor="#FF0000"><td>green</td></tr>' lit = lit + '<tr bgcolor="#FF0000"><td>pink</td></tr>' lit = lit + '<tr bgcolor="#FF0000"><td>yellow</td></tr>' // lit = lit + '<tr style="cursor: pointer; cursor: hand;" onClick="jwplayer().load({\'file\': \'hofbell30732_SD.mp4\', \'hd.file\': \'videos/film.mp4\'})"><td rowspan="4"><img src="images/generic-nice-house-w236h150q90c1.jpg" width="100" height="100" alt="house" /></td><td>Stairfoot Close</td></tr><tr><td>Adel</td></tr><tr><td>LS16</td></tr><tr><td>£895,000</td></tr>' lit = lit + '<tr><td rowspan="4"><img src="images/generic-nice-house-w236h150q90c1.jpg" width="100" height="100" alt="house" /></td><td>Stairfoot Close</td> </tr> <tr> <td>Adel</td></tr> <tr><td>LS16</td></tr><tr><td>£895,000</td></tr>' lit = lit + '<tr><td rowspan="4"><img src="images/generic-nice-house-w236h150q90c1.jpg" width="100" height="100" alt="house" /></td><td>Stairfoot Close</td> </tr> <tr> <td>Adel</td></tr> <tr><td>LS16</td></tr><tr><td>£895,000</td></tr>' lit = lit + '<a href="#" onClick="jwplayer().load({\'file\': \'hofbell30732_SD.mp4\', \'hd.file\': \'videos/film.mp4\'})">orange</a>' lit = lit + '<a href="manningsvideos.html"><img src="images/generic-nice-house-w236h150q90c1.jpg" width="100" height="100" alt="house" /></a>' } if (ans == 'cars') { lit= lit + '<tr><td>ferrari</td></tr>' lit= lit + '<tr><td>bentley</td></tr>' lit= lit + '<tr><td>ford</td></tr>' lit= lit + '<tr><td>mustang</td></tr>' } if (ans == '') { lit = lit + '<br/>ferrari<br/>' lit = lit + '<br/>bentley<br/>' lit = lit + '<br/>ford<br/>' lit = lit + '<br/>mustang<br/>' } document.getElementById('rep').innerHTML=lit } </SCRIPT> </HEAD> <BODY> <FORM ACTION="#" NAME="quest"> <SELECT NAME="q1" ONCHANGE="setup(document.quest.q1.value)"> <OPTION VALUE="">- Please select -</OPTION> <OPTION VALUE="color">Color</OPTION> <OPTION VALUE="number">Number</OPTION> <OPTION VALUE="cars">Cars</OPTION> </SELECT> <table class="table_manning" cellspacing="0"> <tr id="rep"> </tr> </table> </FORM> </BODY> </HTML> Code (markup):
yeah but i already have the start of the table <table class="table_manning" cellspacing="0"> <tr id="rep"> </tr> </table> Code (markup): so do i delete the <table class="table_manning" cellspacing="0"> to just table id="rep"..> but if so my ways works on firefox safari except chrome instead of showing all in one collumn with different rows like on the others in chrome show as various columns
i did what you told me earlier removed the <tr id="rep"> and replaced with <table id="rep"..> works on chrome now thank you very much for your help thank you very much