JavaScript - How To Pull Javascript Codes Automatically
I am developing a web application based on a Java servlet. The servlet outputs html and javascript codes and receives some result from a thread, which works behind the servlet.
Thus, html and javascript codes dynamically varies. While result equals null (a thread is not completed), it shows "Currently processing," and refreshes Code: <div id="load"> - </div> every second automatically. After receiving some results, it should stop automatic refreshing and show "Done." I wrote source codes described below. It shows "Done" after getting some results, but does not stop refreshing. However, when I manually refresh the page (Ctrl-R), the script is loaded and reloading is stopped. How can I pull javascript codes automatically? Code: <head> <script type=\"text/javascript\"> var auto_refresh = setInterval( function start() { $('#load').load('./Page' + ' #load'); }, 1000); </script> </head> <div id="load"> if (result == null) { // the variable result is received from a behind thread every second. // while a thread is processed <p>Currently processing. <p> } else { // a thread is completed // try to stop reloading <script type=\"text/javascript\"> clearInterval(auto_refresh); </script> <p>Done. <p> } </div> Similar TutorialsI have an function that shoud be activated when the pull down menu in triggerd, the if functions is corresponding to the same menu overig_eenh[] PHP Code: function overig_tot_abs(selectVeld, nr) { // Prijs totaal if (document.getElementsByName('overig_eenh[]')[nr].value == 'totaal') { document.getElementsByName('overig_totaal[]')[nr].value = (document.getElementsByName('overig_prijs[]')[nr].value).toFixed( 2 ) } // Prijs kg if (document.getElementsByName('overig_eenh[]')[nr].value == 'kg') { document.getElementsByName('overig_totaal[]')[nr].value = (document.getElementsByName('overig_prijs[]')[nr].value * (document.getElementsByName('materiaal_tot_gew[]')[nr].value + document.getElementsByName('plaat_tot_gew[]')[nr].value)).toFixed( 2 ) } // Prijs verf opp. if (document.getElementsByName('overig_eenh[]')[nr].value == 'verf_opp') { document.getElementsByName('overig_totaal[]')[nr].value = (document.getElementsByName('overig_prijs[]')[nr].value * (document.getElementsByName('materiaal_tot_verf_opp[]')[nr].value + document.getElementsByName('plaat_tot_verf_opp[]')[nr].value)).toFixed( 2 ) } } Form (in loop): PHP Code: <tr> <td><select name="overig_omsch[]" > <option></option> <option value=Engineering>Engineering</option> <option value=Inkoop bev.middelen>Inkoop bev.middelen</option> <option value=Inkoop snijwerk>Inkoop snijwerk</option> <option value=Spuiten>Spuiten</option> <option value=Stralen>Stralen</option> <option value=Transport>Transport</option> </select> </td> <td><select name="overig_eenh[]" onChange="overig_tot_abs(this, 0)" > <option></option> <option value="totaal">Totaal</option> <option value="kg">Per Kg</option> <option value="verf_opp">Per 1m2</option> </td> <td><input type="text" name="overig_prijs[]" size="10" value="" /></td> <td><input type="text" name="overig_totaal[]" size="10" style="text-align:right;background-color: #f1f1f1" value="" readonly="readonly" /></td> <td><input type="text" name="overig_opmerkingen[]" size="75" value="" /></td> </tr> Hi, I'm new to these forums so if anything is out of the ordinary let me know for next time or so I can correct it - please. I am also not very good with javascript but I am trying to learn the whole concept. Anyways, I am supposed to create pull down menus when I open this page: Code: <?xml version="1.0" encoding="UTF-8" ?> <!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> <!-- New Perspectives on JavaScript, 2nd Edition Tutorial 4 Tutorial Case The 221B Blog Author: Date: Filename: holmes.htm Supporting files: menus.js, logo.jpg, sh.jpg, shblog.css --> <title>The 221B Blog</title> <link href="shblog.css" rel="stylesheet" type="text/css" /> <script type="text/javascirpt" src="menus.js"></script> </head> <body> <div id="page"> <form id="searchForm" action=""> <div id="logo"> <img src="logo.jpg" alt="The 221B Blog" /> <input id="searchTxt" type="text" size="20" /> <label for="searchTxt">Search</label> </div> <div id="menu1" class="menu"> <a href="#">The Adventures of Sherlock Holmes</a> </div> <div id="menu1List" class="menuList"> <ul> <li><a href="#">A Scandal in Bohemia</a></li> <li><a href="#">The Red-headed League</a></li> <li><a href="#">A Case of Identity</a></li> <li><a href="#">The Boscombe Valley Mystery</a></li> <li><a href="#">The Five Orange Pips</a></li> <li><a href="#">The Man with the Twisted Lip</a></li> <li><a href="#">The Blue Carbuncle</a></li> <li><a href="#">The Speckled Band</a></li> <li><a href="#">The Engineer's Thumb</a></li> <li><a href="#">The Noble Bachelor</a></li> <li><a href="#">The Beryl Coronet</a></li> <li><a href="#">The Copper Beeches</a></li> </ul> </div> <div id="menu2" class="menu"> <a href="#">The Memoirs of Sherlock Holmes</a> </div> <div id="menu2List" class="menuList"> <ul> <li><a href="#">Silver Blaze</a></li> <li><a href="#">The Yellow Face</a></li> <li><a href="#">The Stock-broker's Clerk</a></li> <li><a href="#">The "Gloria Scott"</a></li> <li><a href="#">The Musgrave Ritual</a></li> <li><a href="#">The Reigate Puzzle</a></li> <li><a href="#">The Crooked Man</a></li> <li><a href="#">The Resident Patient</a></li> <li><a href="#">The Greek Interpreter</a></li> <li><a href="#">The Naval Treaty</a></li> <li><a href="#">The Final Problem</a></li> </ul> </div> <div id="menu3" class="menu"> <a href="#">The Return of Sherlock Holmes</a> </div> <div id="menu3List" class="menuList"> <ul> <li><a href="#">The Empty House</a></li> <li><a href="#">The Norwood Builder</a></li> <li><a href="#">The Dancing Men</a></li> <li><a href="#">The Solitary Cyclist</a></li> <li><a href="#">The Priory School</a></li> <li><a href="#">Black Peter</a></li> <li><a href="#">Charles Augustus Milverton</a></li> <li><a href="#">The Six Napoleons</a></li> <li><a href="#">The Three Students</a></li> <li><a href="#">The Golden Pince-Nez</a></li> <li><a href="#">The Missing Three-Quarter</a></li> <li><a href="#">The Abbey Grange</a></li> <li><a href="#">The Second Stain</a></li> </ul> </div> <div id="menu4" class="menu"> <a href="#">The Case Book of Sherlock Holmes</a> </div> <div id="menu4List" class="menuList"> <ul> <li><a href="#">The Illustrious Client</a></li> <li><a href="#">The Blanched Soldier</a></li> <li><a href="#">The Mazarin Stone</a></li> <li><a href="#">The Three Gables</a></li> <li><a href="#">The Sussex Vampire</a></li> <li><a href="#">The Three Garridebs</a></li> <li><a href="#">Thor Bridge</a></li> <li><a href="#">The Creeping Man</a></li> <li><a href="#">The Lion's Mane</a></li> <li><a href="#">The Veiled Lodger</a></li> <li><a href="#">Shoscombe Old Place</a></li> <li><a href="#">The Retired Colourman</a></li> </ul> </div> <div id="menu5" class="menu"> <a href="#">His Last Bow</a> </div> <div id="menu5List" class="menuList"> <ul> <li><a href="#">Wisteria Lodge</a></li> <li><a href="#">The Cardboard Box</a></li> <li><a href="#">The Red Circle</a></li> <li><a href="#">The Bruce-Partington Plans</a></li> <li><a href="#">The Dying Detective</a></li> <li><a href="#">The Disappearance of Lady Frances Carfax</a></li> <li><a href="#">The Devil's Foot</a></li> <li><a href="#">His Last Bow</a></li> </ul> </div> <div id="menu6" class="menu"> <a href="#">The Novels</a> </div> <div id="menu6List" class="menuList"> <ul> <li><a href="#">A Study in Scarlet</a></li> <li><a href="#">The Sign of the Four</a></li> <li><a href="#">The Hound of the Baskervilles</a></li> <li><a href="#">The Valley of Fear</a></li> </ul> </div> <ul id="linkList"> <li><a href="#">Home</a></li> <li class="newGroup"><a href="#">Essays</a></li> <li><a href="#">Fan Fiction</a></li> <li><a href="#">Art</a></li> <li class="newGroup"><a href="#">Discussion Forum</a></li> <li class="newGroup"><a href="#">Holmes on the Web</a></li> <li><a href="#">The 221B Museum</a></li> <li><a href="#">Jeremy Brett Page</a></li> <li><a href="#">Basil Rathbone Page</a></li> <li><a href="#">The Baker Street Irregulars</a></li> <li class="newGroup"><a href="#">Holmes Radio Podcast</a></li> <li><a href="#">Holmes Audiobooks</a></li> <li class="newGroup"><a href="#">About Arthur Conan Doyle</a></li> <li><a href="#">Victorian England</a></li> <li><a href="#">Strand Magazine</a></li> <li><a href="#">The Holmes Atlas</a></li> <li class="newGroup"><a href="#">Other Fictional Detectives</a></li> <li class="newGroup"><a href="#">About the WebMaster</a></li> <li><a href="#">Issues Archive</a></li> </ul> <div id="main"> <img src="sh.jpg" alt="" style="float: right; margin: 0px 0px 5px 5px" /> <p id="firstp"> The most famous of fictional detectives, Sherlock Holmes first appeared in print in 1887, in stories written by the Scottish author and physician, Sir Arthur Conan Doyle. Holmes is famous for his use of deductive reasoning to solve difficult and complex cases. Almost all Holmes stories are told in the first-person narration of Dr. John Watson, Holmes' closest friend and confidant.</p> <p>Doyle wrote four novels and 56 short stories in the Sherlock Holmes canon. The first Holmes tale was the novel, <i>A Study in Scarlet</i>, which chronicled the meeting of Holmes and Watson and covered their first case together. As Doyle wrote additional tales, the Sherlock Holmes stories grew in popularity, becoming a regular feature of <i>The Strand Magazine</i>. Desiring to explore other literary pursuits, Doyle grew tired of the detective and killed off Holmes in the short story <i>The Final Problem</i>. However, public acclaim and a desire for more Holmes stories eventually persuaded Doyle to resurrect the popular detective, bringing him back in <i>The Adventure of the Empty House</i>.</p> <p>Doyle's final Holmes story, <i>His Last Bow</i>, appeared in 1914, but that did not end the public's fascination with Holmes and Watson. Basil Rathbone brought the character to the silver screen in 14 movies loosely based on Doyle's original stories. In more recent years, Jeremy Brett played Holmes to great critical acclaim over four seasons of the BBC series, <i>The Adventures of Sherlock Holmes</i>. In all, Holmes has been played by over 70 actors appearing in over 200 films.</p> <p>To enjoy online versions of the Sherlock Holmes short stories and novels, select entries from the menu at the top of this page.</p> </div> </form> </div> </body> </html> Here is my javascript file: Code: /* New Perspectives on JavaScript, 2nd Edition Tutorial 4 Tutorial Case Author: Date: Filename: menus.js ------------------------------------------------------------- Function List: init() Initializes the contents of the holmes.htm Web page, setting the display property of the pull-down menus and the initial values of the global variables moveMenu() Moves the active menu from one pull-down menu to another changeMenu() Change the active menu displayed in the document closeOldMenu() Closes the active menu rollDown() Applies a roll-down effect the opening of the active menu ------------------------------------------------------------- Global Variable List: activeMenu An object variable pointing to the currently active and open menu timeID A variable containing the id of a timed command using the setInterval method clipHgt The current height of the active menu as it is being rolled down ------------------------------------------------------------- */ window.onload = init; var activeMenu = null; var clipHgt = 0; var timeID; function init() { var menus = new Array(); var allElems = document.getElementsByTagName("*"); for (var i = 0; i < allElems.length; i++) { if (allElems[i].className == "menu") menus.push(allElems[i]); } for (var i = 0; i < menus.length; i++) { menus[i].onclick = changeMenu; menus[i].onmouseover = moveMenu; } document.getElementById("logo").onclick = closeOldMenu; document.getElementById("linkList").onclick = closeOldMenu; document.getElementById("main").onclick = closeOldMenu; } function moveMenu() { // this function moves the pull-down menu from one title to another if (activeMenu) { closeOldMenu(); menuID = this.id + "List"; activeMenu = document.getElementById(menuID); activeMenu.style.clip = "rect(0px, 150px, 0px, 0px)"; activeMenu.style.display = "block"; timeID = setInterval("rollDown()", 1); } } function changeMenu() { // this function changes the pull-down menu displayed in the document closeOldMenu(); menuID = this.id + "List"; activeMenu = document.getElementById(menuID); activeMenu.style.clip = "rect(0px, 150px, 0px, 0px)"; activeMenu.style.display = "block"; timeID = setInterval("rollDown()", 1); } function closeOldMenu() { if (activeMenu) { clearInterval(timeID); activeMenu.style.display = "none"; activeMenu = null; } } function rollDown() { clipHgt = clipHgt + 10; if (clipHgt < 400) { activeMenu.style.clip = "rect(0px, 150px," + clipHgt + "px, 0px)"; } else { clearInterval(timeID); clipHgt = 0; } } The book's tutorial instructed me to copy down every thing I did yet it doesn't work at all! I've tried on Safari, IE, and Firefox. Can someone tell me what I'm doing wrong? EDIT: Here is the CSS file. Code: /* New Perspectives on JavaScript, 2nd Edition Tutorial 4 Tutorial Case Author: Date: Filename: shblog.css This file contains styles used in the holmes.htm file. */ * {padding: 0px; margin: 0px; line-height: 1.2} body {background-color: white; font-family: 'Trebuchet MS', Arial, Verdana, sans-serif; font-size: 12px} #page {position: absolute; top: 0px; left: 10px; width: 850px} a {text-decoration: none; color: black} p {margin: 15px 0px} ul {list-style-type: none} #logo {position: absolute: top: 0px; left: 0px; width: 100%; height: 108px; background-color: white; z-index: 3} #logo img {float: left} #logo label {float: right; margin-top: 15px; margin-right: 10px} #logo input {float: right; margin-top: 15px; background-color: ivory} .menu {position:absolute; top: 110px; width: 140px; height: 35px; z-index: 3; border: 1px solid black; color: black; background-color: rgb(212, 212, 212); text-align: center} .menu a {display: block; width: 140px; height: 35px; color: black} .menu a:hover {background-color: rgb(151, 151, 151); color: white} #menu1, #menu1List {left: 0px} #menu2, #menu2List {left: 141px} #menu3, #menu3List {left: 282px} #menu4, #menu4List {left: 423px} #menu5, #menu5List {left: 564px} #menu6, #menu6List {left: 705px} .menuList {position: absolute; top: 146px; width: 140px; z-index: 2; background-color: ivory; border: 1px solid black; display: none} .menuList li {margin: 5px} .menuList a {display: block; width: 132px} .menuList a:hover {background-color: rgb(151, 151, 151); color: white} #linkList {position: absolute; top: 160px; left: 5px; width: 175px; border-right: 1px solid black} #linkList li {line-height: 1.5} #linkList .newGroup {margin-top: 15px} #linkList a:hover {text-decoration: underline overline; color: red; background-color: ivory} #main {position: absolute; top: 160px; left: 190px; z-index: 1} #firstp {margin-top: 0px} #firstp:first-line {font-variant: small-caps; font-weight: bold} #firstp:first-letter {float: left; font-size: 400%; font-family: 'Times New Roman', serif; line-height: 0.8; margin: 0px 5px 0px 0px} Is there any way to use javascript to strip codes or text from a webpage.
Hello, Hello, I am new to javascript. I want to combine those two scripts in one, but unfortunately I cannot do this by myself. The main idea is to take a random youtube link and put it on the player so my website users can watch a random youtube video when they refresh the page. If there is someone who can help me with this problem, I will be really thankful. The two codes that I am strangling with are at the end of this post. Thanks in advance. Code number one (Random Text Display) Code: <script language='JavaScript'> var r_text = new Array (); r_text[0] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[1] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[2] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[3] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[4] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[5] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[6] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; var i = Math.floor(7*Math.random()) document.write(r_text[i]); </script> The second code (JW Player) Code: <script type='text/javascript'> jwplayer('myElement').setup({ file: 'TUK', width: 290, }); </script> Reply With Quote 01-08-2015, 08:17 PM #2 Philip M View Profile View Forum Posts Supreme Master coder! Join Date Jun 2002 Location London, England Posts 18,371 Thanks 204 Thanked 2,573 Times in 2,551 Posts Just put the two scripts within the same set of script tags. Note that <script language='JavaScript'> is long obsolete. Code: <script type = "text/javascript"> jwplayer('myElement').setup({ file: 'TUK', width: 290, var r_text = new Array (); r_text[0] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[1] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[2] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[3] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[4] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[5] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[6] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; var i = Math.floor(7*Math.random()) document.write(r_text[i]); </script> I am new to using Javascript. Can someone help me combine these two codes? I can't get it to work. [code] body {background-color: #FFFFee;} .c { position: absolute; font-size: 1px; background:red; height: 2px; width: 2px; } .d { position: absolute; font-size: 1px; background:blue; height: 2px; width: 2px; } </style> </head> <body> <script language="javascript"> var i,y,x,y1; for (i=1; i<600; i++) { y=150-100*Math.sin(i/50); y1=150-100*Math.cos(i/50); x=i+50; document.write("<span class='c' style='left:"+x+";top:"+y+";'></span>"); document.write("<span class='d' style='left:"+x+";top:"+y1+";'></span>"); } [code] with this one. [code] .moveimage { position:absolute; left:20; top:50; z-index:2; } </style> <script language="JavaScript"> var fishLeft = 20; var imgWidth = 106; function moveFish() { var elem = document.getElementById("myDiv"); fishLeft+=4; if(fishLeft > document.body.clientWidth + (imgWidth / 2)) fishLeft = imgWidth / 2; elem.style.left = fishLeft; window.status= fishLeft ; setTimeout("moveFish()", 100); } </script> <title></title> </head> <body> <br> <div id="myDiv" class="moveImage"><img src="fish1.gif"></div> <br><br><br><br><br><br><br><br><br> <input type="button" value="Move Fish" onClick="moveFish()" ID="Button1" NAME="Button1"> [code] I made a post a really long time ago and can't find my original post so I am re-posting. The code has changed a little and not sure where to go from here. I am trying to validate US and Canada zipcodes based on the Country selection. So if I select Country US validate zip for US or if I select Country Canada validate zip for Canada. I really don't know javascript and this code was sent to me but it doesn't work and can't make sense of what to do. Can anyone please help? I am attaching the code. Code: <%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%> <!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> <script> function checkForOther(obj) { test = obj.value if (!document.layers) { var txt = document.getElementById("otherTitle"); if (obj.value == "US") txt.style.display = "inline"; else (obj.value == "CA") txt.style.display = "inline"; { } } } </script> <script type = "text/javascript"> function validZip(zip) { var reUS = /^([0-9]{5})(?:[-\s]*([0-9]{4}))?$/, // US Zip reCA = /^([A-Z][0-9][A-Z])\s*([0-9][A-Z][0-9])$/; // CA Zip return zip.match(reUS) || zip.match(reCA); } </script> </head> <body> <form action="https://www.amm.org/memserv/survey/surveypg2.asp" method="post" name="survey1" id="survey1" onKeyUp="highlight(event)" onClick="highlight(event)"> <p><strong>Country: </strong> <select name="selTitle" id="titles" onchange="checkForOther(this)"> <option value="0">**</option> <option value="CA">Canada</option> <option value="US">United States</option> </select> </p> <p><strong>US Zip Code: </strong> <input name="ZIP" type="text" id="otherTitle" style="display:none;" onchange="if (validZip(this.value)) {alert('*** Please enter a valid zip code.');}"/> <!--<input type="text" id="otherTitle" name="zip" style="display:none;" maxlength="10" onchange ="validZip(this.value)">--> </p> </form> </body> </html> Hello guys, im working on another little project for my team here, and the way our system works is in order to change a persons password, there is a certain link that has to be accessed...for example...if i want to change a persons password, lets say UserID: t-test100 current pass: 911 and i want to change the password to 999 instead of 911...there is a link that needs to sorta load the profile in the background first in order to do the password change, i got the password change page down to a T and it works like a charm, but ONLY when the link is accessed, so for example, this is how the link would look like https://www.***.com/Sps/jsp/MyChange...?uid=t-test100 as soon as that URL is accessed, my code that i made for the password reset, works, but if i open a fresh window (where no cookies have been logged) and i go directly to my page where i have the script to change the password, it will come back with an error, but when i go to that URL and then back to my script and run it again, it works fine....SOOOO...back to my question...how would i be able to make it so that i have an extra link on my site that i can add to go to https://www.***.com/Sps/jsp/MyChange...?uid=t-test100 URL in a new window...but i want it so that when i click the link, it opens up the URL and closes the window after 1 second...or less...just so that it loads the URL in the background and thats it basically what i need to do, just for it to open for a split second, for the browser to register that i've visited the URL for that particular username, and then so that when i try to change the password, it goes through. Hi guys, it's a bit of a large question but I've been messing around with code for a while, and nothing seems to work... Basically, I need to make, a 'dynamic theme changer'. Basically what I need to do is have several drop down boxes, each one with some colours available as options. When you select one, it automatically (without refreshing the page) updates a certain element's style. For example, if you selected green as one colour and red as another, the element linked to the first drop-down would turn green, and the element linked to the second drop-down would turn red, and so on so forth. It then needs to have a 'save' button, which saves the settings, and adds a cookie with the style details so that when they visit the page again it's still personalized. There also needs to be a cancel button which discards all changes. I know it's a large question but I'm ripping my hair out over this one! =P Your help is much appreciated. Hey I got two text boxes one for start date and second for end date in that i want to fill text boxes according to Quarter of a year, as like if i put 1-4-2012 in first text box then in second text box values should be automatically 30-6-2012. So now tell me please how to do this ??????? Regards rajboy13 Contact me @ = rajboy13@gmail.com Is there a way to pull a text off a certain div on a page, and put it into a javascript string? I'm certain that the field has a particular name and id that I can use, if need be.
I'm working on an internal website at work and employees have a cookie created when they login to the customer support tool. The filename is cookie:username@domain.com/ and I'd like to use javascript to pull a variable for their username to plug into a URL for a unique link when they're viewing one of our intranet pages. I'm a Javascript newbie so any help is appreciated. @domain.com/ will always be the same but I don't know how to pull the unique username from the filename of the cookie. I don't need to actually read the cookie. Thanks! Hello, I am trying to use select options to get birthdate and calculate the age. I got the birthday with "birthDay = document.form1.selDate;" However i'm lost on the birthMonth and birthYear. I've looked at lots of examples. The birthMonth probably needs to be converted to integer, or use 1 thru 12 rather than Jan thru Dec. But birthYear i'd think would come back as a valid number. Is anyone familiar with this? Thanks. Code: <html> <head> <title>Main</title> <script language="javascript"> <!-- function Age() { var birthDay; var birthMonth; var birthYear; var userAge; var currentDay = new Date(); var dayNow = currentDay.getDate(); var monthNow = (currentDay.getMonth()); var yearNow = (currentDay.getFullYear()); birthDay = document.form1.selDate; // Don't know how to get birthmonth???? // birthMonth = (parseInt(document.form1.selMonth.value)-1); birthYear = document.form1.selYear; // alert("birthyear " + birthYear); ( gives "birthYear [object HTMLSelectElement]") if((monthNow > birthMonth)||(monthNow == birthMonth & dayNow >= birthDay)) { userAge = birthYear; } else { userAge=birthYear+1;} alert("As of today, " + currentDay +' \n'+", you a " + (yearNow - userAge) + " years old"); } //--> </script> </head> <body> <form name="form1" id="startOfForm"> <table><tbody> <tr> <td class="question"><label for="birthdate">Enter Birthdate</label></td> <td> <select name=selMonth> <option value=0 selected>Month</option> <option selected value="Jan">Jan</option> <option selected value="Feb">Feb</option> <option selected value="Mar">Mar</option> <option selected value="Apr">Apr</option> <option selected value="May">May</option> <option selected value="Jun">Jun</option> <option selected value="Jul">Jul</option> <option selected value="Aug">Aug</option> <option selected value="Sept">Sept</option> <option selected value="Oct">Oct</option> <option selected value="Nov">Nov</option> <option selected value="Dec">Dec</option> </select> <select name=selDate> <option value=0 selected>Date</option> <option selected value="1">1</option> <option selected value="2">2</option> <option selected value="3">3</option> <option selected value="4">4</option> <option selected value="5">5</option> <option selected value="6">6</option> <option selected value="7">7</option> <option selected value="8">8</option> <option selected value="9">9</option> </select> <select name=selYear> <option value=0 selected>Year</option> <option value="2001">2001</option> <option value="2000">2000</option> <option value="1999">1999</option> <option value="1998">1998</option> <option value="1997">1997</option> <option value="1996">1996</option> <option value="1995">1995</option> </select> </td> </tr> <tr> <td> <input name="cmd" type=button value="Age" onclick="Age()" style="width:150px; height:30px;"> </td> </tr> </tbody></table> </form> </body> </html> So I have been stuck for a couple days now on this problem. I am trying to create a form to edit existing data in my database. I have 2 drop down boxes( category then item) they do not work correctly. I am using php to populate the drop down boxes but there is nothing dynamic about doing this. I think I need to totally rewrite the page using java script or Ajax but I don't know what parts. So I want the user to select a category from a drop down list populated by database then have it populate the item list(so I think both of these need to be java script in case they change the category it will re populate the item list). Then I just want the selection of the item to pull the information to my form so they can update it and save the update(which I am pretty sure I can save the update as a php function but need to populate the item editable information in java script). I am really looking for help on how to setup the page with java script to make database queries and use the results to update parts of the page. In case you confused here is my flow: page loads -User selects catagory query database for item list (on change event it think) -User selects item Item information is pulled and displayed from database(cost, serial number, quantity) (another on change event) -User is able to edit information and save updated results(run an update.php...) Here is a quick rundown of my code: ----I want this query to select the item based on the selected category (itemcat) <? $result = mysql_query("SELECT itemnum, itemname FROM item where itemcat = 'Item1' ", $con); //yes this is hard coded right now mysql_close($con); ?> ----end of head start of body---- ---This category list is hard coded since the categories will almost never change--- <td>Select Item</td> <td width="142"><select name="itemcatsearch" size="1"> <option value="1" selected="selected">Item1</option> <option value="2">Item2</option> <option value="3">Item3</option> <option value="4" >Item4</option> <option value="5">Item5</option> <option value="6">Item6</option> <option value="6">Item7</option> </select></td> <td width="268"> <!-- Dynamic item list -- this is just the result of the query run at the top and placed into a second drop down box> <select name="itemcat" size="1"> <? while($row = mysql_fetch_array($result)){ ?> <option value="<? echo $row['itemnum']?>" > <? echo $row['itemname']?> </option> <? } ?> I know its ugly sorry I am a noob. Any help or direction would be greatly appreciated. Hey all, Objective: - when you select other the pull down menu is replaced by the text field. Currently: - Gotten it to the level of when you select the other the text field appears. Question: - HOw can I modify the code so when I select the other menu option from the pull down menu and it replaced by the text field? Quote: <script type="text/javascript"> function togglefield(val) { var o = document.getElementById('other'); (val == 'Other')? o.style.display = 'block' : o.style.display = 'none'; } </script> and the form: <form action="" method="post"> <select name="sel" id="sel" onChange="togglefield(this.value);"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="Other">Other</option> </select> <input type="text" name="other" id="other" style="display: none;"> </form> Hi all I have relatively easy task I need to accomplish but as per usual I have very little idea of how to do it. I have done a google search to no avail. Basically I need to: 1. Pull a value from inside a div Code: <div id="number">(invoice #1017)</span> 2. Populate a form input field with that value. Does this make sense? If not let me know if you need any more info. Thanks Hello all. I have created a snippet of javascript code that will do the following: 1. read the window URL 2. depending on the window URL, a word will be placed into a hidden form field. 3. Person submits form...etc., etc. Here is what I have. Let's say that I have a single landing page with a simple form on it. I would like to reference the referred URL by pulling a part of the window URL into a hidden field of the form. Let's say the three URLs a http://www.whatever.com/index.htm?id=ref1 http://www.whatever.com/index.htm?id=ref2 http://www.whatever.com/index.htm?id=ref3 I have created a javascript that takes the exact URL and check for equality. If the URL is equal, it will place the corresponding id into the hidden form field. See my code below. Code: <script type="text/javascript"> var lead_source = window.location.href { if (lead_source == "http://www.whatever.com/index.htm?id=ref1") { document.writeln("<input type=hidden name='lead_source' id='lead_source' value='ref1'>"); } else if (lead_source == "http://www.whatever.com/index.htm?id=ref2") { document.writeln("<input type=hidden name='lead_source' id='lead_source' value='ref2'>"); } else if (lead_source == "http://www.whatever.com/index.htm?id=ref3") { document.writeln("<input type=hidden name='lead_source' id='lead_source' value='ref3'>"); } } </script> What I am looking to do is modify the code to only look at the "id" variable, not the entire URL. That way, if I add any additional items to the URL I will not have to change the code. I guess I am looking for an extra step of parsing the URL...maybe. Thanks for your help Hi, I am making game calculator but i am having problem with coding... .::Java script::. Code: <script language="javascript"> function temp(form) { var a = (form.DegF.value); var b = (form.DegF2.value); var c = (form.DegF3.value); var d = (form.DegF4.value); var e= (form.DegF5.value); var f= (form.DegF6.value); var g= (form.DegF7.value); var h= (form.DegF8.value); var i= (form.DegF9.value); var j= (form.DegF10.value); var k= (form.DegF11.value); var l= (form.DegF12.value); var m= (form.DegF13.value); var n= (form.DegF14.value); var o= (form.DegF15.value); var aa= (Math.pow(a,3)); var bb= (Math.pow(b,3)); var cc= (Math.pow(c,3)); var dd= (Math.pow(d,3)); var ee= (Math.pow(e,3)); var ff= (Math.pow(f,3)); var gg= (Math.pow(g,3)); var hh= (Math.pow(h,3)); var ii= (Math.pow(i,3)); var jj= (Math.pow(j,3)); var kk= (Math.pow(k,3)); var ll= (Math.pow(l,3)); var mm= (Math.pow(m,3)); var nn= (Math.pow(n,3)); var oo= (Math.pow(o,3)); var q = (aa+bb+cc+dd+ee+ff+gg+hh+ii+jj+kk+ll+mm+nn+oo); var y = (aa+bb+cc+dd+ee+ff+gg+hh+ii+jj+kk+ll+mm+nn+oo); form.DegD.value = y var p = 0; p = (Math.pow(q,1/3)) ; z = (Math.round(p)); form.DegC.value = z } </script> .::Html::. Code: <form style="text-align:center"> <label>01 <input name=DegF type=text value=0 size=30 maxlength=30 /> </label><br/> <label>02 <input name=DegF2 type=text value=0 size=30 maxlength=30 /> </label><br/> <label>03 <input name=DegF3 type=text value=0 size=30 maxlength=30 /> </label><br/> <label>04 <input name=DegF4 type=text value=0 size=30 maxlength=30 /> </label><br/> <label>05 <input name=DegF5 type=text value=0 size=30 maxlength=30 /> </label><br/> <label>06 <input name=DegF6 type=text value=0 size=30 maxlength=30 /> </label><br/> <label>07 <input name=DegF7 type=text value="0"size=30 maxlength=30 /> </label><br/> <label>08 <input name=DegF8 type=text value="0"size=30 maxlength=30 /> </label><br/> <label>09 <input name=DegF9 type=text value="0"size=30 maxlength=30 /> </label><br/> <label>10 <input name=DegF10 type=text value="0"size=30 maxlength=30 /> </label><br/> <label>11 <input name=DegF11 type=text value="0"size=30 maxlength=30 /> </label><br/> <label>12 <input name=DegF12 type=text value="0"size=30 maxlength=30 /> </label><br/> <label>13 <input name=DegF13 type=text value="0"size=30 maxlength=30 /> </label><br/> <label>14 <input name=DegF14 type=text value="0"size=30 maxlength=30 /> </label><br/> <label>15 <input name=DegF15 type=text value="0"size=30 maxlength=30 /></label> <p><input type=button onclick=temp(this.form) value=Calculate name="calc"/> <label><input type=reset name=Reset id=Reset value=Clear /></label></p> <blockquote><p>Total Exp <label><input name=DegD type=text size=40 readonly="readonly" /></label></p> <p>Total Level <label><input name=DegC type=text size=40 readonly=readonly /></label></p></blockquote> </form> Here is the website (Example) :: http://xcyber.netii.net/ .::The problem::. I want to add +1 if one field is filled or add +2 if two fields are filled or etc... at Total Exp txt field. I dont know how to code that part. Your help will be most appreciated! Thanks for reading... Hi, I'm new and I'm new with javascript and I don't know many useful techniques. I'm repeating the same sequence over and over again making the file large. So I was wondering if you could help me compacting the codes below. Code: function doSomething1(){var country1=$("#nameC").val();$("#nameC").val(country1+'1');$("#holder12").removeClass().addClass("flag1");$("#country1").addClass('hotkey1').delay(250).queue(function(next){$(this).removeClass("hotkey1");next();});$(document).bind('keydown');};$("#country1").click(function(){shiftpH();doSomething1();});$(document).bind('keydown','1',function(){shiftpH();doSomething1();}); function doSomething2(){var country2=$("#nameC").val();$("#nameC").val(country2+'2');$("#holder12").removeClass().addClass("flag2");$("#country2").addClass('hotkey2').delay(250).queue(function(next){$(this).removeClass("hotkey2");next();});$(document).bind('keydown');};$("#country2").click(function(){shiftpH();doSomething2();});$(document).bind('keydown','2',function(){shiftpH();doSomething2();}); function doSomething3(){var country3=$("#nameC").val();$("#nameC").val(country3+'3');$("#holder12").removeClass().addClass("flag3");$("#country3").addClass('hotkey3').delay(250).queue(function(next){$(this).removeClass("hotkey3");next();});$(document).bind('keydown');};$("#country3").click(function(){shiftpH();doSomething3();});$(document).bind('keydown','3',function(){shiftpH();doSomething3();}); function doSomething4(){var country4=$("#nameC").val();$("#nameC").val(country4+'4');$("#holder12").removeClass().addClass("flag4");$("#country4").addClass('hotkey4').delay(250).queue(function(next){$(this).removeClass("hotkey4");next();});$(document).bind('keydown');};$("#country4").click(function(){shiftpH();doSomething4();});$(document).bind('keydown','4',function(){shiftpH();doSomething4();}); These are only 4 files, there are many. is it possible to do some kind of loop so the filesize reduces? I was wondering if there was someone who could help me with an easy issue for pro coders. I'm really new to this, but i have tried hard in many hours without any results. I have an JS code making the navigation on my webpage dynimacly to load. So the url is always index.html and then you can press at the menu you will get dynamicly the content of home.html in one special div called "container". But i was wondering if i could make this div to fade out and in when you click at it. So i find another code that should do it, but i really dont know how to mix them up... The base code for the ajax load page: Code: <script type="text/javascript"> var loadedobjects="" var rootdomain="http://"+window.location.hostname function ajaxpage(url, containerid){ var page_request = false if (window.XMLHttpRequest) // if Mozilla, Safari etc page_request = new XMLHttpRequest() else if (window.ActiveXObject){ // if IE try { page_request = new ActiveXObject("Msxml2.XMLHTTP") } catch (e){ try{ page_request = new ActiveXObject("Microsoft.XMLHTTP") } catch (e){} } } else return false page_request.onreadystatechange=function(){ loadpage(page_request, containerid) } page_request.open('GET', url, true) page_request.send(null) } function loadpage(page_request, containerid){ if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1)) document.getElementById(containerid).innerHTML=page_request.responseText } function loadobjs(){ if (!document.getElementById) return for (i=0; i<arguments.length; i++){ var file=arguments[i] var fileref="" if (loadedobjects.indexOf(file)==-1){ //Check to see if this object has not already been added to page before proceeding } if (fileref!=""){ document.getElementsByTagName("head").item(0).appendChild(fileref) loadedobjects+=file+" " //Remember this object as being already added to page } } } </script> And then i use a google api that allowed the functions: fadeIn and fadeOut. So i think i have to take them out of this code and paste it in the one above or something? Because i dont want this whole code below: Code: $(document).ready(function(){ //References var sections = $("#dyn"); var loading = $("#loading"); var content = $("#content"); //Manage click events sections.click(function(){ //show the loading bar showLoading(); //load selected section switch(this.id){ case "home": content.fadeOut(); content.load("home.php .screen", hideLoading); content.fadeIn(); break; case "about": content.fadeOut(); content.load("home.php", hideLoading); content.fadeIn(); break; case "interviews": content.slideUp(); content.load("page.php #section_interviews", hideLoading); content.slideDown(); break; case "external": content.slideUp(); content.load("page.php", hideLoading); content.slideDown(); break; default: //hide loading bar if there is no selected section hideLoading(); break; } }); //show loading bar function showLoading(){ loading .css({visibility:"visible"}) .css({opacity:"1"}) .css({display:"block"}) ; } //hide loading bar function hideLoading(){ loading.fadeTo(1000, 0); }; }); |