JavaScript - Problem In Displaying The Fetched Data From Db On Mouseover In A Table
Hi all,
I have a code that will fetch out the data from database OnMouseOver. But it is working fine if don't add table on the div which will come OnMouseOver. If i try to show the fetched data in table then the code doesn't work. Please someone help me with this. Here is my code: Code: <script type="text/javascript" language="JavaScript"> var cX = 0; var cY = 0; var rX = 0; var rY = 0; function UpdateCursorPosition(e){ cX = e.pageX; cY = e.pageY;} function UpdateCursorPositionDocAll(e){ cX = event.clientX; cY = event.clientY;} if(document.all) { document.onmousemove = UpdateCursorPositionDocAll; } else { document.onmousemove = UpdateCursorPosition; } function AssignPosition(d) { if(self.pageYOffset) { rX = self.pageXOffset; rY = self.pageYOffset; } else if (document.documentElement && document.documentElement.scrollTop) { rX = document.documentElement.scrollLeft; rY = document.documentElement.scrollTop; } else if (document.body) { rX = document.body.scrollLeft; rY = document.body.scrollTop; } if(document.all) { cX += rX; cY += rY; } d.style.left = (cX+10) + "px"; d.style.top = (cY+10) + "px"; } function HideContent(d) { if(d.length < 1) { return; } document.getElementById(d).style.display = "none"; } function ShowContent(d) { if(d.length < 1) { return; } var dd = document.getElementById(d); AssignPosition(dd); dd.style.display = "block"; } function ReverseContentDisplay(d) { if(d.length < 1) { return; } var dd = document.getElementById(d); AssignPosition(dd); if(dd.style.display == "none") { dd.style.display = "block"; } else { dd.style.display = "none"; } } //--> </script> </head> <body> <table align="center" width="300px"/> <tr> <td>MakeID</td> <td>Make</td> <td>Veh Type</td> </tr> <?php $conn = mysql_connect ('localhost', 'root', ''); mysql_select_db ('my_db', $conn); function create_div($width, $height, $fields, $table, $w_field, $w_value, $unique) { $f = implode("`, `", $fields); $sql = "SELECT `$f` FROM `$table` WHERE `$w_field` = '$w_value'"; $res = mysql_query($sql) or die(mysql_error()); $div = "<div align=center id=\"data".$unique."\" style=\"display:none; position:absolute; border-style:solid; background-color:white; padding: 10px; width:".$width."px; height:".$height."px\" />\n"; $div .= '<table width="100%" cellpadding="4" cellspacing="2">'; $div .= '<tr><th>Serial</th><th>First Name</th><th>Email</th></tr>'; while($r = mysql_fetch_assoc($res)){ $div .= '<tr>'; $div .= '<td>'.$r['id'].'</td>'; $div .= '<td>'.$r['firstname'].'</td>'; $div .= '<td>'.$r['email'].'</td>'; $div .= "</tr>"; $div .= "</table>"; $div .= "</div>\n"; return $div; } $sql = "SELECT * FROM name"; $res = mysql_query($sql) or die(mysql_error()); $i=0; $fields = array("id", "firstname", "email"); while($r = mysql_fetch_assoc($res)){ echo create_div("300", "200", $fields, "admin", "id", $r['id'], $i); ?> <tr> <td><?php echo $r['id']; ?></td> <td><a onmouseover="ShowContent('data<?php echo $i; ?>'); return true;" onmouseout="HideContent('data<?php echo $i; ?>'); return true;" href="#"><?php echo $r['name'];?></a> </td> <td><?php echo $r['desc']; ?></td> </tr> <?php $i++; } ?> </table> </body> </html> Similar TutorialsHi, I am new to javascript, Please help me with the issue below. My javascript code below should actually fetch the data from html table on button click. function displaymessage() { alert ("button pressed"); var table_cells = new Array(); var table7 = document.getElementById('Auth'); for (i=0,n=table7.rows.length; i < n ; i++) { var Rowdata = table7.rows[i]; table_cells[i] = new Array(); for(j=0,cols = Rowdata.cells.length; j < cols; j++) { table_cells[i,j] = Rowdata.cells[j].innerHTML; alert (table_cells[i,j]); } } alert (table_cells[1,1]); alert (table_cells[2,1]); alert (table_cells[3,1]); alert (table_cells[4,1]); alert (table_cells[5,1]); alert (table_cells[6,1]); alert (table_cells[7,1]); alert (table_cells[8,1]); } The problem with my code above is that the statement "alert (table_cells[i,j]);" executes properly and shows the correct value. But the other alert statements shows only the value of the last row of the table. i.e., my table has 9 rows. and all the alert statements shows 9th row's 2nd column's value outside the for loop. But inside the for loop it executes fine. I tried it in IE7. I seem to miss something. Could someone please help me out with this? Thanks in advance. Hi guys, any help will be greatly appreciated... The problem: Hover effect is painfully slow IE (only IE) and table mouseover causes very high processor usage When you move the mouse over table elements flash animation stutters/pauses (making flash banners impossible) You can se the page he fondovi (there's a flash animation on the right side of the page (light grey/blue color)) I am not sure if this is a javascript problem or an html problem. I have posted the code below. The main two areas that I am interested in are 1) the area where the photo is shown in the larger size, and 2) the thumbnails below the larger picture. Right now in the img tag of the first image I have specified a height and width of 450px. The result is that when one hovers the mouse over the thumbnails, all pictures are shown at that size, regardless if they are larger or smaller than 450 x 450 pixels. I am not concerned about the larger images because I will use a script to scale those that someone on this forum was so kind enough to provide me with. The IMPORTANT PART IS HE I am concerned with smaller images. If you remove the height and width portion from the image tag, when you hover the mouse over a picture that's smaller than the others, such as the last one, which is smaller than all the others that are at 450 x 450, the thumbnails "move up". I would like the thumbnails to remain where they are at / for the top area where the photos are displayed to always be the same size, such as 450 x 450 px., and for the smaller pictures to be shown in the center in that area. How can this be done? Note: The entire portion of the stylesheet is not present. Let me know if something important is missing. Code: <html> <head> <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"> <title>MouseOver-Images</title> <style type="text/css"> td#kdwhdMAINPHOTO { width: 616px; vertical-align: top; } table#kdwhdTHUMB { margin-top: 12px; } td#kdwhdTHUMBNAILS { background-image: url(http://www.sunandfuninoc.com/testingsites/gems4me/images/t_28.jpg); width: 616px; height: 114px; text-align: center; } td#kdwhdTHUMBNAILS img { border: 1px solid #696969; } td#kdwhdTABLE { width: 296px; vertical-align: top; } --> </style> </head> <body> <table style="width: 924px;" border="0" cellpadding="0" cellspacing="0"> <tbody> <tr> <td id="kdwhdMAINPHOTO" style="text-align: center; background-color: white;"> <!--Image 1--> <img src="http://site.gems4me.com/images/red2.jpg" alt="Item photo" name="swap" style="border: 0px solid rgb(105, 105, 105);" height="450" width="450"> <table id="kdwhdTHUMB" border="0" cellpadding="0" cellspacing="0" width="616"> <tbody> <tr> <td><img src="http://www.sunandfuninoc.com/testingsites/gems4me/images/t_26.jpg" alt="Click on the picture below to enlarge" height="25" width="616"></td> </tr> <tr> <td><img src="http://www.sunandfuninoc.com/testingsites/gems4me/images/t_27.jpg" alt="" height="10" width="616"></td> </tr> <tr> <td id="kdwhdTHUMBNAILS"><!--Image 1--><img src="http://site.gems4me.com/images/450by450.jpg" alt="Item photo" onmouseover="document.swap.src='http://site.gems4me.com/images/450by450.jpg';" height="80"> <!--Image 2--> <img src="http://site.gems4me.com/images/450by450-2.jpg" alt="Item photo" onmouseover="document.swap.src='http://site.gems4me.com/images/450by450-2.jpg';" height="80"> <!--Image 3--> <img src="http://site.gems4me.com/images/450by450.jpg" alt="Item photo" onmouseover="document.swap.src='http://site.gems4me.com/images/450by450.jpg';" height="80"> <!--Image 4--> <img src="http://site.gems4me.com/images/450by450-2.jpg" alt="Item photo" onmouseover="document.swap.src='http://site.gems4me.com/images/450by450-2.jpg';" height="80"> <!--Image 5--> <img src="http://site.gems4me.com/images/red2.jpg" alt="Item photo" onmouseover="document.swap.src='http://site.gems4me.com/images/red2.jpg';" height="80"></td> </tr> <tr> <td><img src="http://www.sunandfuninoc.com/testingsites/gems4me/images/t_29.jpg" alt="" height="10" width="616"></td> </tr> </tbody> </table> </td> <td><img src="http://www.sunandfuninoc.com/testingsites/gems4me/images/spacer.gif" alt="" height="1" width="12"></td> <td id="kdwhdTABLE"> <table border="0" cellpadding="5" cellspacing="0" width="296"> <tbody> <tr> <td colspan="2" id="kdwhdTABLETITLE">Stuff</td> </tr> <tr> <td class="kdwhdSPECR1C1" nowrap="nowrap">Stuff</td> <td class="kdwhdSPECR1C2">Stuff</td> </tr> <tr> <td class="kdwhdSPECR2C1" nowrap="nowrap">Stuff</td> <td class="kdwhdSPECR2C2">Stuff </td> </tr> <tr> <td class="kdwhdSPECR2C1" nowrap="nowrap">Stuff</td> <td class="kdwhdSPECR2C2">Stuff</td> </tr> <tr> <td class="kdwhdSPECR2C1" nowrap="nowrap">Stuff</td> <td class="kdwhdSPECR2C2">Stuff</td> </tr> <tr> <td class="kdwhdSPECR2C1" nowrap="nowrap">Stuff</td> <td class="kdwhdSPECR2C2">Stuff</td> </tr> <tr> <td class="kdwhdSPECR2C1" nowrap="nowrap">Stuff</td> <td class="kdwhdSPECR2C2">Stuff</td> </tr> <tr> <td class="kdwhdSPECR2C1" nowrap="nowrap">Stuff</td> <td class="kdwhdSPECR2C2">Stuff</td> </tr> <tr> <td class="kdwhdSPECR2C1" nowrap="nowrap">Stuff</td> <td class="kdwhdSPECR2C2">Stuff</td> </tr> <tr> <td class="kdwhdSPECR2C1" nowrap="nowrap">Stuff</td> <td class="kdwhdSPECR2C2">Stuff</td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </body> </html> Hi, thanks for looking. I'm new to JS and am trying to use an image several times on the same page, having each image show rollover behavior. The rollover code works for the first image on the page, but when I hover over subsequent images it only changes the rollover state of the first image on the page, not the image I'm hovering over. Any help would be appreciated. I'm using the following functions to change rollover state: Code: gallery_on = new Image ( ); gallery_off = new Image ( ); gallery_on.src = "gallery_on.png"; gallery_off.src = "gallery_off.png"; function button_on ( imgId ) { if ( document.images ) { butOn = eval ( imgId + "_on.src" ); document.getElementById(imgId).src = butOn; } } function button_off ( imgId ) { if ( document.images ) { butOff = eval ( imgId + "_off.src" ); document.getElementById(imgId).src = butOff; } } Hi, I can't figure out what's wrong with my code here, but my mouseovers aren't working. Here's the page: http://www.basentana.com/pastproductions2.html I appreciate any help at all. Greetings fellow coders, I am having an issue with my rollover images. The first image (when hovered over) is fine, however when I hover over the second image the mouseover effect replaces the first jpg. Any idea how I can seperate the behaviours so my 2nd image mouseover glow is in it's correct place? Thanks in advance, Zeme Andrews 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> <title>test</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <script language="javascript" type="text/javascript"> if (document.images) { var button1 = new Image(); var button2 = new Image(); var button3 = new Image(); var button4 = new Image(); var button5 = new Image(); var button6 = new Image(); button1.src= "images/thumb1.jpg" ; button2.src= "images/thumb1_glow.jpg"; button3.src= "images/thumb2.jpg"; button4.src= "images/thumb2_glow.jpg"; button5.src= "images/thumb3.jpg"; button6.src= "images/thumb3_glow.jpg"; } </script> <script type="text/javascript" src="/nav/tb/jquery.js"></script> <script type="text/javascript" src="/nav/tb/thickbox.js"></script> </head> <body> <table width="530" border="5" cellspacing="0" cellpadding="0" align="left"> <tr><td align="justify"> <img src="images/thumb1.jpg" height="230" width="150" alt="" border="2" hspace="5" name="rollover" onmouseover="document.rollover.src=button2.src" onmouseout="document.rollover.src=button1.src" /> <img src="images/thumb2.jpg" height="230" alt="" width="150" border="2" hspace="5" name="rollover_1" onmouseover="document.rollover.src=button4.src" onmouseout="document.rollover.src=button3.src" /> <img src="images/thumb3.jpg" height="230" alt="" width="150" border="2" hspace="5" name="rollover_2" onmouseover="document.rollover.src=button6.src" onmouseout="document.rollover.src=button5.src" /> </td></tr> </table> </body> </html> I'm using Adobe GoLive 5... Mouseover buttons on the navigation bar don't function properly on the web, but they do in GoLive. I believe it's a Javascript coding issue, but I can't figure out exactly what (I'm no programmer). The site I'm working on is www.txbrandland.com - can anyone show me what's wrong or missing in the following code? I appreciate any help I can get. Code: <html> <head> <meta http-equiv="content-type" content="text/html;charset=iso-8859-1"> <meta name="generator" content="Adobe GoLive 5"> <title>Welcome to Texas Brand Land Co.</title> <csscriptdict import> <script src="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/GeneratedItems/CSScriptLib.js"></script> </csscriptdict> <csactiondict> <script><!-- CSInit[CSInit.length] = new Array(CSILoad,/*CMP*/'Main Page',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/home-out.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/home-in.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/home-in.jpg',''); CSInit[CSInit.length] = new Array(CSILoad,/*CMP*/'Acreage With House',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/awh-out.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/awh-in.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/awh-in.jpg',''); CSInit[CSInit.length] = new Array(CSILoad,/*CMP*/'Acreage Only',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/a-out.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/a-in.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/a-in.jpg',''); CSInit[CSInit.length] = new Array(CSILoad,/*CMP*/'Homes Only',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/h-out.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/h-in.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/h-in.jpg',''); CSInit[CSInit.length] = new Array(CSILoad,/*CMP*/'Commercial Property',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/comm-out.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/comm-in.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/comm-in.jpg',''); CSInit[CSInit.length] = new Array(CSILoad,/*CMP*/'About Us',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/about-out.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/about-in.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/about-in.jpg',''); CSInit[CSInit.length] = new Array(CSILoad,/*CMP*/'Meet Our Team',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/agents-out.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/agents-in.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/agents-in.jpg',''); CSInit[CSInit.length] = new Array(CSILoad,/*CMP*/'Community Information',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/links-out.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/links-in.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/links-in.jpg',''); CSInit[CSInit.length] = new Array(CSILoad,/*CMP*/'Contact Information',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/contact-out.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/contact-in.jpg',/*URL*/'file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/contact-in.jpg',''); // --></script> </csactiondict> </head> <body onload="CSScriptInit();"> <div align="left"> <br> <table border="0" cellpadding="0" cellspacing="10" align="left" width="164" height="355"> <tr> <td> <div align="center"> <csobj w="175" h="35" t="Button" ht="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/home-in.jpg" cl="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/home-in.jpg"><a href="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/index.html" onmouseover="return CSIShow(/*CMP*/'Main Page',1)" onmouseout="return CSIShow(/*CMP*/'Main Page',0)" onclick="CSIShow(/*CMP*/'Main Page',2);return CSButtonReturn()"><img src="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/home-out.jpg" width="175" height="35" name="Main Page" border="0"></a></csobj></div> </td> </tr> <tr> <td> <div align="center"> <csobj w="175" h="35" t="Button" ht="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/awh-in.jpg" cl="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/awh-in.jpg"><a href="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/Acreage%20With%20House.html" onmouseover="return CSIShow(/*CMP*/'Acreage With House',1)" onmouseout="return CSIShow(/*CMP*/'Acreage With House',0)" onclick="CSIShow(/*CMP*/'Acreage With House',2);return CSButtonReturn()"><img src="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/awh-out.jpg" width="175" height="35" name="Acreage With House" border="0"></a></csobj></div> </td> </tr> <tr> <td> <div align="center"> <csobj w="175" h="35" t="Button" ht="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/a-in.jpg" cl="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/a-in.jpg"><a href="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/Acreage.html" onmouseover="return CSIShow(/*CMP*/'Acreage Only',1)" onmouseout="return CSIShow(/*CMP*/'Acreage Only',0)" onclick="CSIShow(/*CMP*/'Acreage Only',2);return CSButtonReturn()"><img src="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/a-out.jpg" width="175" height="35" name="Acreage Only" border="0"></a></csobj></div> </td> </tr> <tr> <td> <div align="center"> <csobj w="175" h="35" t="Button" ht="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/h-in.jpg" cl="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/h-in.jpg"><a href="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/Homes.html" onmouseover="return CSIShow(/*CMP*/'Homes Only',1)" onmouseout="return CSIShow(/*CMP*/'Homes Only',0)" onclick="CSIShow(/*CMP*/'Homes Only',2);return CSButtonReturn()"><img src="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/h-out.jpg" width="175" height="35" name="Homes Only" border="0"></a></csobj></div> </td> </tr> <tr> <td> <div align="center"> <csobj w="175" h="35" t="Button" ht="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/comm-in.jpg" cl="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/comm-in.jpg"><a href="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/Commercial.html" onmouseover="return CSIShow(/*CMP*/'Commercial Property',1)" onmouseout="return CSIShow(/*CMP*/'Commercial Property',0)" onclick="CSIShow(/*CMP*/'Commercial Property',2);return CSButtonReturn()"><img src="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/comm-out.jpg" width="175" height="35" name="Commercial Property" border="0"></a></csobj></div> </td> </tr> <tr> <td> <div align="center"> <csobj w="175" h="35" t="Button" ht="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/about-in.jpg" cl="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/about-in.jpg"><a href="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/About%20Us.html" onmouseover="return CSIShow(/*CMP*/'About Us',1)" onmouseout="return CSIShow(/*CMP*/'About Us',0)" onclick="CSIShow(/*CMP*/'About Us',2);return CSButtonReturn()"><img src="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/about-out.jpg" width="175" height="35" name="About Us" border="0"></a></csobj></div> </td> </tr> <tr> <td> <div align="center"> <csobj w="175" h="35" t="Button" ht="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/agents-in.jpg" cl="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/agents-in.jpg"><a href="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/Meet%20Our%20Team.html" onmouseover="return CSIShow(/*CMP*/'Meet Our Team',1)" onmouseout="return CSIShow(/*CMP*/'Meet Our Team',0)" onclick="CSIShow(/*CMP*/'Meet Our Team',2);return CSButtonReturn()"><img src="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/agents-out.jpg" width="175" height="35" name="Meet Our Team" border="0"></a></csobj></div> </td> </tr> <tr> <td> <div align="center"> <csobj w="175" h="35" t="Button" ht="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/links-in.jpg" cl="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/links-in.jpg"><a href="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/Community.html" onmouseover="return CSIShow(/*CMP*/'Community Information',1)" onmouseout="return CSIShow(/*CMP*/'Community Information',0)" onclick="CSIShow(/*CMP*/'Community Information',2);return CSButtonReturn()"><img src="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/links-out.jpg" width="175" height="35" name="Community Information" border="0"></a></csobj></div> </td> </tr> <tr> <td><csobj w="175" h="35" t="Button" ht="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/contact-in.jpg" cl="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/contact-in.jpg"><a href="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/Contact%20Us.html" onmouseover="return CSIShow(/*CMP*/'Contact Information',1)" onmouseout="return CSIShow(/*CMP*/'Contact Information',0)" onclick="CSIShow(/*CMP*/'Contact Information',2);return CSButtonReturn()"><img src="file:///E:/Website%20Construction/+TXBRANDLAND%20WEBSITE/TXBRANDLAND/public_html/TXBLC%20Site%20Contents/Images/Buttons/contact-out.jpg" width="175" height="35" name="Contact Information" border="0"></a></csobj></td> </tr> </table> </div> </body> </html> Hi all, Javascript is totally new to me and I am very frustrated. I have been trying to put together this ebay template and it's all set except I can't get my thumbnails to show the large image when you mouseover it! I believe my problem is that I don't have the <script type="text/javascript"> or <language=javascript> tag in the beginning of the template. Problem is im not sure if that's the prob or where to put it!! I tried putting it at the top and it made it so the whole template disappeared. I've tried putting it at various diff places and it messes the whole thing up. I'm lost! Please help! Here's the listing (sorry I would post just the part where there's an issue but I can't tell where that is! ) http://cgi.ebay.com/ws/eBayISAPI.dll...%3DI%26otn%3D2 I'm a beginner and want to know if there is a way to display more then one item of data in a new window. I've done some tests using document.write but it seems that the document.write writes over everthing else that im trying to display. is there another way other then Document.write? thanks John http://rs-downfall.com/scripts/graph/players.php I have this page.. If you view the source there is more data in the dataset than is being displayed on the graph.. Anyone know what the problem is? Watch the answer to this problem be simple... but when I tried searching for similar problems, I can't find anything that helps. On a website of mine, I have a picture that acts as the navigation. When the user hovers over it, it changes pictures to show one section lighting up and the text to show where that one links to under it. Later, I changed it to show, when the mouse isn't hovering over the picture, the pictures automatically scrolling on a timer to show all the options. While this works most of the time, I recently discovered the reason behind a 'glitch' my friend noticed... but I'm unsure of how to fix it. The problem is, when the mouse is already on the picture as the page loads, it starts the timer even though the mouse is there. This causes it to keep trying to switch the picture on its own even when hovering over the picture. And when the mouse is off the picture, it changes it twice at an odd interval. In other words, it's starting the timer up twice and only cuts one of them off when you hover over the image. Here's a link to the site so you can see for yourself: http://nebula-andra.com/ (And if links aren't allowed, just let me know and I'll remove it--it's simply easier to see) Here's the code I have for the image timer... In the header, in a Javascript tag: Code: var currPic = 0; var totPics = 12; var keepTime; var picName; function setupPicChange(){ keepTime=setTimeout("changePic()", 2000); } function changePic(){ currPic++; if(currPic > totPics) currPic = 1; document.getElementById("logos").src="../images/logo/NA Logo - " + currPic + ".png"; setupPicChange(); } function stopTimer(){ clearTimeout(keepTime); } function startTimer(){ keepTime=setTimeout("changePic()", 2000); } In the body: Code: <body onload="setupPicChange();"> <div id="logo_setup"> <p align="center" onmouseover="stopTimer();" onmouseout="startTimer();"><img src="../images/logo/NA_Logo.png" id="logos" name="logos" border=0 usemap="#logo"> I want the timer to start without the user having to do anything and complete stop when the user hovers over the picture. If there's anything else you need to see to help with this problem, please let me know. And thank you for taking the time to read this; I look forward to any suggestions you can give me. Note: This is being tested in Chrome, but the problem has appeared in both Firefox and IE as well. Hi, I have a small problem with a page I'm working on. I have an anchor tag inside a table that has a mouseover event that updates a contextual help box. I need to add a similar mouseover event to the anchor tag that does the same thing, but updates the help box with different text. The problem I have is that when the mouse is over the table, no matter if I move the mouse over the anchor, the help text only displays the message that is passed from the table's mouseover function call. I think the solution *may* be something to do with event bubbling, but I'm not exactly sure how to implement it. The code I'm dealing with is below: The code below is PHP. The table mouseover (for reference): Code: echo "<table class='cleanTable' width='100%' style='margin-top: 5px'"; echo " onMouseOver=\"updateHelpText('Message 1.');\" onMouseOut='clearHelpText();'>"; echo "<tr><th> </th><th> </th><th>First Name</th><th>Surname</th><th>Last Login</th></tr>"; The anchor mouseover: Code: echo "<tr class='cleanrow'><td><a href='newMember.php'><img border='0' src='images/icon_add.gif'></a></td><td></td>"; echo "<td colspan='3'><a class='workbenchLink' href='newMember.php' onMouseOver=\"updateHelpText('Message 2');\" onMouseOut='clearHelpText();'>Invite a new colleague...</a></td></tr>"; echo "</table>"; The function (javascript): Code: function updateHelpText(newText) { document.getElementById("helpBox").innerHTML = "<h4> " + newText + "</h4>"; } Any help with this would be great, thanks. Hi all, i'm using this code: Code: var r_text = new Array (); r_text[0] = "Random Text 0"; r_text[1] = "Random Text 1"; r_text[2] = "Random Text 2"; r_text[3] = "Random Text 3"; r_text[4] = "Random Text 4"; r_text[5] = "Random Text 5"; r_text[6] = "Random Text 6"; r_text[7] = "Random Text 7"; r_text[8] = "Random Text 8"; var i = Math.floor(9*Math.random()); { document.write("<Marquee SCROLLAMOUNT=10><FONT-FAMILY: 'Calibri'><FONT-SIZE: 13pt)<B><FONT COLOR='#FFFF00'>" + r_text[i] + "</FONT></B></FONT-SIZE></FONT-FAMILY></Marquee>"); } This code works as far as me getting a right to left marquee, which, every time the page reloads, generates one of the random pieces of text. I'd like to add a piece of coding to this so that on mouseover, the marquee will pause, but I don't have a clue what to add, or where. My other problem: The text is yellow..size 10, yet whatever font family i specify, will ALWAYS appear in the font Georgia (in the browser im using, Firefox.) in both Opera and IE, it comes out Times New Roman! this is a real rooky problem, but i am a rooky and i'd just like to understand why, and how to ACTUALLY get Calibri. Any help would be greatly appreciated Hey, i am just trying to learn javascript and my friend gave me a little assignment to try and figure out. i am having trouble figuring it out and need some help. basically i just want to display the information in my associative array, into an html table. var NFC_east = new Array(); NFC_east[0]=["Giants", 16, 0, "Eli Manning"]; NFC_east[1]=["Cowboys", 0, 16, "Tony Romo"]; NFC_east[2]=["Redskins", 0, 16, "Donnovan McNabb"]; NFC_east[3]=["Eagles", 0, 16, "Mike Vick"]; that's my array. now i need to display that in a table with a Team column, wins column, loses column, and a quarterback column. i basically want to do this using a for loop, and he gave me a hint about using a nested while loop as well somehow. i know i need to use getElementById, id, and innerHTML stuff but i just don't know how to do it. i cant find anything to help me with this simple task, hoping someone here could help. Hey, I have a location lookup tool that pulls data from a Google Fusion table. User's type their address in and it drops a pin and info window at the place / result that matches their location. It works great with one location, but now I need it to display multiple results / drop multiple pins if they match the criteria Here's the working code that drops one pin (sorry it's a lot): Code: google.load('visualization', '1', {'packages':['corechart', 'table', 'geomap']}); var FusionTableID = 'tableid'; var map = null; var geocoder = null; var infowindow = null; var marker = null; function initialize() { geocoder = new google.maps.Geocoder(); infowindow = new google.maps.InfoWindow({size: new google.maps.Size(150,50) }); // create the map var myOptions = { zoom: 7, center: new google.maps.LatLng(41.9908, -93.4208), mapTypeControl: true, mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}, navigationControl: true, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); layer = new google.maps.FusionTablesLayer({ query: {from:FusionTableID}, styles: [{ polygonOptions: { fillColor:'#000000', fillOpacity: 0.01, strokeColor:'#000000', strokeOpacity: 0.01 } }], suppressInfoWindows:true }); layer.setMap(map); google.maps.event.addListener(layer, "click", function(e) { var content = "<b>"+e.row['name'].value+"</b>"; infowindow.setContent(content); infowindow.setPosition(locationgeocode); infowindow.open(map); }); document.getElementById('submit').onclick = function() { document.getElementById("submit").value = "Searching"; }; } function showAddress(address) { var contentString = address+"<br>Outside Area"; geocoder.geocode( { 'address': address}, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { var point = results[0].geometry.location; contentString += "<br>"; // query FT for data var queryText ="SELECT 'County', 'Name', 'Location Name', 'Location Address', 'Location City', 'Location State', 'Location Zip', 'geocode' FROM "+FusionTableID+" WHERE ST_INTERSECTS(\'geometry\', CIRCLE(LATLNG(" + point.toUrlValue(6) + "),0.01));"; // document.getElementById('FTQuery').innerHTML = queryText; queryText = encodeURIComponent(queryText); var query = new google.visualization.Query('http://www.google.com/fusiontables/gvizdata?tq=' + queryText); //set the callback function query.send(openInfoWindowOnMarker); } else { alert("Geocode was not successful for the following reason: " + status); } }); } function openInfoWindowOnMarker(response) { if (!response) { alert('no response'); return; } if (response.isError()) { alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage()); return; } FTresponse = response; //for more information on the response object, see the documentation //http://code.google.com/apis/visualization/documentation/reference.html#QueryResponse numRows = response.getDataTable().getNumberOfRows(); numCols = response.getDataTable().getNumberOfColumns(); var content = "<b>Outside of Iowa</b><!--"; var unionBounds = null; // alert(numRows); for (var i=0; i < numRows; i++) { var county = FTresponse.getDataTable().getValue(i,0); var precinct = FTresponse.getDataTable().getValue(i,1); var locationname = FTresponse.getDataTable().getValue(i,2); var locationaddress = FTresponse.getDataTable().getValue(i,3); var locationcity = FTresponse.getDataTable().getValue(i,4); var locationstate = FTresponse.getDataTable().getValue(i,5); var locationzip = FTresponse.getDataTable().getValue(i,6); var locationgeocode = FTresponse.getDataTable().getValue(i,7); // var kml = FTresponse.getDataTable().getValue(i,1); // create a geoXml3 parser for the click handlers content = "<b>"+locationname+"</b><br />"+locationaddress+"<br />"+locationcity+locationstate+" "+locationzip+"<br/><a href='http://maps.google.com/maps?daddr="+locationaddress+" "+locationcity+" IA "+locationzip+"' target='_blank' >Click here for Directions</a><br /></br></p><!--"; /* var geoXml = new geoXML3.parser({ map: map, zoom: false }); // alert(kml); geoXml.parseKmlString("<Placemark>"+kml+"<\/Placemark>"); geoXml.docs[0].gpolygons[0].setMap(null); if (!unionBounds) unionBounds = geoXml.docs[0].gpolygons[0].bounds; else unionBounds.union(geoXml.docs[0].gpolygons[0].bounds); */ } // zoom to the bounds // map.fitBounds(unionBounds); setTimeout(function() { google.maps.event.addListener(marker, 'click', function() { infowindow.open(map,marker); }); infowindow.setContent(content+marker.getPosition().toUrlValue(6)); google.maps.event.trigger(marker, 'click'); document.getElementById("submit").value = "Search"; }, 150); geocoder.geocode( { 'address': locationaddress+","+locationcity+locationstate+" "+locationzip}, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { var point = results[0].geometry.location; map.setCenter(point); map.setZoom(12); if (marker && marker.setMap) marker.setMap(null); marker = new google.maps.Marker({ map: map, position: point }); }; }); } I basically need it to drop multiple pins if multiple queries match var queryText ="SELECT 'County', 'Name', 'Location Name', 'Location Address', 'Location City', 'Location State', 'Location Zip', 'Hours', 'geocode' FROM "+FusionTableID+" WHERE ST_INTERSECTS(\'geometry\', CIRCLE(LATLNG(" + point.toUrlValue(6) + "),0.01));"; Any thoughts, fixes, or even a point in the right direction would be incredibly helpful. I'm really stuck on this one and have been trying at it for a couple of days now. Even something like getting it to print a second query that I can mark in the table as a second location would be helpful. Something like a second pin that matches: Code: var queryText2 ="SELECT 'County', 'Name', 'Location Name', 'Location Address', 'Location City', 'Location State', 'Location Zip', 'Hours', 'geocode' FROM "+FusionTableID+" WHERE ST_INTERSECTS(\'geometry\', CIRCLE(LATLNG(" + point.toUrlValue(6) + "),0.01)); AND locationname = 'Location 2'"; Thanks!! Hello all i'm stuck on the last part of my program. Basically it will generate the score and players position but it will no show the following: I'm also having trouble stopping the loop from going over 80 Now add code to your program which will: ! declare and initialise a variable to keep count of how many goes the player takes to get out; ! add one to this count every time the loop is repeated; ! write out the count in a suitable message at the end. Any help is very much appreciated. [CODE] var countMoves = 0; while (playersPosition <80) { playersScore = rollDie(); document.write('Sco ' + playersScore); playersPosition = playersScore + playersPosition; document.write(' squa ' + playersPosition); indexOfNumber = findIndexOf(playersPosition, specialSquaresArray); if (indexOfNumber != -1) { document.write(' ladder to square ' + connectedSquaresArray[indexOfNumber]); document.write('<BR>'); document.write('Sco ' + playersScore); playersScore = connectedSquaresArray[indexOfNumber] + playersScore; document.write(' squa ' + playersScore); playersPosition = playersScore; } document.write('<BR>'); } for (count =1; count <=array.length; count = count + 1) if(array[count] > array[countMoves]) { countMoves = count; } document.write('it took ' + indexOfNumber + 'goes to get out'); [CODE] Hi and thanks in advance! Someone on this site made a form for me that hides and displays fields, depending on which variable is chosen from a given array. They did a very good job with it with one exception. It seems the code that is used to hide certain fields also hides the form data rather than posting it when the form is submitted. Here is the code for both the java (listed first) and the form itself. Code: // Funtion // Description: show or hide element in the form according to selected element // function show_hide(){ if (!document.getElementById) return false; fila = document.getElementById('tr_firstname'); fila.style.display = "none"; //hide fila = document.getElementById('tr_firstname_data'); fila.style.display = "none"; //hide fila = document.getElementById('tr_email'); fila.style.display = "none"; //hide fila = document.getElementById('tr_email_data'); fila.style.display = "none"; //hide fila = document.getElementById('tr_email'); fila.style.display = "none"; //hide fila = document.getElementById('tr_email_data'); fila.style.display = "none"; //hide fila = document.getElementById('tr_receipt_invoice'); fila.style.display = "none"; //hide fila = document.getElementById('tr_receipt_invoice_data'); fila.style.display = "none"; //hide fila = document.getElementById('tr_url'); fila.style.display = "none"; //hide fila = document.getElementById('tr_url_data'); fila.style.display = "none"; //hide fila = document.getElementById('tr_description_comments'); fila.style.display = "none"; //hide fila = document.getElementById('tr_description_comments_data'); fila.style.display = "none"; //hide var strtext ; var nuoption= document.frmbodydata.csreason.length; var nuindice = document.frmbodydata.csreason.selectedIndex; var nuvalueSelect = document.frmbodydata.csreason.options[nuindice].value; var strtextSelect = document.frmbodydata.csreason.options[nuindice].text; if (nuvalueSelect==0 ) { return; } fila = document.getElementById('tr_description_comments'); fila.style.display = ""; //show fila = document.getElementById('tr_description_comments_data'); fila.style.display = ""; //show if (nuvalueSelect==1 || nuvalueSelect==3 || nuvalueSelect==4 || nuvalueSelect==5 ) { fila = document.getElementById('tr_firstname'); fila.style.display = ""; //show fila = document.getElementById('tr_firstname_data'); fila.style.display = ""; //show fila = document.getElementById('tr_email'); fila.style.display = ""; //show fila = document.getElementById('tr_email_data'); fila.style.display = ""; //show } if (nuvalueSelect==2 || nuvalueSelect==3 || nuvalueSelect==4 || nuvalueSelect==5 ) { fila = document.getElementById('tr_url'); fila.style.display = ""; //show fila = document.getElementById('tr_url_data'); fila.style.display = ""; //show } if (nuvalueSelect==4 ) { fila = document.getElementById('tr_receipt_invoice'); fila.style.display = ""; //show fila = document.getElementById('tr_receipt_invoice_data'); fila.style.display = ""; //show } } // // Function // Description: Validate the form for submit // function ValidateForm( form ) { var nuindice = form.csreason.selectedIndex; var nuvalueSelect = form.csreason.options[nuindice].value; if (nuvalueSelect==0 ) { return false; } valor = form.receipt_invoice.value; if (!freturn(valor)) return false; valor = form.description_comments.value; if (!freturn(valor)) return false; if (nuvalueSelect==1 || nuvalueSelect==3 || nuvalueSelect==4 || nuvalueSelect==5 ) { valor = form.firstname.value; if (!freturn(valor)) return false; } valor = form.lastname.value; if (!freturn(valor)) return false; valor = form.email.value; if (!freturn(valor)) return false; if (nuvalueSelect==2 || nuvalueSelect==3 || nuvalueSelect==4 || nuvalueSelect==4 ) { valor = form.url.value; if (!freturn(valor)) return false; } alert ("Thank you for your comment.") return true } // // Function // Description: Function to return TRUE or FALSE for inclomplete data // /*function freturn(pbolvalue) { if( pbolvalue == null || pbolvalue.length == 0 || /^\s+$/.test(pbolvalue) ) { alert ("Incomplete Data, check please."); return false; }else{ return true; } } */ function ReloadCaptchaImage(captchaImageId) { var obj = document.getElementById(captchaImageId); var src = obj.src; var date = new Date(); var pos = src.indexOf('&rad='); if (pos >= 0) { src = src.substr(0, pos); } obj.src = src + '&rad=' + date.getTime(); return false; } Code: <center> <form id="frmbodydata" name="frmbodydata" onsubmit="return ValidateForm(this);" action="http://www.SnapHost.com/captcha/WebFormSubmit.aspx" method="post"> <input id="SnapHostID" name="SnapHostID" value="2FMYX5LLTQZQ" type="hidden" /> <table align="center" border="0" cellpadding="0" cellspacing="0"> <tbody> <tr> <td>Reason for contact</td> </tr> <tr> <td><select id="csreason" name="csreason" onchange="show_hide();" align="left"> <option value="0">Please Select One</option> <option value="1">Contact</option> <option value="2">Report Bad Link</option> <option value="3">Gallery Submission</option> <option value="4">Preferred Partner Submission</option> <option value="5">Link Exchange</option> </select></td> </tr> <tr id="tr_firstname" style="display:none;"> <td>First name/Last name</td> </tr> <tr id="tr_firstname_data" style="display:none;"> <td><input id="firstname" /><input id="lastname" align="left" type="text" /></td> </tr> <tr id="tr_email" style="display:none;"> <td>Email</td> </tr> <tr id="tr_email_data" style="display:none;"> <td><input id="email" size="30" maxlength="30" align="left" type="text" /></td> </tr> <tr id="tr_receipt_invoice" style="display:none;"> <td>Receipt/Invoice</td> </tr> <tr id="tr_receipt_invoice_data" style="display:none;"> <td><input id="receipt_invoice" name="receipt_invoice" size="15" maxlength="15" align="left" type="text" /></td> </tr> <tr id="tr_url" style="display:none;"> <td>URL</td> </tr> <tr id="tr_url_data" style="display:none;"> <td><input id="url" size="80" maxlength="80" align="left" type="text" /></td> </tr> <tr id="tr_description_comments" style="display:none;"> <td>Description/Comments</td> </tr> <tr id="tr_description_comments_data" style="display:none;"> <td><textarea id="description_comments" rows="10" cols="50" align="left"> </textarea></td> </tr> <tr> <td><i>Enter security code</i></td> <td>SECURITY CODE</td> </tr> <tr> <td><input name="CaptchaCode" class="txtFields" maxlength="6" style="width:130px; height:28px; font-size:24px; text-align:center;" type="text" /></td> <td><a href="http://www.SnapHost.com/captcha/ProCaptchaOverview.aspx"><img id="CaptchaImage" alt="Web Form Code" style="margin-left:20px; border:1px solid #999999;" src="http://www.SnapHost.com/captcha/WebForm.aspx?id=2FMYX5LLTQZQ&ImgType=2" /></a> <br /> <a href="#" onclick="return ReloadCaptchaImage('CaptchaImage');"><span style="font-size:12px;">reload image</span></a></td> </tr> <tr> <td align="center"><input src="http://www.theopenpussy.com/1/images/submit.gif" alt="Submit button" type="image" /></td> </tr> <tr> <td></td> </tr> </tbody> </table> </form> </center> Sorry for all the code! Is there anything I can do to maintain the hide and seek nature of the forms and show the data that is submitted, or am I stuck displaying all fields all the time? Code: rownumber = 2; detailsTable = document.getElementsByName("detailsTable"); detailsRow = detailsTable.getElementsByTagName("tr")[rownumber]; name = detailsRow.getElementsbyTagName("td")[0]; address = detailsRow.getElementsbyTagName("td")[1]; address2 = detailsRow.getElementsbyTagName("td")[2]; phone = detailsRow.getElementsbyTagName("td")[3]; email = detailsRow.getElementsbyTagName("td")[4]; alert(name); I have been told if I want to get the text from each cell I can use: alert(name.firstChild.nodeValue); But I don't understand how to do this for what I am wanting to do. Here is my HTML: Code: <table border="0" name="detailsTable"> <tr> <td>a</td> <td>b</td> <td>c</td> <td>d</td> <td>e</td> </tr> </table> |