JavaScript - Call User Defined Functions With Multiple Parameters
Hello,
Ok so the following code works. Code: function myFunction(myName) { alert("You are "+myName); } callFunction = "myFunction"; parameter = "Joe"; window[callFunction](parameter); However this code doesn't work: Code: function myFunction(myName, myAge) { alert("You are "+myName+" and "+myAge+" years old."); } callFunction = "myFunction"; parameter = "Bill,15"; parameter = parameter.split(","); window[callFunction](parameter); The above code alerts: "You are Bill,15 and undefined years old." Thanks for the help! Similar TutorialsI need to create a function with named getFontSize() needs one parameter named "id" and id is value of object in document then to create a variable named object to represent object return font size of text in object use style object to retrieve font size and use parseInt() function to get value of font size this is the code i came up with Code: function getFontSize(id) { // Returns the font size of the object with the value id var object=document.getElementById(id); fontsize=parseInt(object.style.fontSize); return(fontsize); } What should i change to make work/ Hello again, CodingForums. I have a .php page that generates the following javascript which is intended to hide/show a form somewhere on the page. (It only shows right now because it's not done yet.) However, after the page is rendered and given to the client, the function calls do not work, and the error console reports that "[function name] is not defined." Code: <script type="text/javascript"> function showEdit(num) { var elem = document.getElementById("form-wrap"+num); var str = "<form action=\"./blog.php\" method=\"POST\" class=\"blogform\">"; str = str + "<input type=\"hidden\" name=\"u\" value=\"Webmaster\"/>"; str = str + "<input type=\"hidden\" name=\"q\" value=\"edit\"/>"; str = str + "<input type=\"hidden\" name=\"n\" value=\""+num+"\"/> str = str + "<label for=\"title\">Title</label>"; str = str + "<input type=\"text\" name=\"title\" value=\""+document.getElementById("title"+num).innerHTML+"\"/>"; str = str + "<label for=\"picture\">Picture</label>"; str = str + "<input type=\"file\" name=\"picture\"/>"; str = str + "<label for=\"caption\">Picture Caption</label>"; str = str + "<input type=\"text\" name=\"caption\" value=\""+document.getElementById("post-image"+num).getAttribute("title")+"\"/>"; str = str + "<label for=\"content\">Entry Text</label>"; str = str + "<textarea name=\"content\" cols=\"100\" rows=\"20\" class=\"blogtextarea\">"+document.getElementById("content"+num).innerHTML+"</textarea>"; str = str + "<input type=\"submit\" value=\"Edit Post\"/>"; str = str + "</form>"; elem.innerHTML = str; } function showDelete(num) { var elem = document.getElementById("form-wrap"+num); var str = "<form action=\"./blog.php\" method=\"POST\" class=\"blogform\">"; str = str + "<input type=\"hidden\" name=\"u\" value=\"Webmaster\"/>"; str = str + "<input type=\"hidden\" name=\"q\" value=\"delete\"/>"; str = str + "<input type=\"hidden\" name=\"n\" value=\""+num+"\"/> str = str + "<label for=\"really\">Delete this post?</label>"; str = str + "<input type=\"radio\" name=\"really\" value=\"Yes\">Yes</input><br/>"; str = str + "<input type=\"radio\" name=\"really\" value=\"No\" checked=\"checked\">No</input><br/>"; str = str + "<input type=\"submit\" value=\"Confirm\"/>"; str = str + "</form>"; elem.innerHTML = str; } function showNew(num) { var elem = document.getElementById("new-form-wrap"); var str = "<form action=\"./blog.php\" method=\"POST\" class=\"blogform\">"; str = str + "<input type=\"hidden\" name=\"u\" value=\"Webmaster\"/>"; str = str + "<input type=\"hidden\" name=\"q\" value=\"new\"/>"; str = str + "<input type=\"hidden\" name=\"n\" value=\""+num+"\"/>"; str = str + "<label for=\"title\">Title</label>"; str = str + "<input type=\"text\" name=\"title\"/>"; str = str + "<label for=\"picture\">Picture</label>"; str = str + "<input type=\"file\" name=\"picture\"/>"; str = str + "<label for=\"caption\">Picture Caption</label>"; str = str + "<input type=\"text\" name=\"caption\" />"; str = str + "<label for=\"content\">Entry Text</label>"; str = str + "<textarea name=\"content\" cols=\"100\" rows=\"20\" class=\"blogtextarea\"></textarea>"; str = str + "<input type=\"submit\" value=\"Create Post\"/>"; str = str + "</form>"; elem.innerHTML = str; } </script> These are all the elements that call the javascript functions. Code: <a onclick="showNew('2');" class="edit-delete">Create New Entry</a> <a onclick="showDelete('1');" class="edit-delete">Delete</a> <a onclick="showEdit('1');" class="edit-delete">Edit</a> <a onclick="showDelete('0');" class="edit-delete">Delete</a> <a onclick="showEdit('0');" class="edit-delete">Edit</a> I have no idea why my functions aren't being recognized by the interpreter as such, but it's probably something simple. Thanks in advance for the help, and I'll be happy to post more code if it might be relevant. I am working on this simple calculator that passes values from one function to another via paramters. I have used alert() to find what is being recieved, so far nothing. here is my code: Code: <html> <head> <title>Rectangle Calculator</title> <script type="text/javascript"> function calcArea(l,w) { var area = l * w return area alert("area: " + perimeter) // doesnt work } function calcPerim(l,w) { var perimeter = 2*(l+w) return perimeter alert("perimeter: " + perimeter) // doesnt work } function calc() { var width width = document.calcForm.widthBox.value var length length = document.calcForm.lengthBox.value alert(length + width) // works calcArea(length, width) document.clacForm.areaBox.value = area calcPerim(length, width) document.clacForm.perimeterBox.value = perimeter } </script> </head> <body> <p><strong>Area and Perimeter Calculator</strong></p> <form name="calcForm"> <label>Enter Width of the rectangle:</label> <br /> <input type="text" name="widthBox" size="6" /> <br /><br /> <label>Enter Length of the rectangle:</label> <br /> <input type="text" name="lengthBox" size="6" /> <br /> <input type="button" onClick="calc()" value="calculate" /><br /><br /> <label>The area is:</label> <br /> <input type="text" name="areaBox" size="12" /> <br /><br /> <label>The perimeter is:</label> <br /> <input type="text" name="perimeterBox" size="12" /> <br /> </form> </body> </html> here is the link to my page: http://royalvillicus.com/school/calcdebug.html I appreciate the help Hi all, I've written the following script: Code: <!doctype html> <html> <head> <meta charset="utf-8"> <title>Keys2</title> <script type="text/javascript"> function keyPress(key){ document.getElementById('rect01').style.fill = "red"; } </script> <style> .button { width: 100px; padding-right:10px; height:2em; background-color:#FC3; border-radius:3px; color:#fff; font-weight:bold; } ul { list-style-type: none; padding: 0; margin-left:25px; } li { float:left; width:30px; margin-right:25px; padding:10px; height:2em; background-color:#FC3; font-size:xx-large; } </style> </head> <body> <div> <svg width="1000" height="200"> <rect x="25" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect01"/> <rect x="100" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect02"/> <rect x="175" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect03"/> <rect x="250" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect04"/> <rect x="325" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect05"/> <rect x="400" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect06"/> <rect x="475" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect07"/> <rect x="550" y="50" fill="#FFFFFF" stroke="#000000" width="50" height="150" id="rect08"/> </svg> </div> <div> <ul> <li><a href="#" class="button" onClick="keyPress(rect01);">A</a></li> <li><a href="#" class="button" onClick="keyPress(rect02);">B</a></li> <li><a href="#" class="button" onClick="keyPress(rect03);">C</a></li> <li><a href="#" class="button" onClick="keyPress(rect04);">D</a></li> <li><a href="#" class="button" onClick="keyPress(rect05);">E</a></li> <li><a href="#" class="button" onClick="keyPress(rect06);">F</a></li> <li><a href="#" class="button" onClick="keyPress(rect07);">G</a></li> <li><a href="#" class="button" onClick="keyPress(rect08);">H</a></li> </ul> </div> </body> </html> Now, I could write a version of the keypress function for each rectangle, but that seems like poor coding. Can anyone point out how I might restructure the function or the code so that I can pass the number in the onClick to the rectangle it refers to? Thanks I have a good understanding of javascript although I am new to working xml. So I am having a problem getting javascript to recognize that my parameter value in my function call is an attribute in my xml. I called the js function like this: Code: <a href="#" onClick="ebookCategory(marketing);">Marketing</a> Here is my js function: Code: var category; function ebookCategory(category) { if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("GET","ebook.xml",false); xmlhttp.send(); xmlDoc=xmlhttp.responseXML; document.write("<table border='1'>"); var x=xmlDoc.getElementsByTagName(category); for (i=0;i<x.length;i++) { document.write("<tr><td>"); document.write(x[i].getElementsByTagName("bookCover")[0].childNodes[0].nodeValue); document.write(x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue); document.write(x[i].getElementsByTagName("description")[0].childNodes[0].nodeValue); document.write(x[i].getElementsByTagName("price")[0].childNodes[0].nodeValue); document.write("</td><td>"); i++; document.write(x[i].getElementsByTagName("bookCover")[0].childNodes[0].nodeValue); document.write(x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue); document.write(x[i].getElementsByTagName("description")[0].childNodes[0].nodeValue); document.write(x[i].getElementsByTagName("price")[0].childNodes[0].nodeValue); document.write("</td></tr>"); } document.write("</table>"); } // end ebookCategory() Some of the aspects in this function are new to me, xml stuff. Here is my xml setup: Code: <ebook category="marketing"> <bookCover><img src="/millionaire/ebooks/covers/miracle2.jpg" height="150" width="150" /></bookCover> <title>Marketing Miracle</title> </ebook> I appreciate any help in the matter Hey guys, i'm taking on my first minor project in javascript and i've run into an error. For whatever reason, buttons i've defined are calling on functions that supposedly don't exist, yet they are clearly in the code and can be applied anywhere. I also checked the syntax errors in google chrome and they state: Uncaught SyntaxError: Unexpected token else Uncaught reference error: go() is not defined Uncaught reference error: highscore() is not defined. So without further delay, here is the full code. Can anyone help me out? Code: <html> <head> <script type="text/JavaScript"> <!-- var sam = 9; var sally = 8; var donald = 4; function percentage (score) { return score / 10 * 100; }; function go() { document.write("Sam's score on the test is " + percentage(sam) + "%, <br \> Sally's score on the test is " + percentage(sally) + "%, <br \> Donald's score on the test is " + percentage(donald) + "%"); }; function highscore() { if (Math.max(90, 80, 40) === 90){ document.write("Sam's score was the highest.")}; else if (Math.max(90, 80, 40) === 80){ document.write("Sally's score was the highest.")}; else{ document.write("Donald's score was the highest.")} }; //--> </script> </head> <body> <input type="button" onclick="go()" value="Student Grades"> <br \> <input type="button" onclick="highscore()" value="Highest Score"> </body> </html> I am trying to use a user defined function and text area for a project, but nothing is showing up in the text area when i click the button. Code: <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <script type="text/javascript"> function Greet() // Assumes: firstNameBox and companyName contain names // Results: writes a message with those names in messageArea { firstName = document.getElementById("firstNameBox").value; companyName = document.getElementById("companyNameBox").value; message = "To whom it may concern, my name is " + firstName + ", I am very interested in the job opening at, " + compnayName + ". I feel that I would greatly contribute to " + companyName + " success. I feel I fit the requirements needed to become an employee at " + companyName + ". I look forward to hearing from you."; document.getElementById("messageArea").value = message; } </script> </head> <body> <p> Enter your first name: <input type="text" id="firstNameBox" size="15" /> <br /> Enter the Company name: <input type="text" id="companyNameBox" size="15" /> </p> <p> <input type="button" value="Click for Greeting" onclick="Greet();" /> </p> <p> <textarea id="messageArea" rows="4" cols="40"></textarea> </p> </body> I'm probably missing something simple here. I have this function called display: function display(name3,office3,officePH3,mobile3,email3) { document.getElementById('viewer').src=('Location_Files/')+(office3)+('.htm') } It's supposed to take 5 values and do various things with them. When I only had one parameter it worked fine, it took an office number which was the value of a listbox option and turned it into a path and then pointed an iframe to that path. Then I changed it so the value of the listbox option was 5 parameters separated by commas. Here's the listbox now: <select onchange="display(this.value)" multiple="multiple" id="People" name="People" style="border-style: none; height:260px; width:220px;"> <option value="test name,1656,phone,NONE,email">Loading</option> </select> You can see display is executed as "display(this.value)" so in theory it should take "test name,1656,phone,NONE,email" as its parameters and it should accept 1656 as the "office3" parameter. For some reason it's not working out that way, the function executes and the iframe changes but I get an unable to display webpage message like the path is broken. Can anyone see what I'm doing wrong? I have added an event listener to a LI item in the DOM: liNode.addEventListener("mouseover", mouseOn, true); The mouseOn function: function mouseOn(e) { // Test for IE or Firefox var e = (!e)?window.event:e; var yPos; if (e.pageY) { yPos = e.pageY; } else { yPos = e.clientY; } } I would like to pass in another parameter to the mouseOn function in addition to the event that is passed in automatically. Is there a way to do this? i keep getting error Call to undefined function codeandurl() below is my code PHP Code: <?php $value= strip_tags(get_field('link',$post)); $resultid=get_field('resultid',$post); codeandurl($resultid,$value); ?> <div id="result"></div> <script type="text/javascript"> function codeandurl(resultid,url){ $( "#result" ).text(resultid); $( "#result" ).dialog({ modal: true, buttons: { Ok: function() { $( this ).dialog( "close" ); } } }); window.open(url); return false; } </script> Hi, This button changes the button text when clicked, but it is always calling the same function. How to make the button depending on the button text to call different functions on onclick? [CODE] <script type = "text/javascript"> function button_switch(){ if (document.switch_form.switch_b.value == "Adam"){ document.switch_form.switch_b.value="Eva"; } else{ document.switch_form.switch_b.value = "Adam"; } } </script> <form name = "switch_form"> <input type = "button" name = "switch_b" id = "switch_b" value = "Adam" onclick = "button_switch()" /> </form> [CODE] My javascript quits working when I am rendering the html? (It works perfectly fine if the page is opened from http address directly). I did some research and concluded that "JavaScript is executed on page load", so when I render my html, my JavaScript functions are not automatically called. My question is how should I call the javascript functions manually? verify.html: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML> <HEAD> <Title>form</Title> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <link rel="stylesheet" type="text/css" href="xupload.css"> </HEAD> <BODY> <form id="myform" enctype="multipart/form-data" action="/cgi-bin/upload.cgi" method="post" onSubmit="return StartUpload(this);"> <DIV id="div1"> <b><font id='x_max_files'>?</font> files <font id='x_max_size'>?</font> Mb total maximum</b> <div id="upload_input"><input id="my_file_element" type="file" name="file_1" size=58></div> <div id="files_list"></div> <p align=center><input type="submit" value="Upload Files" class="myForm" id="submit_btn"></p> </DIV> </form> <iframe src="javascript:false;" name="xupload" style="position:absolute;left:-9999px;"></iframe> <script type="text/javascript"> //Specify your form ID var x_form_id = 'myform'; var x_mode = 1; var x_tmpl_name = ''; </script> <script src="xupload.js" type="text/javascript"></script> </BODY> </HTML> config file: Code: htmlverify = "../verify.html" Perl: Code: if(my $verifypage = $g->{CV}{htmlverify}) { # passing variables xxxxx .... # render the page: send_header(); $p->pf($verifypage); } Hello, very simple code block is below. Javascript functions that call web service methods are working when I called them between form tags. But they are not working at the beginning of the page. I specified lines that are not working below. Please help. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script type="text/javascript"> function GetMyName() { WebService1.GetName(onNameSuccess, onNameFailure); } function onNameSuccess(result) { return result; } function onNameFailure(result) { alert("There is an error"); } function GetMySurname() { WebService1.GetSurname(onSurnameSuccess, onSurnameFailure); } function onSurnameSuccess(result) { return result; } function onSurnameFailure(result) { alert("There is an error"); } //JAVASCRIPT FUNCTIONS ARE NOT WORKING HERE //THESE TWO LINES ARE NOT WORKING var name = GetMyName(); var surname = GetMySurname(); </script> </head> <body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> <Services> <asp:ServiceReference Path="WebService1.asmx" /> </Services> </asp:ScriptManager> //JAVASCRIPT FUNCTIONS ARE WORKING HERE </form> </body> </html> The simplified code below works, and should give you an idea of what Im trying to achieve. The final version will have dozens of input fields so you can see why the below method stinks Code: <html><head><title>Values</title> <script type="text/javascript"> <!-- function getid() { var myNum = document.frm1.field1.value; if(myNum == "A"){ document.frm1.field2.value = "1" } else if(myNum == "B"){ document.frm1.field2.value = "2" } else { document.frm1.field2.value = "" } var myNum2 = document.frm1.field3.value; if(myNum2 == "A"){ document.frm1.field4.value = "1" } else if(myNum2 == "B"){ document.frm1.field4.value = "2" } else { document.frm1.field4.value = "" } } //--> </script> </head><body> <form name="frm1" id="frm1"> <input type="text" size="40" name="field1" id="field1" onChange="JavaScript:getid();" /><input type="text" size="4" id="field2" name="field2" /> <br> <input type="text" size="40" name="field3" id="field3" onChange="JavaScript:getid();" /><input type="text" size="4" id="field4" name="field4" /> <br> </form> </body> </html> Each text input will have A or B written in by the user, which should automatically place that letters associated ID in its partner field. If any other letter is entered the ID will automatically be left blank. With the above code I'd need to repeat it over and over for each of the dozens of input fields. The final version wont be using simply A/B either but around 50 possible inputs each with their own ID which would make around 1000 possible variations. What am I missing here that will simplify the process? Thanks Hi, I am facing a problem in passing replace() function as an argument in user defined java function, can any one help me how to resolve it? intention is to pass a file path to my user defined function, but before passing the path i want to replace the character '\' to '\\' I am posting my javascript function he <a href="#" onclick="OpenDocPreview('<%# Eval("PATH")%>'.replace(/\\/g,"\\\\"), '<%# Eval("Filename")%>')"><%# Eval("DocTitle") %></a> function OpenDocPreview(url, docname) { alert('message from search base : ' + url + ' ' + docname); } thank you, Im having problems with this code working as it should. the top banner is supposed to cycle the second banner is supposed to be random the 3rd is a slide show that is supposed to work in order Everything works in random order. Any help would be appreciated. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>HTML and JavaScript</title> <script type="text/javascript"> var imgArray=new Array(4); imgArray[0]= new Image; imgArray[0].src="lions3.gif"; imgArray[1]= new Image; imgArray[1].src="tigers3.gif"; imgArray[2]= new Image; imgArray[2].src="bears3.gif"; imgArray[3]= new Image; imgArray[3].src="ohmy3.gif"; var index=0 function startup() { cycle(); select(); return } </script> <script type="text/javascript"> function cycle() { document.banner.src= imgArray[index].src; index++; if (index==4) { index=0; } setTimeout("cycle()",1000); return; } </script> <script type="text/javascript"> function select() { index=Math.floor(Math.random()*4); document.banner1.src=imgArray[index].src; setTimeout("select()",2000); return; } </script> <script type="text/javascript"> function doBack() { if (index>0) { index--; document.slideshow.src=imgArray[index].src; } return; } function doNext() { if (index<3) { index++; document.slideshow.src=imgArray[index].src; } return; } </script> </head> <body onload="startup()";> <center><img name="banner" src="lions3.gif" id="banner"> <div align="center"><img name="banner1" src="tigers3.gif" id="banner1"></div> </center> <div align="center"> <h2>My JavaScript Slideshow</h2> <p><img name="slideshow" src="lions3.gif"></p> <p><a href="javascript:doBack()">Back</a> * * * * <a href="javascript:doNext()">Next</a></p> </div> </body> </html> Hi, i have got this piece of code: Code: var f = []; var x = 1; f[0] = function(){alert(x);}; var x = 2; f[1] = function(){alert(x);}; f[0](); f[1](); I would like to display the number 1 at first and then 2. but this code produces number 2 for both alerts. I was able to achieve what i want with "new" constructor when creating functions but this is not a good practice and after all i am passing these functions as an event handler and it cant be done with "new" keyword because it is throwing error. I think there are some solutions with arrays e.g the x would be an array of numbers, but i don't like it. Am i missing something important? Thanks for your replies. Hello, so I'm trying to call multiple functions with onClick. It doesnt really work, just wondering why. Advice or tips would be nice, thank you guys for your time. By the way this is a project for school so the comments are for my professor Code: <head> <title>Untitled Document</title> <script type="text/javascript"> //hello, this code doesn't work, I did it piece by piece so the bits work, but when I combined them, it stopped working function texter(newText){ var oldHTML = document.getElementById('outputPrompt').innerHTML; document.getElementById('outputPrompt').innerHTML = newText+"<br />"+oldHTML; console.log(newText); } // texter function from class function menuMain(){ var userInput = document.getElementById('input').value; var mainMenu; if (userInput == "3"){ mainMenu = menuThree(); } else if (userInput== "2") { mainMenu = menuTwo(); } else if (userInput== "1") { mainMenu = menuOne(); } texter(mainMenu) } //going to the functions by calling them function menuOne(){ var userInput = document.getElementById('input').value; if (userInput.length == 0){ texter("You need to enter something in the input box"); } else { texter("the string has been saved"); } } // if the length is equal to zero then there was nothing inputted function menuTwo() { var userInput = document.getElementById('input').value; var theArray = userInput.split(/\s|\n|\r/); //split string into words array i looked up the regex on coding forums //also had help to create this from coding forums var WordsFound = [i]; for (var i=0; i<theArray.length-0; i++) { if (theArray[i].length < 5) { WordsFound.push('eep- '+theArray[i]); } else { if (theArray[i].length > 5) { WordsFound.push(theArrray[i]+' -zzz'); } else { WordsFound.push(theArray[i]); } } } document.getElementById('outputPrompt').innerHTML = WordsFound.join('<br>'); } // if the array length is less than five the word will push it onto the array // vise versa with the array length being more than five //then i join the word with the array function menuThree() { var userInput = document.getElementById('outputPrompt').reset(); } //reset the output function combineFunctions() { menuMain(); menuOne(); menuTwo(); menuThree(); } // combining the functions into one function so i can call it on onclick function cleartext(){ document.getElementById('input').value=""; } </script> </head> <body> <h1>RoboSpeek</h1> <textarea type='text' id='input' onfocus="cleartext()" cols="40"rows="10" wrap="physical"> Please enter 1,2,3 or Exit</textarea><br /> <input type='button' onclick='combineFunctions()' value='submit'/> <p id='outputPrompt'>Please enter 1,2,3 or exit only</b> </p> </body> </html> hey all, I am now at the point of being able to see the light at the end of the tunnel (woot!). After a lot of help from you guys I have tackled my RSS feed issue (sort of) to the point where i have a page that does basically what I need it to (http://www.the-rational-investor.com/test042311.php/). I now need to incorporate this java script developed into the big picture and of course, there seems to be problems. Since I know it works on its own, I must be running into problems getting all the functions working simultaneously and I once again need to call on the board's brilliance in figuring out what I am doing wrong....so here it goes I have taken out a lot of unnecessary code just to focus on the java script. Yes there is PHP code embedded but please don't beat up on me too much for that. here is the main page code: Code: <head> <? // function for onmouseover to do ALL THREE tasks // ?> <script type="text/javascript"> function doChanges(y){ var z= y; var imagevar = myimages[z]; var imagethis = this.href; changeimage(imagevar,imagethis); changetext(z); var x=y; var rssfeedvar = myArrayRssFeed[x]; showRSS(rssfeedvar); } </script> <? // First Task - function for onmouseover TEXT // ?> <script type="text/javascript"> function changetext(z){ var s= z; var textchangeEntries = myArrayEntries[s]; var id = document.getElementById("DBtext_large"); id.innerHTML=textchangeEntries; var textchangeWebadr = myArrayWebadr[s]; var id = document.getElementById("DBtext_link").getElementsByTagName('a')[0]; id.nodeValue=textchangeWebadr; id.setAttribute('href',textchangeWebadr); id.innerHTML=textchangeWebadr; var textchangeEmail = myArrayEmail[s]; var id = document.getElementById("DBtext_email"); id.innerHTML=textchangeEmail; var textchangeRssUrl = myArrayRssUrl[s]; var id = document.getElementById("DBtext_rssUrl"); id.innerHTML=textchangeRssUrl; var textchangeRssFeed = myArrayRssFeed[s]; var id = document.getElementById("DBtext_rssFeed"); id.innerHTML=textchangeRssFeed; } </script> <? // Second Task - functions for onmouseover IMAGES // ?> <script type="text/javascript"> function changeimage(towhat,url){ if (document.images){ document.images.targetimage.src=towhat.src gotolink=url } } function warp(){ window.location=gotolink } </script> <script type="text/javascript"> var myArrayEntries = ["<?php echo implode('","',$map_entry_array);?>"]; var myArrayWebadr = ["<?php echo implode('","',$web_adr_array);?>"]; var myArrayEmail = ["<?php echo implode('","',$email_adr_array);?>"]; var myArrayRssUrl = ["<?php echo implode('","',$rss_url_array);?>"]; var myArrayRssFeed = ["<?php echo implode('","',$rss_feed_array);?>"]; var myimages=new Array() var gotolink="#" function preloadimages(){ for (i=0;i<preloadimages.arguments.length;i++){ myimages[i]=new Image() myimages[i].src=preloadimages.arguments[i] } } preloadimages(<?echo("$qs1");?>); </script> <? // Third Task - functions for onmouseover RSS FEED // ?> <script type="text/javascript"> function showRSS(str) { if (str.length==0) { document.getElementById("rssOutput").innerHTML=""; return; } if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("rssOutput").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","getrss.php?q="+str,true); xmlhttp.send(); } </script> </head> getrss.php is unchanged Code: <?php //get the q parameter from URL $q=$_GET["q"]; //find out which feed was selected if($q=="http://twitter.com/statuses/user_timeline/53777622.rss") { $xml=("http://twitter.com/statuses/user_timeline/53777622.rss"); } elseif($q=="http://www.autisticsociety.org/rss/news2.php") { $xml=("http://www.autisticsociety.org/rss/news2.php"); } elseif($q=="http://sableresources.com/news/") { $xml=("http://sableresources.com/news/"); } elseif($q=="http://www.northgateminerals.com/rss/pressrelease.aspx") { $xml=("http://www.northgateminerals.com/rss/pressrelease.aspx"); } elseif($q=="http://www.thompsoncreekmetals.com/s/RSS.asp?MaxItems=4&Version=RSS2.0") { $xml=("http://www.thompsoncreekmetals.com/s/RSS.asp?MaxItems=4&Version=RSS2.0"); } elseif($q=="http://www.imperialmetals.com/s/RSS.asp?MaxItems=10&Version=RSS2.0") { $xml=("http://www.imperialmetals.com/s/RSS.asp?MaxItems=10&Version=RSS2.0"); } elseif($q=="http://investorrelations.walterenergy.com/corporate.rss?c=71978&Rule=Cat=news~subcat=ALL") { $xml=("http://investorrelations.walterenergy.com/corporate.rss?c=71978&Rule=Cat=news~subcat=ALL"); } elseif($q=="http://www.teck.com/framework/comp.aspx?portalName=tc&id=133613&rss=1") { $xml=("http://www.teck.com/framework/comp.aspx?portalName=tc&id=133613&rss=1"); } elseif($q=="http://www.tasekomines.com/tko/RSS.asp?MaxItems=10&Version=RSS2.0") { $xml=("http://www.tasekomines.com/tko/RSS.asp?MaxItems=10&Version=RSS2.0"); } elseif($q=="http://www.rocamines.com/s/RSS.asp?MaxItems=10&Version=RSS2.0") { $xml=("http://www.rocamines.com/s/RSS.asp?MaxItems=10&Version=RSS2.0"); } elseif($q=="http://www.breakwater.ca/rss/pressrelease.aspx") { $xml=("http://www.breakwater.ca/rss/pressrelease.aspx"); } $xmlDoc = new DOMDocument(); $xmlDoc->load($xml); //get elements from "<channel>" $channel=$xmlDoc->getElementsByTagName('channel')->item(0); $channel_title = $channel->getElementsByTagName('title') ->item(0)->childNodes->item(0)->nodeValue; $channel_link = $channel->getElementsByTagName('link') ->item(0)->childNodes->item(0)->nodeValue; $channel_desc = $channel->getElementsByTagName('description') ->item(0)->childNodes->item(0)->nodeValue; //output elements from "<channel>" echo("<p><a href='" . $channel_link . "'>" . $channel_title . "</a>"); echo("<br />"); echo($channel_desc . "</p>"); //get and output "<item>" elements $x=$xmlDoc->getElementsByTagName('item'); for ($i=0; $i<=2; $i++) { $item_title=$x->item($i)->getElementsByTagName('title') ->item(0)->childNodes->item(0)->nodeValue; $item_link=$x->item($i)->getElementsByTagName('link') ->item(0)->childNodes->item(0)->nodeValue; $item_desc=$x->item($i)->getElementsByTagName('description') ->item(0)->childNodes->item(0)->nodeValue; echo ("<p><a href='" . $item_link . "'>" . $item_title . "</a>"); echo ("<br />"); echo ($item_desc . "</p>"); } ?> Thanks again for all your wonderful help and all the best to you and your families on this Easter weekend, Brian Hello, I am new to javascript and have managed to create the below form with few fields validation that is working. I also have an email format validation function which is not working. Any help would be hightly appreciated. Below with the form with the javascript <html> <script language="JavaScript" type="text/javascript"> <!-- var radio_selection=""; function checkform ( form ) { **// ** START ** **if (form.name.value == "") { ****alert( "Please enter your name." ); ****form.name.focus(); ****return false; **} if (form.Phone.value == "") { ****alert( "Please enter your phone number." ); ****form.Phone.focus(); ****return false; **} **if (form.email.value == "") { ****alert( "Please enter your email." ); ****form.email.focus(); ****return false; } if (radio_selection=="") { alert("Please indicate your attendance."); return false; } *// ** END ** **return true; } function checkEmail(form) { if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(form.email.value)) { return true; } alert("Invalid E-mail Address! Please re-enter."); return false; } //--> </script> <body> <form style="font-family:lucida calligraphy;font-size:120%;color:maroon" action="invitees.php" method="post" onsubmit="return checkform(this);checkEmail(this.email.value);"> <table cellspacing="5" cellpadding="5" border="0"> <tr> <td valign="top" > <style="font-family:lucida calligraphy;font-size:100%;color:maroon">Name: </td> <td valign="top"> <input type="text" name="name" id="name" size="40" value="" /> </td> </tr> <tr> <td valign="top"> Phone Number </td> <td valign="top"> <input type="text" name="Phone" id="Phone" size="40" value="" /> </td> </tr> <tr> <td valign="top"> Email Address: </td> <td valign="top"> <input type="text" name="email" id="email" size="40" value="" /> </td> </tr> <tr> <td valign="top"> Will You Attend </td> <td valign="top"> <input type="radio" name="Attendance" id="Attendance_0" value="Yes" onClick="radio_selection='yes'" /> Yes <input type="radio" name="Attendance" id="Attendance_1" value="No" onClick="radio_selection='no'"/> No <input type="radio" name="Attendance" id="Attendance_2" value="Maybe" onClick="radio_selection='maybe'"/> Maybe<br/> </td> </tr> <tr> <td valign="top"> Adults <select name ="adults" id="Adults" > <option>0</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> <option>6</option> <option>7</option> <option>8</option> <option>9</option> <option>10</option> </select> </td> <td valign="top"> Kids <select name="kids" id="Kids" > <option>0</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> <option>6</option> <option>7</option> <option>8</option> <option>9</option> <option>10</option> </select> </td> </tr> <tr> <td valign="top"> Post a Note </td> <td valign="top"> <textarea name="Note" id="Note" rows="6" cols="35"></textarea> </td> </tr> <tr> <td colspan="3" align="center"> <input type="submit" value=" Submit Form " /> </td> </tr> </table> </form> </html></body> |