JavaScript - Need Assistance In Selection Box
i have a selection menu here. what i would like to do is that when i select "not copy" it will not show and not copy the contents of "todo" textfield. but when i select any of the "copy text" it will show and copy the contents of the "todo" text. help plsssssssssssssssssss
<!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=utf-8" /> <title>Untitled Document</title> </head> <body> <form id="form" name="form" method="post" action=""> <p>Phone Number: <input type="text" name="Name" /> </p> <p>Location: <select name="selector" > <option>copy text</option> <option>not copy text</option> <option>copy text</option> <option>copy text</option> </select> </p> <p>To Do Today: <input type="text" name="todo" /> </p> <p> <input type="button" value="Copy" /> </p> </form> </body> </html> Similar TutorialsI've been wanting to create a sort of user controlled cms... Something that a user controls no matter if there logged in or not, Something that works on flatfile no PHP no server side scripting. Just browser scripting. I was wondering if this was even possible to do, or if it's been done before. Thanks in advance.
JS beginner here; Ok, I'm trying to manipulate the functions of Codaslider for a layout. What I need is the ability to use an image for slide dynamic slide navigation. I've solved the issue for dynamic hashing, however I'm stuck at modifying the HTML. I've tried a few things but I figure this is the easiest way... This is what I've got so far; function navigate () { var url = document.getElementById('back'); url.href = page_back(); return url; } function page_back(inward) { new Object(inward.location.hash); var rehash = inward.location.hash.match(/[^#]/); if (rehash == 1) { rehash = 5; } else if(rehash == 2) { rehash = 1; } else if(rehash == 3) { rehash = 2; } else if(rehash == 4) { rehash = 3; } else if(rehash == 5) { rehash = 4; } else if(rehash == null) { rehash = 5; } else{rehash = "Invalid URL or REFERRER"} inward.location.hash = rehash; return inward.location.href; }; Implemented here; <a href="#5" id="back" class="cross-link"> <input type="image" class="left_arrow" src= "images/leftarrow.png" onclick="navigate()" /></a> What I expect this to do is change the href value to "#1" so that Codaslider will do it's thing while I provide a stationary dynamic image for slide browsing. Anyone have any idea what i'm doing wrong? page_back works fine but navigate seems to be useless. http://jsfiddle.net/Wsekx/ Populate the following array with string data instead of numeric data, and then test it with these states as data: "Georgia", "Colorado". "Iowa", "Florida", "Kentucky", and "Arizona." How exactly do I do this? So confused after reading this So I have the jcarousel with pagination working fine. So Im happy with all of the behavior that is going on right now, it is great. My issue is I would liek to have the pagination numbers still change the class on the slide changes, But my one thing is, I want to make the pagination numbers NOT links. So they keep the same hover states and the color changes on slide change, but only the slide carousel arrows can change the slides, and the pagination is only for notification purposes. not links or able to change slides. Can this be done? my code is here http://www.cesariomendoza.com/jcarousel/
I am needing to use javascript to show a prompt, and when the user enters a number from 1-12 (1 for each month of the year) it adds it to a new array. Then when the user types "stop" it prints the corresponding months. I'm new to javascript so I am not quite sure how to go about doing it. This is what I have currently, but I don't think it is right. Code: <script type="text/javascript"> var month=['', 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']; var selmonth= new Array(); var month2=prompt('Which Month', ''); if (month2==1){ selmonth[0] = month[1]; var month2=prompt('Which Month', ''); } if (month2==2){ selmonth[1] = month[2]; var month2=prompt('Which Month', ''); } if (month2==3){ selmonth[2] = month[3]; var month2=prompt('Which Month', ''); } if (month2==4){ selmonth[3] = month[4]; var month2=prompt('Which Month', ''); } if (month2==5){ selmonth[4] = month[5]; var month2=prompt('Which Month', ''); } if (month2==6){ selmonth[5] = month[6]; var month2=prompt('Which Month', ''); } if (month2==7){ selmonth[6] = month[7]; var month2=prompt('Which Month', ''); } if (month2==8){ selmonth[7] = month[8]; var month2=prompt('Which Month', ''); } if (month2==9){ selmonth[8] = month[9]; var month2=prompt('Which Month', ''); } if (month2==10){ selmonth[9] = month[10]; var month2=prompt('Which Month', ''); } if (month2==11){ selmonth[10] = month[11]; var month2=prompt('Which Month', ''); } if (month2==12){ selmonth[11] = month[12]; var month2=prompt('Which Month', ''); } if (month2=='stop'){ document.write(selmonth.join(" <br> ")); } else{ alert('Please enter a valid value'); } </script> It'd be great if someone is able to help me. Thanks. I wish to create an applett, which i am working on, Though I want to know if there is any way to: 1) Take screenshots of entire web page 2) Take screenshots of a certian part of the web page selected by the user with a Rectangle tool 3) Take screenshots of a certian part of the web page selected by the user with a FreeForm tool Im not asking for a full code or anything, But I just wish to know in what way could i go about this? Hi Guys, I would like to add a confirmation to this: PHP Code: echo "<a href=\"delete.php?dir=$dir&file=$file\" onclick='return del(this, \"$id\")'><img src=\"images/delete.gif\" border=\"0\" /></a>"; However I seem to be struggling, severely! Any help would be greatly appreciated, especially if spelt out if alphabetti spaghetti. Kind Regards, Drew Hello, I have a form that calculates a dollar amount based on the percentage entered by the user. Now the client wants the form to also calculate the percentage if the user enters a dollar amount. I am new to this so I am having trouble figuring out how to format the if statement. Here is the code that performs the calculations: Code: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $(".TextBox").hover(function(){ $(this).toggleClass('TextBoxSelected'); },function(){ $(this).toggleClass('TextBoxSelected'); }).change(function(){ calculate(); }); }); function getFldValue(fldValue) { return isNaN(fldValue) ? 0 : parseFloat(fldValue); } function calculate() { var property_SPrice = getFldValue($('#property_SPrice').val()); var price = getFldValue($('#price').val()); var REO_sale_percentage = getFldValue($('#REO_sale_percentage').val()); var REO_sale_dollars = getFldValue($('#REO_sale_dollars').val()); var REO_sale_bonus_dollars = getFldValue($('#REO_sale_bonus_dollars').val()); var REO_sale_fixed_dollars = getFldValue($('#REO_sale_fixed_dollars').val()); var REO_sale_total_dollars = getFldValue($('#REO_sale_total_dollars').val()); var REO_list_percentage = getFldValue($('#REO_list_percentage').val()); var REO_list_dollars = getFldValue($('#REO_list_dollars').val()); var REO_list_bonus_dollars = getFldValue($('#REO_list_bonus_dollars').val()); var REO_list_fixed_dollars = getFldValue($('#REO_list_fixed_dollars').val()); var REO_list_total_dollars = getFldValue($('#REO_list_total_dollars').val()); var gr_comm_percentage = getFldValue($('#gr_comm_percentage').val()); var gr_comm_dollars = getFldValue($('#gr_comm_dollars').val()); var gr_bonus_dollars = getFldValue($('#gr_bonus_dollars').val()); var gr_fixed_dollars = getFldValue($('#gr_fixed_dollars').val()); var gr_total_dollars = getFldValue($('#gr_total_dollars').val()); $('#price').val(property_SPrice); $('#gr_comm_percentage').val(REO_list_percentage + REO_sale_percentage); $('#gr_comm_dollars').val(getFldValue(REO_list_dollars + REO_sale_dollars)); $('#REO_list_dollars').val(getFldValue(REO_list_percentage/100*price)); $('#REO_sale_dollars').val(getFldValue(REO_sale_percentage/100*price)); $('#gr_fixed_dollars').val(getFldValue(REO_list_fixed_dollars + REO_sale_fixed_dollars)); $('#gr_bonus_dollars').val(getFldValue(REO_list_bonus_dollars + REO_sale_bonus_dollars)); $('#gr_total_dollars').val(getFldValue(REO_sale_total_dollars + REO_list_total_dollars)); $('#REO_sale_total_dollars').val(getFldValue(REO_sale_dollars + REO_sale_fixed_dollars + REO_sale_bonus_dollars)); $('#REO_list_total_dollars').val(getFldValue(REO_list_dollars + REO_list_fixed_dollars + REO_list_bonus_dollars)); } </script> I now need to add: Code: $('#REO_list_percentage').val(getFldValue(REO_list_dollars/price*100)); $('#REO_sale_percentage').val(getFldValue(REO_sale_dollars/price*100)); So that if the user enters a dollar amount, the form can calculate the percentage along with all of the other calculations above. How would I write that? Thanks. Evening all, I am by no means a JS programmer, but I like to exhaust all avenues when attacking an issue. A signature fired off on a piece of javascript that came across the wire, with an odd "var unescape" inside of it. I am hoping to throw this code out there, to see if anyone has any insight on what this might be. I am assuming this is double encoded, but I am not certain. Here is the snippet of code the signature fired off from: var ibdf=unescape("%u0b0b%u0b0"+"b"); var fdofdopf="xcvb9090"; Thanks in advance for anyone willing to assist with this. Cheers, Anon I have the following regex pattern: var patt=/(&(?=(amp|apos|gt|lt|quot)|[^&])+/; It's validation to ensure that any ampersand sign is followed by amp;, apos;, gt;, lt;, or qout;. It should validate any other character except the aforementioned ampersand case. The regex checks out ok on all online regex testers. however, when i apply it to javascript via the test() method, things that return a fail in the testers return true with the js test() method, so the validation isn't working for me right now in javascript. e.g. var testStr = 'someString&'; //should fail var testStr2 = 'someString&'; //should pass however, calling patt.test(testStr); returns true when it should be returning false... Thanks for any input and help you all have to offer. I've been beating this to death for about 3 hours and I'm a little stuck on it.. hi i am new to programming and script writing i would like to ask if anyone on here wouldn't mind taking a couple min out of there day to help me out with a few things I am really stuck right now on just getting started with what i need to START i know that that is probably a pretty big question so i will start out small and just ask what are some of the basic essentialls that i will need to get started. Wile telling me how to get started if you wouldn't mind just giving me a short description of the proper use of thing and just what i should look for if i am doing things properly or incorrect like i said before i am only just starting out and i would like to start small and just more or less get the ball rolling. I work with computers most of the day and hooking up internet and would like to further my knowledge with the future (computers). i am a part of lots of forums mainly pertaining to jeeps and we are always trying to help the little guys out in getting bigger and more knowledgeable about what they are getting into and i am hopping that it is the same way here and in this area or expertise thanks again i look forward to starting out Hello everyone. First, if you do not understand something I have tried to explain, PLEASE ask, don't just skip the question! Thank you! I will start by explaining what I am doing and why I am running into a problem. Perhaps one of you kind people can help me figure out how to fix it. I have a grid set up for logic puzzle solving. The grid is made up of 3 rows of primary squares, each containing 16 sub-squares. The top row has 3 primary squares. the 2nd row has 2 primary squares. the 3rd row has 1 primary square. That gives a total of 96 sub-square, or grid coordinates. Each sub square has an image in it that can be altered by clicking the square. The image begins as a blank gif. With the first click, it becomes an X, with a second click, it becomes an O, and the third click returns it to blank. With me so far? Hope so! Now for the tricky part. The grid is made up using a table, with each TD having it's own identifier, as in: Code: a1b1 a1b2 a1b3 a1b4 | a1c1 a1c2 a1c3 a1c4 | a1d1 a1d2 a1d3 a1d4 a2b1 a2b2 a2b3 a2b4 | a2c1 a2c2 a2c3 a2c4 | a2d1 a2d2 a2d3 a2d4 a3b1 a3b2 a3b3 a3b4 | a3c1 a3c2 a3c3 a3c4 | a3d1 a3d2 a3d3 a3d4 a4b1 a4b2 a4b3 a4b4 | a4c1 a4c2 a4c3 a4c4 | a4d1 a4d2 a4d3 a4d4 ----------------------------------------- d1b1 d1b2 d1b3 d1b4 | d1c1 d1c2 d1c3 d1c4 d2b1 d2b2 d2b3 d2b4 | d2c1 d2c2 d2c3 d2c4 d3b1 d3b2 d3b3 d3b4 | d3c1 d3c2 d3c3 d3c4 d4b1 d4b2 d4b3 d4b4 | d4c1 d4c2 d4c3 d4c4 ----------------------------------------- c1b1 c1b2 c1b3 c1b4 c2b1 c2b2 c2b3 c2b4 c3b1 c3b2 c3b3 c3b4 c4b1 c4b2 c4b3 c4b4 Each sub-square also contains the image that is changed, and the image has it's own unique identifier, to go alone with the grid: Code: 1-0-0 | 1-0-1 | 1-0-2 | 1-0-3 | 1-1-0 |1-1-1 | 1-1-2 | 1-1-3 | 1-2-0 | 1-2-1 | 1-2-2 | 1-2-3 | ---------------------------------------------------------------------------------------------- 2-0-0 | 2-0-1 | 2-0-2 | 2-0-3 | 2-1-0 | 2-1-1 | 2-1-2 | 2-1-3 | 2-2-0 | 2-2-1 | 2-2-2 | 2-2-3 | ---------------------------------------------------------------------------------------------- 3-0-0 | 3-0-1 | 3-0-2 | 3-0-3 | 3-1-0 | 3-1-1 | 3-1-2 | 3-1-3 | 3-2-0 | 3-2-1 | 3-2-2 | 3-2-3 | ---------------------------------------------------------------------------------------------- 4-0-0 | 4-0-1 | 4-0-2 | 4-0-3 | 4-1-0 | 4-1-1 | 4-1-2 | 4-1-3 | 4-2-0 | 4-2-1 | 4-2-2 | 4-2-3 | ------------------------------------------------------------- 5-0-0 | 5-0-1 | 5-0-2 | 5-0-3 | 5-1-0 | 5-1-1 | 5-1-2 | 5-1-3 | ------------------------------------------------------------- 6-0-0 | 6-0-1 | 6-0-2 | 6-0-3 | 6-1-0 | 6-1-1 | 6-1-2 | 6-1-3 | ------------------------------------------------------------- 7-0-0 | 7-0-1 | 7-0-2 | 7-0-3 | 7-1-0 | 7-1-1 | 7-1-2 | 7-1-3 | ------------------------------------------------------------- 8-0-0 | 8-0-1 | 8-0-2 | 8-0-3 | 8-1-0 | 8-1-1 | 8-1-2 | 8-1-3 | ------------------------------ 9-0-0 | 9-0-1 | 9-0-2 | 9-0-3 | ------------------------------ 10-0-0 | 10-0-1 | 10-0-2 | 10-0-3 | ---------------------------------- 11-0-0 | 11-0-1 | 11-0-2 | 11-0-3 | ---------------------------------- 12-0-0 | 12-0-1 | 12-0-2 | 12-0-3 | Here is a sample of a TD including the image and other ID's: Code: <TD style=" border-bottom: 3px solid black;" class="gridoff" onMouseOver="className='gridon';" onMouseOut="className='gridoff';" id="gridtdD4C2"> <DIV align="center"> <IMG src="/testproject/n.gif" height="20" width="20" id="8-1-1" name="D4C2" onClick="flipBox(this);" class="gridbox"> </DIV> </TD> As you can see, the image ID is 8-1-1, which if you compare the two tables, is equal to D4C2. So far, everything is working perfect, as long as I have a grid that is 3x3x4, or, 3 squares across the top, 2 squares in the middles, and 1 square on the bottom, with 16 sub-squares in each. Now, the problem is, I do not always need a 3x3x4, sometimes I will need a 3x3x5, or a 4x4x4, or a 4x4x5 grid. I have made all the grids, and given them all the right ID's for both the TD, the IMG, as well as the <input> tags. When I test out a 3x3x5 grid, the first 4 columns in each square work fine, the 5th will only change to an X once, and cannot be changed again. Similarly, the first 4 rows in each square work, but not the 5th, with the same problem. Again, I have made sure that each of my ID's are correct, so that isn't the issue. The only thing I can figure it would be is the javascript. So, here it is, the script that does all the changes: Code: <SCRIPT LANGUAGE="JavaScript"> function checkDoubles(val) { // A4C5 = check A4C1, A4C2, A4C3, A4C4, A1C5, A2C5, A3C5, A5C5 var part1 = val.substr(0,1); var part2 = val.substr(1,1); var part3 = val.substr(2,1); var part4 = val.substr(3,1); var part12 = val.substr(0,2); var part34 = val.substr(2,2); var isdouble = "false"; // check A4C* for(i=1;i<5;i++) { var checkthisbox = part12 + part3 + i; if(checkthisbox!=val) { if(document.getElementById(checkthisbox).value==3) { alert("You can not set more than one box in any row to true at the same time! If you wish to set this box to true you must first remove the other true statement in this row."); var isdouble = "true"; } } } // check A*C5 for(i=1;i<5;i++) { var checkthisbox = part1 + i + part34; if(checkthisbox!=val) { if(document.getElementById(checkthisbox).value==3) { alert("You can not set more than one box in any column to true at the same time! If you wish to set this box to true you must first remove the other true statement in this column."); var isdouble = "true"; } } } return isdouble; } function flipBox(img) { var tmpname; if(img.src=="http://localhost/testproject/n.gif") { img.src = "http://localhost/testproject/x.gif"; tmpname = img.name; document.mainform.elements[tmpname].value = 1; document.getElementById(img.name).value = 1; } else if(img.src=="http://localhost/testproject/x.gif") { var finaltest = checkDoubles(img.name); if(finaltest=="false") { img.src = "http://localhost/testproject/o.gif"; tmpname = img.name; document.mainform.elements[tmpname].value = 3; document.getElementById(img.name).value = 3; } else { img.src = "http://localhost/testproject/n.gif"; } } else if(img.src=="http://localhost/testproject/o.gif") { img.src = "http://localhost/testproject/n.gif"; tmpname = img.name; document.mainform.elements[tmpname].value = 0; document.getElementById(img.name).value = 0; } showVals(); } </SCRIPT> I know nothing about javascript, so I have no idea why the grid is not working as it should. For some reason, 1-0-0 through 1-0-3 (A1B1 to A1B4) work, but 1-0-4 (A1B5) nor 5-0-4 (which would be A5B5 grid coord). It makes no sense to me. If you could please look over the script and tell me if you can see why it's letting the original part of the grid to work, but not the additional parts I add? Thank you! Greetings, First off - You can see my problem at psychopathgames.com I have an image stretched to fit as the page background in a DIV and the page content inside a seperate DIV. When you mouseover the links, the background changes to represent each link (as does the color of the link... but that is working fine). Trouble is, the images that are being pulled aren't fullsized as the main background is... it is being cut off by some code I can't figure out and isn't resizing. Please visit the site to see what talking about. Here is the code... Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Psychopath Games</title> <style type="text/css"> html, body {height:100%; margin:0; padding:0;} #page-background {position:fixed; top:0; left:0; width:100%; height:100%;} #content {position: relative; z-index:1; padding:10px;} </style> <!--[if IE 6]> <style type="text/css"> html {overflow-y:hidden;} body {overflow-y:auto;} #page-background {position:absolute; z-index:-1;} #content {position:static;padding:10px;} </style> <![endif]--> <style type="text/css"> A:link {text-decoration: none} A:visited {text-decoration: none} A:active {text-decoration: none} A:hover {text-decoration: none} </style> <script language="JavaScript"> <!-- img0_on = new Image(100,11); img0_on.src="images/titlesred.png"; img0_off = new Image(100,11); img0_off.src="images/titles.png"; img1_on = new Image(130,11); img1_on.src="images/contactred.png"; img1_off = new Image(130,11); img1_off.src="images/contact.png"; img2_on = new Image(170,11); img2_on.src="images/talentred.png"; img2_off = new Image(170,11); img2_off.src="images/talent.png"; function over_image(parm_name) { document[parm_name].src = eval(parm_name + "_on.src"); } function off_image(parm_name) { document[parm_name].src = eval(parm_name + "_off.src"); } --> </script> <script type="text/javascript"> function showIt1(imgsrc) { newImage = "url(images/backgroundone.jpg)"; document.getElementById('content').style.backgroundImage = newImage; } function showIt2(imgsrc) { newImage = "url(images/backgroundtwo.jpg)"; document.getElementById('content').style.backgroundImage = newImage; } function showIt3(imgsrc) { newImage = "url(images/backgroundthree.jpg)"; document.getElementById('content').style.backgroundImage = newImage; } function hideIt() { newImage = "url(images/background.jpg)"; document.getElementById('content').style.backgroundImage = newImage; } </script> </head> <body> <div id="page-background"> <img src="images/background.jpg" width="100%" height="100%"> </div> <div id="content"> <center> <img src="images/title.png"> <br><br> <br> <table width="100%"> <tr> <td width="40%" align="right" valign="bottom"> <a href="titles.html" onmouseover="over_image('img0'); showIt1(this.src);" onmouseout="off_image('img0'); hideIt();"> <img src="images/titles.png" border="0" name="img0"> </a> <br> <br> <a href="contact.html" onmouseover="over_image('img1'); showIt2(this.src);" onmouseout="off_image('img1'); hideIt();"> <img src="images/contact.png" border="0" name="img1"> </a> <br> <br> <a href="talent.html" onmouseover="over_image('img2'); showIt3(this.src);" onmouseout="off_image('img2'); hideIt();"> <img src="images/talent.png" border="0" name="img2"> </a> <br> <br> </td> <td width="60%"> <center> <img src="images/eye.png"> </td> <tr> </table> </div> </body> </html> I am using the Mega Menu from http://www.javascriptkit.com/script/...megamenu.shtml and need some assistance with an adjustment. The menu is working great as provided. However, we have a fairly wide menu layout and I have received comments that it is visually distracting to have the menu fly out horizontally. We want to have the menu start out full width and only animate to drop down vertically. Is this possible? If so, where in jkmegamenu.js would I make this adjustment? Thank you. Paul I would like to create a script that allows for a user to input two integers and to have the script show all the prime numbers that fall between them. Any thoughts? Thanks I've been working on this for a few days now and I'm not sure if it could be done or not. I'm trying to do the following complex formula in Adobe Acrobat. I want to be able to calculate tInterest (Total Interest Due) = fDays (# of days) * .0002739726 (interest rate) * PrincipalAmt (principal) but ONLY IF fDays > 90 or if CheckBox1 is checked then fDays > 180, otherwise tInterest = 0. See, I'm trying to create a form where the interest is only to be calculated if 90 days has elapsed OR 180 days has elapsed if checked off.Either way, interest is to be calculated from StartDate. Is this possible? Okay so as you could tell by the unfamiliar name, I am a newbie. I have completed the codeacedmy Javascript course and while I know it's not the best for actually getting GOOD at at, it's still taught me a bit. I'm, working with a buddy of mine who is urging me to begin working on something ASAP so that we can start a project together. I suggest making a short RPG, but I'm unsure how I can begin with something like that and what I would need to work on. Or if you have any other projects you can suggest as a good first project to get my feet wet I would be extremely grateful for the help. Thanks in advance!
Hi, I am constructing a website with a page that holds a world clock. The clock displays in the centre of the page and is surrounded by 12 buttons (Individual World Cities). OnClick of these buttons changes the time displayed. I am trying to amend the code so that when one of these buttons is clicked. It not only updates and changes the clock. But also adds text below the clock that says something like "The time in New York is now displayed). I have been trying to find the code to do this for a few hours and the closest I could find was an addtext function. No matter what I do though I just cant get it to work! If anyone could help that would be appreciated. I have pasted the Script for the clock below (This code is before I edited it with the addText code). <script> var GMToffset = 0,t; function start() { GMToffset=zxcReadCookie('time')||0; t=setInterval('digitalclock()',500); } function digitalclock() { var today=new Date(); var hours=(today.getHours() + GMToffset*1+24)%24; var minutes=today.getMinutes(); var seconds=today.getSeconds(); minutes=checkTime(minutes); seconds=checkTime(seconds); hours=checkTime(hours); document.getElementById('txt').innerHTML=hours+":"+minutes+":"+seconds; } function checkTime(i) { if (i<10) { i="0" + i; } return i; } function updatetime(nu) { GMToffset = nu; zxcCreateCookie('time',nu,1); // change 1 to the number of days persistance required } function zxcCreateCookie(nme,v,days){ document.cookie=nme+'='+v+';expires='+(new Date(new Date().getTime()+days*86400000).toGMTString())+';path=/'; } function zxcReadCookie(nme){ nme+='='; var split = document.cookie.split(';'); for(var z0=0;z0<split.length;z0++){ var s=split[z0]; while (s.charAt(0)==' ') s=s.substring(1,s.length); if (s.indexOf(nme)==0) return s.substring(nme.length,s.length); } return null; } </script> </head> <body onload="start()"> <div align="center"> <input type="button" onclick="updatetime(-4)" value="Time in Buenos Aires" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /> <input type="button" onclick="updatetime(-5)" value="Time in New York" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /> <input type="button" onclick="updatetime(-8)" value="Time in San Francisco" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /><br> <input type="button" onclick="updatetime(-11)" value="Time in Hawaii" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /> <input type="button" onclick="updatetime(-13)" value="Time in Fiji" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /> <input type="button" onclick="updatetime(-14)" value="Time in Sydney" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /><br><br> <div id="txt"></div> </div> <div align="center"> <input type="button" onclick="updatetime(8)" value="Time in Tokyo" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /> <input type="button" onclick="updatetime(7)" value="Time in Hong Kong" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /> <input type="button" onclick="updatetime(6)" value="Time in Bangkok" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /><br> <input type="button" onclick="updatetime(1)" value="Time in Rome" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /> <input type="button" onclick="updatetime(0)" value="Time in London" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /> <input type="button" onclick="updatetime(3)" value="Time in Moscow" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /> </head> Hey everyone - I am having some trouble with creating cookies and getting them to work for an onclick event. What I am trying to do is create a button to store cookies containing all user information with an alert message and set the expiration date one day after the visit. (This is just a project I am working on to help me understand how to create cookies.) Below is the cookies code I came up with but it doesn't seem to be functioning at all. Any help would be greatly appreciated. Thanks Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <!-- Brooks Rogalski December 6, 2010 --> <title>ABC Outdoor Sports</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <script type = "text/javascript"> /* <![CDATA[ */ //cookie button function function cookieForm() { var equipment = document.forms[0].equipment.value; var pDate = document.forms[0].pickupDate.value; var pHour = document.forms[0].pickupHours.value; var pMin = document.forms[0].pickupMinutes.value; var rDate = document.forms[0].returnDate.value; var rHour = document.forms[0].returnHours.value; var rMin = document.forms[0].returnMinutes.value; var first = document.forms[0].firstName.value; var last = document.forms[0].lastName.value; var street = document.forms[0].street.value; var city = document.forms[0].city.value; var zip = document.forms[0].zip.value; var DoBYear = document.forms[0].date.value; var myDate = new Date(); myDate.setDay(myDate.getDay() +1) ; document.cookie = "equipment" + encodeURIComponent(equipment) + "; expires=" + mydate.toUTCString(); document.cookie = "pDate" + encodeURIComponent(pDate) + "; expires=" + mydate.toUTCString(); document.cookie = "pHour" + encodeURIComponent(pHour) + "; expires=" + mydate.toUTCString(); document.cookie = "pMin" + encodeURIComponent(pMin) + "; expires=" + mydate.toUTCString(); document.cookie = "rDate" + encodeURIComponent(rDate) + "; expires=" + mydate.toUTCString(); document.cookie = "rHour" + encodeURIComponent(rHour) + "; expires=" + mydate.toUTCString(); document.cookie = "rMin" + encodeURIComponent(rMin) + "; expires=" + mydate.toUTCString(); document.cookie = "first" + encodeURIComponent(first) + "; expires=" + mydate.toUTCString(); document.cookie = "last" + encodeURIComponent(last) + "; expires=" + mydate.toUTCString(); document.cookie = "street" + encodeURIComponent(street) + "; expires=" + mydate.toUTCString(); document.cookie = "city" + encodeURIComponent(city) + "; expires=" + mydate.toUTCString(); document.cookie = "zip" + encodeURIComponent(zip) + "; expires=" + mydate.toUTCString(); document.cookie = "DoBYear" + encodeURIComponent(DoBYear) + "; expires=" + mydate.toUTCString(); /* ]] */ </script> </head> <body onload = "rotateImage('rImage')"> <h1> ABC Outdoor Sports Equipment </h1> <img src="fishing.jpg" id="rImage" width="250" height="200" onmouseover = "pause=true;" onmouseout = "pause=false;"> <br/> <br/> <form onsubmit = "return validateForm();" action = "mailto:rogalskibf@gmail.com?subject=ABC Customer Reservation" method="post" enctype="text/plain"> <table border = "0"> <tr> <td> Equipment:<br/> <select name = "equipment"> <option value="unselected">Select Equipment Type</option> <option value = 20>Fishing Boat</option> <option value = 15>Kayak</option> <option value = 2>Mountain Bike</option> <option value = 10>Scuba Gear</option> </select> </td> </tr> <tr> <td> Pick-up Date: <br/> <input type = "text" name = "pickupDate" value = "(mm/dd/yyyy)"/> </td> <td> Pick-up Time: <br/> <select name = "pickupHours"> <option value="unselected">hr</option> <option value = 7>07</option> <option value = 8>08</option> <option value = 9>09</option> <option value = 10>10</option> <option value = 11>11</option> <option value = 12>12</option> <option value = 13>13</option> <option value = 14>14</option> <option value = 15>15</option> <option value = 16>16</option> <option value = 17>17</option> </select> <select name = "pickupMinutes"> <option value="unselected">min</option> <option value = 0>00</option> <option value = .5>30</option> </select> </td> </tr> <tr> <td> Return Date: <br/> <input type = "text" name = "returnDate" value = "(mm/dd/yyyy)"/> </td> <td> Return Time: <br/> <select name = "returnHours"> <option value="unselected">hr</option> <option value = 7>07</option> <option value = 8>08</option> <option value = 9>09</option> <option value = 10>10</option> <option value = 11>11</option> <option value = 12>12</option> <option value = 13>13</option> <option value = 14>14</option> <option value = 15>15</option> <option value = 16>16</option> <option value = 17>17</option> </select> <select name = "returnMinutes"> <option value="unselected">min</option> <option value = 0>00</option> <option value = .5>30</option> </select> </td> </tr> <tr> <td> First Name: <br/> <input type = "text" name = "firstName"/> </td> <td> Last Name: <br/> <input type = "text" name = "lastName"/> </td> </tr> <tr> <td> Street: <br/> <input type = "text" name = "street"/> </td> <td> City: <br/> <input type = "text" name = "city"/> </td> <td> Zip:<br/> <input type = "text" name = "zip" maxlength = "5"/> </td> </tr> <tr> <td> Date of Birth: <br/> <input type = "text" name = "date" value = "(mm/dd/yyyy)"/> </td> </tr> <tr> <td colspan = "3" align = "center"> <input type = "submit" name = "submit" value = "Submit Reservation"/> <input type = "button" name = "cookies" value = "Store User Information"/> </td> </tr> </table> </form> </body> </html> |