JavaScript - Script Keeps Changing Text Value To False
Hello,
I'm learning javascript and made this little program that takes the price, qty, adds tax and gives you a total. I put in an if statement so that if qty is 0, it becomes 1 then does the calcs. However, if I put in say price 5 and qty 2, qty is changing to false and it doesn't calc. Here it is: http://heresmary.com/test/Bought.html Similar TutorialsHi, am newbie in this domain ,so i appreciate any help of you. Am making a site for tattoos and i see somewhere an application in Java for changing text, it was simple text box where you write the text you want and down you choose the Font and down you have the text you want in the wanted fond. Thank you!
OK, so I'm wanting to set up a lightbox on my company's website. We use a CMS system call phpWebsite. So I place the following script... Code: <script type="text/javascript" src="/jquery.mousewheel-3.0.4.pack.js"></script> <script type="text/javascript" src="/jquery.fancybox-1.3.4.pack.js"></script> <link rel="stylesheet" type="text/css" href="/jquery.fancybox-1.3.4.css" media="screen" /> <script type = "text/javascript"> function setCookie(isName,isVal) { document.cookie = isName + "=" + isVal + ";expires=" + "path=/"; } function getCookie(isName){ cookieStr = document.cookie; startSlice = cookieStr.indexOf(isName+"="); if (startSlice == -1) {return null;} endSlice = cookieStr.indexOf(";",startSlice+1); if (endSlice == -1){endSlice = cookieStr.length} isData = cookieStr.substring(startSlice,endSlice) isValue = isData.substring(isData.indexOf("=")+1,isData.length); return isValue; } $(document).ready(function() { if ( getCookie('myCookie') != null ) return; // no light box! setCookie('myCookie', 'ANY VALUE'); // for next time $("a#onload").fancybox({ 'frameHeight': 390, 'frameWidth': 640, 'hideOnContentClick': false, 'easingIn': 2000 }).trigger('click'); }); </script> <div style="display: none;" id="lightbox_content"> <div id="data"><img alt="lightbox (188K)" src="./images/filecabinet/folder50/lightbox.jpg" height="330" width="650" border="0"/> </a> </div> </div> <p> <a id="onload" href="#data"> </a></p> Save I save my page, but when I go to the page it brings up that page in the lightbox instead of the image..... So I look at the source and it's changing the last line to this: Code: <p> <a id="onload" href="index.php?module=article&id=206#data"> </a></p> I've tried this multiple times and it keeps doing it. Is there another way to write the last line? I willing to try anything right now. Below is an example if you want to see exactly what I'm talking about example So i have this code and when you click on the first set of them (a specific one) it copys it and then when you click on one of the other ones it pastes it but its not working properly. (If you need to you can put an other image in there) Code: <script> var change = new Array change [0] = [0,0,0,0,0]; change [1] = [0,0,0,0,0]; change [2] = ["",0]; change [3] = [0,0,0,0,0]; function equipaa(){ change [0][0] = 1 change [0][4] = 0 change [0][1] = 0 change [0][2] = 0 change [0][3] = 0 changea(); } function equipab(){ change [0][1] = 1 change [0][0] = 0 change [0][4] = 0 change [0][2] = 0 change [0][3] = 0 changea(); } function equipac(){ change [0][2] = 1 change [0][0] = 0 change [0][1] = 0 change [0][4] = 0 change [0][3] = 0 changea(); } function equipad(){ change [0][3] = 1 change [0][0] = 0 change [0][1] = 0 change [0][2] = 0 change [0][4] = 0 changea(); } function equipae(){ change [0][4] = 1 change [0][0] = 0 change [0][1] = 0 change [0][2] = 0 change [0][3] = 0 changea(); } function equipba(){ change [1][0] = 1 change [1][4] = 0 change [1][1] = 0 change [1][2] = 0 change [1][3] = 0 changefinal(); } function equipbb(){ change [1][1] = 1 change [1][0] = 0 change [1][2] = 0 change [1][3] = 0 change [1][4] = 0 changefinal(); } function equipbc(){ change [1][2] = 1 change [1][0] = 0 change [1][1] = 0 change [1][3] = 0 change [1][4] = 0 changefinal(); } function equipbd(){ change [1][3] = 1 change [1][4] = 1 change [1][0] = 0 change [1][1] = 0 change [1][2] = 0 changefinal(); } function equipbe(){ change [1][4] = 1 change [1][0] = 0 change [1][1] = 0 change [1][2] = 0 change [1][3] = 0 changefinal(); } function changea(){ if(change [0] [0] = 1){ change [2] [0] = document.getElementById("is1i").src; change [2] [1] = change [3] [0]; } else if(change [0] [1] = 1){ change [2] [0] = document.getElementById("is2i").src; change [2] [1] = change [3] [1]; } else if(change [0] [2] = 1){ change [2] [0] = document.getElementById("is3i").src; change [2] [1] = change [3] [2]; } else if(change [0] [3] = 1){ change [2] [0] = document.getElementById("is4i").src; change [2] [1] = change [3] [3]; } else if(change [0] [4] = 1){ change [2] [0] = document.getElementById("is5i").src; change [2] [1] = change [3] [4]; } } function changefinal(){ if(change [1] [0] = 1){ document.getElementById("i1").src = change [2] [0]; } else if(change [1] [1] = 1){ document.getElementById("i2").src = change [2] [0]; } else if(change [1] [2] = 1){ document.getElementById("i3").src = change [2] [0]; } else if(change [1] [3] = 1){ document.getElementById("i4").src = change [2] [0]; } else if(change [1] [4] = 1){ document.getElementById("i5").src = change [2] [0]; } clear(); } function clear(){ change [0] [0] = 0; change [0] [1] = 0; change [0] [2] = 0; change [0] [3] = 0; change [0] [4] = 0; change [1] [0] = 0; change [1] [1] = 0; change [1] [2] = 0; change [1] [3] = 0; change [1] [4] = 0; } </script> <html> <body> <table border="0"> <tr> <td><div ><img onclick="equipba()" id="i1" src="http://i1188.photobucket.com/albums/z417/sherlockturtlee/itemblank.png"/></div></td> <td><div ><img onclick="equipbb()" id="i2" src="http://i1188.photobucket.com/albums/z417/sherlockturtlee/itemblank.png"/></div></td> <td><div ><img onclick="equipbc()" id="i3" src="http://i1188.photobucket.com/albums/z417/sherlockturtlee/itemblank.png"/></div></td> <td><div ><img onclick="equipbd()" id="i4" src="http://i1188.photobucket.com/albums/z417/sherlockturtlee/itemblank.png"/></div></td> <td><div ><img onclick="equipbe()" id="i5" src="http://i1188.photobucket.com/albums/z417/sherlockturtlee/itemblank.png"/></div></td> </tr> </table> <div id="invent"> <table border="o"> <tr> <td><div ondblclick="dropa();" onclick="equipaa();"><img id="is1i" src="http://i1188.photobucket.com/albums/z417/sherlockturtlee/itemblank.png"/></div></td> <td><div id="is1n"></div></td> <td><div id="is1d"></div></td> <td></td> </tr> <tr> <td><div ondblclick="dropb()" onclick="equipab();"><img id="is2i" src="http://i1188.photobucket.com/albums/z417/sherlockturtlee/itemblank.png"/></div></td> <td><div id="is2n"></div></td> <td><div id="is2d"></div></td> <td></td> </tr> <tr> <td><div ondblclick="dropc()" onclick="equipac();"><img id="is3i" src="http://i1188.photobucket.com/albums/z417/sherlockturtlee/itemblank.png"/></div></td> <td><div id="is3n"></div></td> <td><div id="is3d"></div></td> <td></td> </tr> <tr> <td><div ondblclick="dropd()" onclick="equipad();"><img id="is4i"src="http://i1188.photobucket.com/albums/z417/sherlockturtlee/itemblank.png"/></div></td> <td><div id="is4n"></div></td> <td><div id="is4d"></div></td> <td></td> </tr> <tr> <td><div ondblclick="drope()" onclick="equipae();"><img id="is5i" src="http://i1188.photobucket.com/albums/z417/sherlockturtlee/itemblank.png"/></div></td> <td><div id="is5n"></div></td> <td><div id="is5d"></div></td> <td></td> </tr> </table> </body> </html> Hi, I'm having a head against wall session and would appricate some help with modifying a google maps script.... I need the orginal script below; Code: //<![CDATA[ $(document).ready(function() { function initialize() { var myLatlng = new google.maps.LatLng(54.2385,-6.9846); var myOptions = { zoom: 8, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP } var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); var contentString = '<div id="content">'+ '<h3><? echo $org_name;?></h3>'+ '<div>'+ '<p><a href="#" class="bluelink">Link to profile'+ '#</a></p>'+ '</div>'+ '</div>'; var infowindow = new google.maps.InfoWindow({ content: contentString, maxWidth: 300 }); var marker = new google.maps.Marker({ position: myLatlng, map: map, title: '<? echo $org_name;?>', clickable: false, icon: 'http://google-maps-icons.googlecode.com/files/school.png' }); google.maps.event.addListener(marker, 'click', function() { infowindow.open(map,marker); }); } // Function added to help reset map and container boundaries $("#showMap").click(function() { $("#tab2").css({'display':'block'}); $("#map_canvas").css({'width':'630px', 'height':'400px'}); initialize(); //alert('showMap Clicked!'); }); initialize(); }); changed to Code: //<![CDATA[ var customIcons = { restaurant: { icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png', shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png' }, bar: { icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png', shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png' } }; function load() { var map = new google.maps.Map(document.getElementById("map"), { center: new google.maps.LatLng(53.943155, -7.437744), zoom: 13, mapTypeId: 'roadmap' }); var infoWindow = new google.maps.InfoWindow; // Change this depending on the name of your PHP file downloadUrl("phpsqlajax_genxml3.php", function(data) { var xml = data.responseXML; var markers = xml.documentElement.getElementsByTagName("marker"); for (var i = 0; i < markers.length; i++) { var name = markers[i].getAttribute("name"); var address = markers[i].getAttribute("address"); var type = markers[i].getAttribute("type"); var point = new google.maps.LatLng( parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng"))); var html = "<b>" + name + "</b> <br/>" + address; var icon = customIcons[type] || {}; var marker = new google.maps.Marker({ map: map, position: point, icon: icon.icon, shadow: icon.shadow }); bindInfoWindow(marker, map, infoWindow, html); } }); } function bindInfoWindow(marker, map, infoWindow, html) { google.maps.event.addListener(marker, 'click', function() { infoWindow.setContent(html); infoWindow.open(map, marker); }); } function downloadUrl(url, callback) { var request = window.ActiveXObject ? new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest; request.onreadystatechange = function() { if (request.readyState == 4) { request.onreadystatechange = doNothing; callback(request, request.status); } }; request.open('GET', url, true); request.send(null); } function doNothing() {} //]]> In order for the amended code to work I need to include the; // Function added to help reset map and container boundaries $("#showMap").click(function() { $("#tab2").css({'display':'block'}); $("#map_canvas").css({'width':'630px', 'height':'400px'}); initialize(); //alert('showMap Clicked!'); }); initialize(); so that the map will load in a jquery tab... PLEASE HELP ME!!! Hi, I'd like to ask why my script doesn't execute my reg expressions properly. I'm Using Jquery. Scenario: The user can input 2 values, start and end, and the program will attach '@' signs at them. so when the user entered 1 and 10, the script will append the value in a selectbox as "1@-10@". I created a script that counts the latest number of '@' signs. I can get the count but once I execute my regular expression it doesn't match any. Code: // I PASS THE VALUE OF '@' SIGN TO A VARIABLE, LETS TAKE 1 var atSignCount = 1; var tempArr = new Array(); tempArr["3"] = /^\d+\@{numOfAt}\-\d+\@{numOfAt}$/; tempArr["4"] = /^\[\d+\@{numOfAt}\-\d+\@{numOfAt}\][b]$/; tempArr["5"] = /^\[\d+\@{numOfAt}\-\d+\@{numOfAt}\]$/; tempArr["13"] = /^(missing)\d+\@{numOfAt}\-(missing)\d+\@{numOfAt}$/; for (offset in objConvert(['3','4','5','13'])) { // THIS DOES NOT WORK re = tempArr[offset].toString().replace(/numOfAt/g,atSignCount); // THIS WORKS //re = tempArr[offset].toString(); $('#selectbox option').each(function(i) { text = $.trim($(this).val()); if (text.match(re)!=null) { alert('match found'); } }); } function objConvert(a) { var o = {}; for(var i=0;i<a.length;i++) { o[a[i]]=''; } return o; } The script successfully changed the numOfAt and when i print the variable re it displays "/^\d+\@{1}\-\d+\@{1}$/" which should match the "1@-10@" in the selectbox but apparently it doesn't. any idea why? EDIT : So, i found an unsafe? solution to my problem. The problem when i tried converting the "suffix" to the @ sign count, the variable re becomes a string, unlike if i don't replace anything the variable re is an object. I find this out using the typeof command. so i tried converting the string to object using "eval" and yes it's now working but reading around says that eval is unsafe, etc. so any idea how to make string to object safer? Hi there, I have a menu with 4 links and 4 images associated with them. By default, the image from link 1 is displayed on the page. I would like to change the image with its corresponding one, each time i mouseover one of the other three links. I'm trying to make the following code work unsuccesfully, i might be missing something. Any help will be appreciated. In the <head> section i have this: <script type="text/javascript"> img1 = new Image(); img1.src = "images/party/party.jpg"; img2 = new Image(); img2.src = "images/party/icecream.jpg"; img3 = new Image(); img3.src = "images/party/juice.jpg"; img4 = new Image(); img4.src = "images/party/videogames.jpg"; function change(num){ document.images["linkpic"].src = "img" + num } </script> </head> In the <body> i have: That's my default image <table> <tr> <td width="100"> <img src="images/party/balloon1.jpg" name="linkpic"> </td> <td width="260" valign="top" align="left"> <table> <tr><td><a href="Party1.html" onmouseover="change('1')">Party and Fun</a></td></tr> <tr><td><a href="Party2.html" onmouseover="change('2')">Icecream </a></td></tr> <tr><td><a href="Party3.html" onmouseover="change('3')">Juice </a></td></tr> <tr><td><a href="Party4.html" onmouseover="change('4')">Video Games </a></td></tr> </table> </tr> </table> </body> I would like when i point to Icecream, the picture on the left to change to the Icecream picture and so on. Any hints and help are appreciated! Thanks! I want to change browser setting using Java Script. Any help Please. Thanks in advance. --sohan panwar Okay, I have this code, Code: <script type="text/javascript"> function changeText2(){ var userInput = document.getElementById('userInput').value; document.getElementById('boldStuff2').innerHTML = userInput; } </script> <p>Welcome to the site <b id='boldStuff2'>dude</b> </p> <input type='text' id='userInput' value='Enter Text Here' /> <input type='button' onclick='changeText2()' value='Change Text'/> A fairly simple one, and it is great, but I want to change it so that the text you type in stays there! Forever! For example, a person visits the site and types in "Hello" then the option of changing the text again disappears, and every visitor after that sees "Hello" (or whatever the first person types). Is this possible? Can anyone help me out! I am trying to change text in one cell of a table when a user selects an item from a select menu. The data for the select menu is being pulled from a database (which works fine). The select menu is displayed as expected; however the text in the div tag always comes up as "undefined" The code below is part of a PHP script (thus \" instead of ") I would like to employ a method that does not require extra Javascript in the <head> section as in this instance the code is being output from an include that is called long after the <head> area of the document is processed. Here is what I have Code: <tr><td><select name=\"race\" onchange=\"document.getElementById('ExtraInfo').firstChild.nodeValue = this.options[this.selectedIndex].extrainfo\"> <option selected=\"selected\" value=\"\">Select Race</option>\n"; $sql = mysql_query("SELECT * FROM races");$i=1; while ($row = mysql_fetch_array($sql)){ $output .= "<option value=\"$i\" ExtraInfo=\"{$row['des']}\">{$row['race']}</option>\n"; $i++; } $output .= "</select></td> <td><div id=\"ExtraInfo\">Select Race</div></td></tr> Any help will be greatly appreciated. I found a solution to my problem: by replacing: Code: <select name=\"race\" onchange=\"document.getElementById('ExtraInfo').firstChild.nodeValue = this.options[this.selectedIndex].extrainfo\"> with this: Code: <select name=\"race\" onchange=\"document.getElementById('ExtraInfo').firstChild.nodeValue = this.options[this.selectedIndex].getAttribute('extrainfo')\"> I currently have an image and underneath it there are 6 thumbnails. When I run the cursor over them the big image changes. This works fine. However, I would like to have text beside the big picture that also changes depending on the thumbnail over which I am hovering. I have tried to work it out myself but failed miserably. I have tried forums, but can't find what I need. My code as it stands at the moment is: <script type="text/javascript"> if (document.images) {image0 = new Image; image0.src = "i/p0.png"; image1 = new Image; image1.src = "i/p1.png"; image2 = new Image; image2.src = "i/p2.png"; image3 = new Image; image3.src = "i/p3.png"; image4 = new Image; image4.src = "i/p4.png"; image5 = new Image; image5.src = "i/p5.png"; image6 = new Image; image6.src = "i/p6.png"; }</script> and <img class="img" src="i/p0.png" align="left" width="300" name="rollimg" title='blah' alt="blah"/> <span class="inverse-text"><this is where I want changing text to appear as I roll over thumbnails.</span> <br clear="all"/> <span onmouseover="document.rollimg.src=image0.src;"><img src="i/tb/t0.jpg" class="img" width="70" alt="blah" title="blah"/></span> <span onmouseover="document.rollimg.src=image1.src;"><img src="i/tb/t1.gif" class="img" width="70" alt="blah" title="blah"/></span> <span onmouseover="document.rollimg.src=image2.src;"><img src="i/tb/t2.gif" class="img" width="70" alt="blah" title="blah"/></span> <span onmouseover="document.rollimg.src=image3.src;"><img src="i/tb/t3.gif" class="img" width="70" alt="blah" title="blah"/></span> <span onmouseover="document.rollimg.src=image4.src;"><img src="i/tb/t4.gif" class="img" width="70" alt="blah" title="blah"/> <span onmouseover="document.rollimg.src=image5.src;"><img src="i/tb/t5.gif" class="img" width="70" alt="blah" title="blah"/> <span onmouseover="document.rollimg.src=image6.src;"><img src="i/tb/t6.gif" class="img" width="70" alt="blah" title="blah"/> Ideally if you could tell me how to update the above script and code, so that it works, I would be very grateful. I'm building a template editor and need some help changing some of the variables. Part 1. Only at DEALERNAME. Must present coupon at time of write-up. Cannot be combined with any other offer. 1 coupon per customer per transaction. Expires: 00/00/00.s I need to be able to fill out two fields to change DEALERNAME and 00/00/00. I found a way to do this but it required the output to be in a field. I need it the output to look no different than before. Part 2. I'm using this to change some text via radio button but I would like an option to select how many details are there is the first place. Say they only want 1 or 2 details and not 3. Head Code: <script language="javascript" type="text/javascript"> function detail1a(){ document.getElementById("detail1").innerHTML = "Up to 5 Quarts"; } function detail1b(){ document.getElementById("detail1").innerHTML = "Synthetic Oil Extra"; } function detail1c(){ document.getElementById("detail1").innerHTML = "Lube Chassis"; } function detail2a(){ document.getElementById("detail2").innerHTML = "Up to 5 Quarts"; } function detail2b(){ document.getElementById("detail2").innerHTML = "Synthetic Oil Extra"; } function detail2c(){ document.getElementById("detail2").innerHTML = "Lube Chassis"; } function detail3a(){ document.getElementById("detail3").innerHTML = "Up to 5 Quarts"; } function detail3b(){ document.getElementById("detail3").innerHTML = "Synthetic Oil Extra"; } function detail3c(){ document.getElementById("detail3").innerHTML = "Lube Chassis"; } </script> Body Code: <span style="font-weight: bold;">Offer Details</span><br /> <p style="margin: 8px 10px"> Detail 1<br /> <input type="radio" name="on/off" onclick="detail1a();" />Up to 5 quarts<br /> <input type="radio" name="on/off" onclick="detail1b();" />Synthetic Oil Extra<br /> <input type="radio" name="on/off" onclick="detail1c();" />Lube Chassis<br /> </p> <p style="margin: 8px 10px"> Detail 2<br /> <input type="radio" name="on/off" onclick="detail2a();" />Up to 5 quarts<br /> <input type="radio" name="on/off" onclick="detail2b();" />Synthetic Oil Extra<br /> <input type="radio" name="on/off" onclick="detail2c();" />Lube Chassis<br /> </p> <p style="margin: 8px 10px"> Detail 3<br /> <input type="radio" name="on/off" onclick="detail3a();" />Up to 5 quarts<br /> <input type="radio" name="on/off" onclick="detail3b();" />Synthetic Oil Extra<br /> <input type="radio" name="on/off" onclick="detail3c();" />Lube Chassis<br /> </p> Output Code: <ul> <li><span id="detail1">Detail 1</span></li> <li><span id="detail2">Detail 2</span></li> <li><span id="detail3">Detail 3</span></li> </ul> I'm taking a JavaScript class in school and we are working with forms and summary pages. We were never taught how to change the font color and bgColor when we go to the summary page after an onSubmit. Can anyone fill me in on how it is done?
Hi all, I hoping somebody can help me. I'm trying to acheive a line of text (with multiple links on each line) that change at set intervals. The code below seems to be working but I can only get working links on the first line that appears. Please can somebody help a gal out? xo [CODE] <html> <head> <title>Rotating Text</title> <script type="text/javascript"> var rotatingTextElement; var rotatingText = new Array(); var ctr = 0; function initRotateText() { rotatingTextElement = document.getElementById("textToChange"); rotatingText[0] = rotatingTextElement.innerHTML; rotatingText[1] = "why won't you work!?!?!?"; rotatingText[2] = "purdy please"; setInterval(rotateText, 5000); } function rotateText() { ctr++; if(ctr >= rotatingText.length) { ctr = 0; } rotatingTextElement.innerHTML = rotatingText[ctr]; } window.onload = initRotateText; </script> </head> <body> <span id="textToChange">log into your <a href="http://www.hotmail.com/">please</a> policy.</a> | can you <a href="http://www.google.com"> me?</a> </span> </body> </html> I am looking for an input text that links to a iframe. . ? To begin, we need some simple HTML elements: A basic form; An Input text that will contain the URLs we want to use; An iFrame that will display the page we select from the input text. Thanks in advance Stickers Is it possible to dynamically change the value of text on a page as the user types into a text box? E.g. like: You Are Typing: <script> var keyword = document.getElementById('string'); document.write(keyword); </script> Or I could probably insert it into a function and loop it over and over again or is there a better way? I work at a college radio station and our brand new website just went live, but we're having one particular issue... We have a set list of shows that air each day, and on the site we have a marquee tag on the homepage that scrolls through showing each show and its broadcast time. Right now we're stuck changing this schedule each day by hand, but it's tough considering we're all college students ourselves and sometimes our own schedules simply don't allow the time. Is there a code that would allow this kind of a daily update to happen automatically? The format for the schedule is such: 4 - 5 pm // "Show 01" 5 - 6 pm // "Show 02" 6 - 8 pm // "Show 03" 8 - 10 pm // "Show 04" 10 - 12 am // "Show 05" Any help would be very much appreciated! So I need some help with figuring out how to reset both my text boxes when I click a different radio button so that I can give another value in the textbox area. I am trying to do it without a reset button. Any helpful ideas? I am just confused with the process of resetting the values of both the text boxes in the code.Hmmm......lol I feel like the answer is to put it inline in the <input> tag... Code: <body> <div id="content"> <h1>Convert temperature</h1> <input type="radio" name="conversion_type" id="to_celcius" onclick="document.getElementById('degrees_celcius').disabled=this.checked;" />From Fahrenheit to Celcius<br /> <input type="radio" name="conversion_type" id="to_fahrenheit" onclick="document.getElementById('degrees_fahrenheit').disabled=this.checked;" />From Celcius to Fahrenheit<br /> <br /> <label>Degrees Fahrenheit:</label> <input type="text" id="degrees_fahrenheit" class="disabled" /><br /> <label>Degrees Celcius:</label> <input type="text" id="degrees_celcius" class="disabled"/><br /> <br /> <input type="button" id="convert" value="Convert" /><br /> <br /> </div> </body> Yeah that was a loooong title. Hopefully it's clear enough Right now, my div changes opacity if it's moused over qua the following code: Code: style="opacity:0.3;filter:alpha(opacity=30)" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.3;this.filters.alpha.opacity=30 but this isn't quite optimal, cause if the user mouses out, it changes back to fade, and the user can't quite see what he's entering. So I would like the div to have opacity=1 when one of the textfields in it is active and opacity=0 when it's not. Is there a way to do that? //deafdigit Hello all. I have started working on my companies website, http://www.janwyck.net Within it is an order form for ordering paint sundries from a shopping cart using javascript and cookies. After the customer selects a few items and fills out the form if they hit Submit, it brings up a pop-up that says First False. The only way I know to show you guys is to show the page code, I am sorry: Code: <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <meta name="GENERATOR" content="Microsoft FrontPage 2.0"> <title>Janwyck Decorating Center</title> </head> <script language="javascript"> index = 0; function format(val, post) { var decpoint; var begin; var end; var valstr; var temp_char; valstr = "" + val; //alert('valstr = ' + valstr); decpoint = valstr.indexOf(".") if (decpoint != -1) { //alert('decpoint = ' + decpoint); begin = valstr.substring(0,decpoint); end = valstr.substring(decpoint+1,valstr.length); //alert('begin = ' + begin + '\nend= ' + end); } else { begin = valstr; end = ""; } if (end.length < post) {while (end.length < post) { end += "0"; } } end = end.substring(0,post); //alert('begin = ' + begin + '\nend= ' + end); return (begin+"."+end); } function orderSubmit(type) { if (type == 'order') {if ( ! ( (document.order.order_type.checked) || checkRequired() )) { // checkCardNumber(); ENTRY HERE alert('first true'); document.order.form_action.value = type; document.order.submit(); return true; } else { alert('first false'); return false; } } } var infowin = null; function copyToShipping() { if (document.order.same_flag.checked) { document.order.ship_name.value = document.order.name_first.value+' '+document.order.name_last.value; document.order.ship_address1.value = document.order.address1.value; document.order.ship_address2.value = document.order.address2.value; document.order.ship_city.value = document.order.city.value; document.order.ship_state.value = document.order.state.value; document.order.ship_zip.value = document.order.zip.value; document.order.ship_country.value = document.order.country.value; document.order.ship_phone.value = document.order.phone.value; } } function disableSameFlag() { document.order.same_flag.checked = false; } function checkRequired() { if (!document.order.name_first.value.length || !document.order.name_last.value.length || !document.order.email.value.length || !document.order.address1.value.length || !document.order.city.value.length || !document.order.state.value.length || !document.order.zip.value.length || !document.order.country.value.length) { alert('You have not completed all required fields:\n' + 'Please complete the Name, Address, City,\n' + 'County, Post Code, and Country in the\n' + 'Customer Info section'); return true; } else { return false; } } <!-- --> </script><!-- --><a name="top"></a> <body background="images/thisback.gif" bgcolor="#FFFFFF" text="#000000" onLoad=parent.refresh_ship_details(parent.ship_details) onUnload=parent.add_ship_details(parent.ship_details)> <center> <script language="javascript"> <!-- hide if (self==parent){document.write('<font color=#ff000><b>This is a frame element, click <a href=index.htm> here </a>for correct page</b></font>')}; <!-- end hide --> </script> <p><font color="#FF0000" size="7"><i>Janwyck Order Form</i><br> </font></p> <table border="0" width=400> <tr> <td align="center" bgcolor="#FF0000"><font color="#FFFFFF"><b>Please wait while the scripted order form is generated....... </b></font> </td> </tr> </table> <p><font size="6">Order Form</font> <br> <!-- HEY!!! PUT YOUR EMAIL ADDRESS IN THE LINK BELOW SO THEY CAN WRITE TO YOU --> <b>In the event of difficulty with this script please email us direct on <a href=mailto:janwyckpaint@gmail.com>Janwyck Paint</a> or call us on (706)865-2811</b> </p> <!-- YOU CAN PUT YOUR EMAIL ADDRESS IN THE FORM COMMAND BELOW AND THE --> <!-- THEN IT WILL BE SENT TO YOU AS A SIMPLE MAILTO GUESTBOOK FORM --> <!-- IF YOU DO THAT - BE SURE TO ADD THE COMMAND enctype="plain/text" --> <!-- IN ORDER TO DELINEATE THE MAIL FOR YOU --> <!-- YOU CAN ALSO USE TE .PL FILE AS A CGI TO HELP WTH THE MAIL. SEE THE TUTORIAL --> <!-- FOR MORE ON HOW THAT IS DONE --> <form action="MAILTO:janwyckpaint@gmail.com" method="POST" name="order" enctype="plain/text"> <input type="hidden" name="Order Form" value="Order Forms - Order Form"><input type="hidden" name="recipient" value="janwyckpaint@gmail.com"><input type="hidden" name="redirect" value="thanku.htm"><input type="hidden" name="retailer" value="Janwyck Decorating Center"><input type="hidden" name="form_action" value="order"> <script language="javascript"> <!-- hide from Browsers document.write('<table width=400><td align=center>'); document.write('<table width=400 ><tr><tr><td align=right colspan=3 BGCOLOR=#FF9999><font size=+2>Running Total : $ </td><td colspan=3 BGCOLOR=FF9999> <input type=text name=total size=6 value='+ format(parent.all_order_totals(),2) + '></font></td><tr>'); document.write('<td colspan=6 align=center><b>This is your Order Total so far<br>.</td></tr><tr></table>'); if (parent.items_ordered == 0) document.write('<font color=#000080><b>You have not ordered any items so far<b></font>'); if (parent.item_num > 0) { for (i =1;i < parent.item_num;i++) { if (parent.itemlist[i].quan > 0) {index = index + 1; document.write('<a href='+ parent.itemlist[i].url + '><i><b> review : </b></i></a><input size=10 type=text name= ' + parent.itemlist[i].code + ' value= ' + parent.itemlist[i].code + '><input size=6 type=text name= ' + parent.itemlist[i].code + ' value=' + parent.itemlist[i].price + '><input size=20 type=text name= ' + parent.itemlist[i].code + ' value= '+ parent.itemlist[i].desc + '><input size=2 type=text name= ' + parent.itemlist[i].desc + ' value= '+ parent.itemlist[i].quan + '><br>'); } } } <!-- end hiding --> </script> <table border="0" width=400> <tr> <td align="center" colspan="6" bgcolor="#FF9999"><b>Comments & Additional Information <br><font color=#ffff00>Can be written in the box below</font><br> </b></td> </tr> <tr> <td colspan="6"><center><textarea name="comments" rows="10" cols="40"></textarea></center></td> </tr> </table> <!-- Customer Info Table --> <table border="0" cellpadding="0" cellspacing="0" bgcolor="#00FFFF" width=400> <tr> <td align="center" colspan="5" bgcolor="#CCFFFF"><b>Customer Information / Details</b></td> </tr> <tr> <td align="right" colspan="2" bgcolor="#CCFFFF"><b>First Name: </b></td> <td colspan="3" bgcolor="#CCFFFF"><input type="text" size="30" maxlength="30" name="name_first"></td> </tr> <tr> <td align="right" colspan="2" bgcolor="#CCFFFF"><b>Last Name:</b> </td> <td colspan="3" bgcolor="#CCFFFF"><input type="text" size="30" maxlength="30" name="name_last"></td> </tr> <tr> <td align="right" colspan="2" bgcolor="#CCFFFF"><b>Email Address:</b> </td> <td colspan="3" bgcolor="#CCFFFF"><input type="text" size="30" maxlength="60" name="email"></td> </tr> <tr> <td align="right" colspan="2" bgcolor="#CCFFFF"><b>Address:</b> </td> <td colspan="3" bgcolor="#CCFFFF"><input type="text" size="30" maxlength="60" name="address1"></td> </tr> <tr> <td align="right" colspan="2" bgcolor="#CCFFFF"> </td> <td colspan="3" bgcolor="#CCFFFF"><input type="text" size="30" maxlength="60" name="address2"></td> </tr> <tr> <td align="right" colspan="2" bgcolor="#CCFFFF"><b>City:</b> </td> <td colspan="3" bgcolor="#CCFFFF"><input type="text" size="30" maxlength="30" name="city"></td> </tr> <tr> <td align="right" colspan="2" bgcolor="#CCFFFF"><b>County:</b> </td> <td bgcolor="#CCFFFF"><input type="text" size="8" maxlength="10" name="state"></td> <td align="right" bgcolor="#CCFFFF"><b>Post Code:</b> </td> <td bgcolor="#CCFFFF"><input type="text" size="9" maxlength="10" name="zip"></td> </tr> <tr> <td align="right" colspan="2" bgcolor="#CCFFFF"><b>Country:</b> </td> <td colspan="3" bgcolor="#CCFFFF"><input type="text" size="25" maxlength="25" name="country" value="UK"></td> </tr> <tr> <td align="right" colspan="2" bgcolor="#CCFFFF"><b>Phone:</b> </td> <td colspan="3" bgcolor="#CCFFFF"><input type="text" size="25" maxlength="25" name="phone"></td> </tr> <tr> <td align="right" colspan="2" bgcolor="#CCFFFF"><b>Fax:</b> </td> <td colspan="3" bgcolor="#CCFFFF"><input type="text" size="25" maxlength="25" name="fax"></td> </tr> <tr> <td align="center" colspan="5" bgcolor="#CCFFFF"><input type="checkbox" name="mail_list">Check here to be included on our mailing list </td> </tr> </table> <p align="center"><br> <p align="center"><br> <!-- Order Method Table --> </p> <table border="0" cellspacing="0" width=400> <tr> <td align="center" colspan="5" bgcolor="#CCFFFF"><font size="4"><b>Choose Order Method:</b></font></td> </tr> <tr> <td align="center" colspan="5" bgcolor="#CCFFFF"> <font size="2">Phone Call: <input type="radio" name="order_type" value="phone"></font> </td> </tr> <tr> <td align="center" colspan="5" bgcolor="#CCFFFF"><a href="options.htm" target=navigate> </td> </tr> </table> <p><br> <p><br> <p align="center"><br> <input type="button" value="Place Order" onclick="orderSubmit('order')"> <input type="reset" value="Reset Address Details"> </p> </form> </td></table> </center> </p> </body > </html> I hate posting that much code. I think though that it might be related to: Code: function orderSubmit(type) { if (type == 'order') {if ( ! ( (document.order.order_type.checked) || checkRequired() )) { // checkCardNumber(); ENTRY HERE alert('first true'); document.order.form_action.value = type; document.order.submit(); return true; } else { alert('first false'); return false; } } } But I am not quiet sure. ANy help I may get is greatly appreciated as the site is very close to going live and this is my BIG problem. Does anyone know why I am not getting an alert on an empty form INPUT value? Code: if (document.forms["form"]["targetname"].value == "" && document.forms["form"]["unknownname"] == false) { alert ("What ever"); return false; } document.forms["form"]["targetname"] is a form INPUT text document.forms["form"]["unknownname"] is a form INPUT checkbox I suspect the problem is due to 'false'.. but I can't figure out why. |