JavaScript - Shouldn't This Function Accept Multiple Parameters?
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? Similar TutorialsI cannot get an address entered on a form to validate unless I leave out the space between the number and the street name. The second line of the function shows the characters that it will accept. Every way I tried to add a space to that list doesn't work. function isAlphanumeric(elem, helperMsg){ var alphaExp = /^[0-9a-zA-Z]+$/; if(elem.value.match(alphaExp)){ return true; }else{ alert(helperMsg); elem.focus(); return false; } } (This is from a tutorial I'm studying to learn how to do validation. It seems strange that the folks who put this thing together don't know there's a space between the house number and the street name. Or does that only apply to my street?) Any ideas, J Hi, I am making a function that executes code as AJAX readyState's are returned... If readyState = 3 then I running code through eval but I want to be able to run functions with parameters, within the parameter that is evetually executed by the eval Heres abit of pseudo code of what I am talking about Code: function receiveRequest(whileLoading, whenDone) { // AJAX stuff... blah... blah... blah... if request is being processed: eval(whileLoading) if request is done: eval(whenDone) } // When a button is clicked: onClick="receiveRequest('alert('loading')', 'alert('finished AJAX request')')" But this doesn't work because I am escaping the first parameter of 'receiveRequest' in the alert() but if I use double quote (") I will be escaping the event handler Is there anyway to get around this / or a better way to fix it? I haven't used Javascript in agggeeesss and I can barely remember anything anymore - PHP <3 Thanks in advanced. I am to make a showresults function, purpose is for results 4 parameters are in function, race, name,party and votes i then declare variable named totalV equal to value of returned by the totalVotes() function useing votes as parameter value then write HTML code to document this is the code I came up with Code: function showResults(race,name,party,votes) { // script element to display the results of a particular race var totalV = totalVotes(votes); document.write("<h2>" + race + "</h2>"); document.write("<table cellspacing='0'>"); document.write("<tr>"); document.write("<th>Candidate</th>"); document.write("<th class ='num'>Votes</th>"); document.write("<th class='num'>%</th>"); document.write("</tr>"); } How does this look so far? 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! 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? Hey there, I started learning Javascript about five weeks ago when I started my University course, and I have been doing above averagely in the little mini-tests, but now I am on coursework I have been having trouble getting past the most simple thing, and I can't help think that I'm just approaching the issue from the wrong angle in my head. I'm not asking to be spoon-fed the answers from veteran coders or cheating because that just defeats the point of learning. In fact I actively discourage anyone from posting a direct answer to this question. However I would like some assistance in the kind of thinking that would help me in term of creating a function like this; Name of function and parameters: index(string,pattern,caseSensitive) "Where pattern starts in string (or -1 if it is not found), return the index. The search needs to be case sensitive if the third parameter is true else it is case insensitive." (Where underlined and italics are parameter names) I know how to create functions in general, however I cannot get my head around the fact that the parameters are supposed to represent something, and it is required for me to program something without knowing what the parameters represent. I know it's simple and I'm probably thinking about it the wrong way. If anyone could assist me I would be grateful. I wrote a script that creates 2 absolutely positioned divs, in perfect alignment, one on top of the other. I want to use javascript to manipulate the display property of each div to show one div at a time by toggling each div's display property between none and block with an onClick event handler attached to the link. This script works fine when the javascript function has no parameters, because the div id's are inserted directly into the getElementById function. When I say it works, I mean the div with id=cal2 displays onload, then disappears when the Show Calendar link is clicked. The div that appears in its place has a link that does the reverse when clicked. I want to create multiple pairs of overlapping divs that toggle their visibility, so I want to put parameters inside the functions that identify the specific pair of divs that need to be toggled per function call. When I try to use variables/parameters in the functions to insert specific div id's into getElementById, it does not work. PLEASE NOTE, the code below has div id's in green that don't have quotes of any kind. It still works in my firefox browser. I thought id's needed quotes, but it works without. I don't know why. The code below works, but has no parameters in the functions: Code: <!DOCTYPE html> <xhtml> <head> <title>Practice Calendar</title> <style type="text/css"> .practicecalendar { position: absolute; top: 0px; left: 0px; margin: 0; width: 18em; background: #B3FF99; text-align: center; } .practiceschedule { position: absolute; top: 0px; left: 0px; margin: 0; width: 18em; background: #99E6FF; text-align: center; } </style> <script type="text/javascript"> <!-- function showSchedule(){ document.getElementById('sch2').style.display = 'block'; document.getElementById('cal2').style.display = 'none'; } function showCalendar(){ document.getElementById('cal2').style.display = 'block'; document.getElementById('sch2').style.display = 'none'; } //--> </script> </head> <body> <div id= cal2 class='practicecalendar' style=' display: block; '> <p>Calendar</p> <p><a href='' onClick='showSchedule(); return false'>Show Schedule</a></p> </div> <div id= sch2 class='practiceschedule' style=' display: none; '> <p>Schedule</p> <p><a href='' onClick='showCalendar(); return false'>Show Calendar</a></p> </div> </body> </xhtml> When I add the information in red to the same script above, I get the script below that does not work. Code: <!DOCTYPE html> <xhtml> <head> <title>Practice Calendar</title> <style type="text/css"> .practicecalendar { position: absolute; top: 0px; left: 0px; margin: 0; width: 18em; background: #B3FF99; text-align: center; } .practiceschedule { position: absolute; top: 0px; left: 0px; margin: 0; width: 18em; background: #99E6FF; text-align: center; } </style> <script type="text/javascript"> <!-- function showSchedule( sch,cal ){ document.getElementById( 'sch' ).style.display = 'block'; document.getElementById( 'cal' ).style.display = 'none'; } function showCalendar( cal,sch ){ document.getElementById( 'cal' ).style.display = 'block'; document.getElementById( 'sch' ).style.display = 'none'; } //--> </script> </head> <body> <div id= cal2 class='practicecalendar' style=' display: block; '> <p>Calendar</p> <p><a href='' onClick='showSchedule( 'sch2','cal2' ); return false'>Show Schedule</a></p> </div> <div id= sch2 class='practiceschedule' style=' display: none; '> <p>Schedule</p> <p><a href='' onClick='showCalendar( 'cal2','sch2' ); return false'>Show Calendar</a></p> </div> </body> </xhtml> When I remove the single quotes from the blue code , it does not work either. Code: <!DOCTYPE html> <xhtml> <head> <title>Practice Calendar</title> <style type="text/css"> .practicecalendar { position: absolute; top: 0px; left: 0px; margin: 0; width: 18em; background: #B3FF99; text-align: center; } .practiceschedule { position: absolute; top: 0px; left: 0px; margin: 0; width: 18em; background: #99E6FF; text-align: center; } </style> <script type="text/javascript"> <!-- function showSchedule(sch,cal){ document.getElementById('sch').style.display = 'block'; document.getElementById('cal').style.display = 'none'; } function showCalendar(cal,sch){ document.getElementById('cal').style.display = 'block'; document.getElementById('sch').style.display = 'none'; } //--> </script> </head> <body> <div id=cal2 class='practicecalendar' style=' display: block; '> <p>Calendar</p> <p><a href='' onClick='showSchedule( sch2,cal2 ); return false'>Show Schedule</a></p> </div> <div id=sch2 class='practiceschedule' style=' display: none; '> <p>Schedule</p> <p><a href='' onClick='showCalendar( cal2,sch2 ); return false'>Show Calendar</a></p> </div> </body> </xhtml> Thanks for reading all of this. Does anyone know what I'm missing? Hello, On some pc's in IE my website shows disbehaviour with the popup-menu. When your mousepointer hoovers over the transparent border, the popupmenu disappears. Please check http://www.exintec.nl/test. Perhaps if you visit the website with Internet Explorer you can see what I mean, but it might be showing good as well. The menu is made with very little javascript and mainly CSS. I discovered the begin of the cause: when I don't use a transparent color for the border, it works fine. Also when I remove the underlying image (the sky-image) and still use transparent color it also works fine. How can this be? Using Z-index for the popup-window/menu and give it a real high number won't work. I really don't see it. Ofcourse I want to keep using the transparent color and the underlying image. ------------------- Source code HTML: --------------------- <ul id="menu"> <li onmouseover="toonPopUpMenu1()" onmouse-out="verwijderPopUpMenu1()"><a href="index.html" class="selected">OVER E<font co-lor="#548DD4">X</font>INTEC</a></li> <li onmouseover="toonPopUpMenu2()" onmouse-out="verwijderPopUpMenu2()"><a href="afdelingen.html">DIENSTEN</a></li> <li onmouseover="toonPopUpMenu3()" onmouse-out="verwijderPopUpMenu3()"><a href="waterstof_injectie.html">PROJECTEN</a></li> <li><a href="werkwijze.html">WERKWIJZE</a></li> <li><a href="contact.html">CONTACT</a></li> </ul> <ul id="popupmenu1" onmouseover="toonPopUpMenu1()" onmouse-out="verwijderPopUpMenu1()"> <li><a href="index.html" class="selected">Bedrijf</a></li> <li><a href="visie.html">Visie</a></li> <li><a href="missie.html">Missie</a></li> </ul> ----------- CSS-code ----------- #popupmenu1 { position: absolute; top: 25px; left: 141px; color: #FFFFFF; display: none; } #popupmenu1 li { border-bottom: solid transparent 4px; list-style-type: none; } #popupmenu1 li a { padding-left: 4px; padding-right: 0px; padding-bottom: 1px; padding-top: 1px; background-color: #000000; display: block; width: 155px; height: 20px; text-decoration: none; text-align: left; font-weight: 400; color: #FFFFFF; line-height: 20px; } #popupmenu1 li a.selected { font-weight: 900; } #popupmenu1 li a:hover { font-weight: 900; color: #FFFFFF; } ----------------- JS: ----------------- function toonPopUpMenu1() { var PopUpVenster=document.getElementById('popupmenu1'); PopUpVenster.style.display = 'block'; } function verwijderPopUpMenu1() { var PopUpVenster=document.getElementById('popupmenu1'); PopUpVenster.style.display = 'none'; } Hi all, I'm new to javascript and am having a few issues. I have a function that I want to run with multiple onchange events. My page has several image selection buttons and I want it to preview the image when/if each one is selected. I have gotten it working for the first on the page but cannot for the remainder. Is this possible or am I wishful thinking? Foster Reply With Quote 01-17-2015, 10:23 AM #2 Arbitrator View Profile View Forum Posts Senior Coder Join Date Mar 2006 Location Splendora, Texas, United States of America Posts 3,423 Thanks 32 Thanked 293 Times in 287 Posts Originally Posted by Foster I'm new to javascript and am having a few issues. I have a function that I want to run with multiple onchange events. My page has several image selection buttons and I want it to preview the image when/if each one is selected. I have gotten it working for the first on the page but cannot for the remainder. Is this possible or am I wishful thinking? Where's the code? If you simply want to assign multiple listeners for the same event on a single element, use element.addEventListener("change", eventHandler) instead of element.onchange = eventHandler or <element onchange="eventHandler();"></element>. hello, I posted a threat a couple of days ago, but i got no answer. I guess it was just too messy. So i'm trying over again. You might therefore have a little deja vu, but still, any help will be greatly appreciated. I need this function to work on all my div, separately, on loading. here is the function: Code: <script> // Random Position Script var xxx = Math.floor(Math.random()* (pageWidth()-230)); var yyy = Math.floor(Math.random()* (pageHeight()-50)); function start() {var x = (posLeft()+xxx) + 'px'; var y = (posTop()+yyy) + 'px'; moveObjTo('myobj',x,y); setObjVis('myobj','visible');} window.onload = start; window.onscroll = start;// JavaScript Document </script> At the moment, the function is working on one object ('myObj'). I laced all my documents into separate divs and i need them all (and seperatly) to load on a random position at start. So i need to write in something that makes this function keep on going for all my objects. It might seem like a very dumb question, but 'm just starting with javascript, so not much of a coder yet. Hope you can help o this one. nice day to everybody! Hi All, Im currently working on a bidding application built within ASP.Net and i have found this javascript snippet to only allow numeric values in the desired <asp:textbox> which is working fine, but i want to allow the user to add a decimal place. For example, say the bid is 1.50 they should be allowed to enter 1.51 but as i cant imput (.) i end up putting in 151 heres the snippet it may be a slight modification but im new to javascript so any help of knowledge will be highly appreciated Code: function isNumberKey(evt) { var charCode = (evt.which) ? evt.which : event.keyCode if (charCode > 31 && (charCode < 48 || charCode > 57)) return false; return true; } thanks in advance Hey everyone, I am attempting to use some code from the website Dynamic Drive and the page can be found here. http://www.dynamicdrive.com/dynamici...acceptterm.htm Basically it is javascript code that requires people to check a box before being able to submit a forum. I implemented the code into my site just fine. However I want to be able to use a image submit button rather than a submit button. Since I am not proficient with Javascript I have no idea where to go from here or how to change it to work with an image/paypal button. Here is the code I have so far. Script at top of the page Code: <script> //"Accept terms" form submission- By Dynamic Drive //For full source code and more DHTML scripts, visit http://www.dynamicdrive.com //This credit MUST stay intact for use var checkobj function agreesubmit(el){ checkobj=el if (document.all||document.getElementById){ for (i=0;i<checkobj.form.length;i++){ //hunt down submit button var tempobj=checkobj.form.elements[i] if(tempobj.type.toLowerCase()=="submit") tempobj.disabled=!checkobj.checked } } } function defaultagree(el){ if (!document.all&&!document.getElementById){ if (window.checkobj&&checkobj.checked) return true else{ alert("Please read/accept terms to submit form") return false } } } </script> Form Code: <form name="agreeform" onSubmit="return defaultagree(this)" action="https://urlhere.com" method="post"> <input name="agreecheck" type="checkbox" onClick="agreesubmit(this)"><b>I agree to the above terms</b><br> <input type="Submit" value="Submit!" disabled> <!--<input type="image" src="https://www.webpage.com" border="0" name="I2" alt="PayPal - The safer, easier way to pay online!">--> </form> <script> //change two names below to your form's names document.forms.agreeform.agreecheck.checked=false </script> Please note that the paypal button is commented out in this code as it doesn't work right now and the submit button works. I think the following code needs to be changed to a different check to check for a specific paypal button but I am not sure how to do it. Keep in mind I have four different paypal buttons on the same page so picking just this one is important. Code: if(tempobj.type.toLowerCase()=="submit") Any help with this would be greatly appreciated! Regards, Frank Hi everybody. I'm new to both Javascript and this site, so apologies if this isn't the right way to be asking this question. Here's what I'm trying to do. I've got two dropdown boxes ('language' and 'word'). When the submit button is pressed, I want a div to show with the right word in it. I can do this fine with one dropdown box, but two has got me stumped. Any ideas would be much appreciated. S Hi, I have a search function which works when I only want to have only one search per page, but as it involves a string call I'm not sure how to modify it to multiple search requests on a page. The below works fine for one call: Code: <script type="text/javascript"> function showHint(str){ if (str.length==0){ document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest){ xmlhttp=new XMLHttpRequest(); } else{ xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function(){ if (xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","getName.php?q="+str,true); xmlhttp.send(); } </script> </head> <body> <label>Search by name: </label> <input type="text" id="txt1" class="input" onkeyup="showHint(this.value)" /> <br /> <p>Suggestions: <span id="txtHint"></span></p> <br /> But if I want to do mulitple I have tried changing it to: Code: <script type="text/javascript"> function showHint(File,ID){ if (str.length==0){ document.getElementById(ID).innerHTML=""; return; } if (window.XMLHttpRequest){ xmlhttp=new XMLHttpRequest(); } else{ xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function(){ if (xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById(ID).innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET",File,true); xmlhttp.send(); } </script> </head> <body> <label>Search by firstname: </label> <input type="text" id="txt1" class="input" onkeyup="showHint('GetFirstName.php?q='+str,'txtHint')" /> <br /> <p>Suggestions: <span id="txtHint"></span></p> <br /> <label>Search by surname: </label> <input type="text" id="txt1" class="input" onkeyup="showHint('getLastName.php?q='+str,'txtHintSn')" /> <br /> <p>Suggestions: <span id="txtHintSn"></span></p> <br /> The above doesn't work and I am not sure what do about the showHint(str) as clearly I am not representing it properly in my attempt to modify the script. Hi, I have a problem with my script, I have a php request and the result is shown in a div, so there is several divs and their id is the "id" in the database, and I want that if we click on a link, it hides every divs... Here is how I tried to do that: Code: <script type="text/javascript"> function visibilite(thingId) { var targetElement; targetElement = document.getElementById(thingId) ; targetElement.innerHTML = "" ; } </script> Code: $hide = ""; while($ligne=mysql_fetch_array($ress)){ $hide.= "visibilite('$ligne[id]'); "; $return.= "<tr><td>$ligne[heure] - $ligne[fin]</td><td>$ligne[sport]</td><td>$ligne[salle]</td><td>$ligne[ville]</td><td>$dispo/$ligne[place]</td><td><div id=$ligne[id]>"; $return.= "<a href=# onClick=\"maFonctionAjax($ligne[id],$tennis); $hide return false\">Reserver</a>"; $return.= "</div></td></tr>"; } Every div'id is the id in the database, with the onClick we call an ajax function and $hide which is the call for the function visibilite for each div It works for some request, I don't know how is it possible because I can have the same number of results and sometimes it works, and sometimes not... Does somebody can help me? Thanks a lot! Jeff Another homework assignment that I can't quite seem to get to work... I've been asked to do the following using javascript: -Create a function named randInt() with one parameter of "size". Declare a variable named "rNum" equal to a random integer between 1 and the value of the size variable. Return the value of the "rNum" varialbe from the function. -Create a function named getQuote() with one parameter anemd "qNum". The function should create an array named mtQuotes with five quotes; there should be no quote for the array index "0". Return the value of the mtQuotes array for the qNum index. - In the div element of "quotes" insert a script with the following commands: Declare a variable named "randValue" which is euqal to a random integer between 1 and 5 (use the randInt() function). Declare a variable named "quoteText" containing the quote whose array index value is equal to randValue. Write the value of quoteText to the web page. Here is what I have...it returns undefined. thanks. Code: <html> <head> <script type="text/javascript"> function randInt(size) { var rNum=Math.ceil(Math.random()*5); return(rNum); } </script> <script type="text/javascript"> function getQuote(qNum); var mtQuotes = new Array(); mtQuotes[0] = ""; mtQuotes[1] = "I smoke in moderation, only one cigar at a time."; mtQuotes[2] = "Be careful of reading health books, you might die of a misprint."; mtQuotes[3] = "Man is the only animal that blushes or needs to."; mtQuotes[4] = "Clothes make the man. Naked people have little or no influence on society."; mtQuotes[5] = "One of the most striking differences between a cat and a lie is that a cat has only nine lives."; return mtQuotes[qNum]; </script> </head> <body> <div id="quotes"> <script type="text/javascript"> var randValue=randInt(5); var quoteText=getQuote(randValue); document.write(quoteText); </script> </div> My problem is that i have multiple math calculations within different functions that have multiple switch statements that get calculated with an onclick="functionOne()" for each radio button and before i can calculate the outcome for some reason i must fully insert a value for every input as well as check every raidio button before i get to the end of my list. I wish to simply allow the user to fill out as many fields as he wishes leaving some bank without being restricted to do every single one.. Thank you in advance
Hi to All, I have a table that contains many rows, some in italian with code <td nome='riga_i'> and some in english with code <td name='row_e'>. I have created two buttons with different background flags: italy and uk, so when one pushes the button with flag uk, the html page will be reloaded with only english rows, and when one pushes the button with flag it, the same page is reloaded containing only italian rows. All the code posted here works well, but I think that the code can be better because to reach this result I had to dupplicate the same function and I don' t like this. Here the code: <html> <head> <script type="text/javascript"> function toggle(name) { tr=document.getElementsByTagName('tr') for (i=0;i<tr.length;i++){ if (tr[i].getAttribute(name)){ if (tr[i].style.display=='none'){tr[i].style.display = '';} else {tr[i].style.display = 'none';} } } } // function toggle(nome) { tr=document.getElementsByTagName('tr') for (i=0;i<tr.length;i++){ if (tr[i].getAttribute(nome)){ if (tr[i].style.display=='none'){tr[i].style.display = '';} else {tr[i].style.display = 'none';} } } } </script> </head> <body onload="toggle('name');"> <table> <tr nome="riga_i"> <td>REQUISITI RELATVI AL SERVIZIO</td> <td> </td> <td><input type="button" onclick="toggle('nome');toggle('name');" style="background-image: url(../images/flag_uk.jpg); background-color:Transparent;" /></td></tr> <tr name="row_e"> <td> </td> <td>REQUIREMENTS RELATED TO THE SERVICE</td> <td><input type="button" onclick="toggle('name');toggle('nome');" style="background-image: url(../images/flag_italy.jpg); background-color:Transparent;" /></td></tr> .... .... and so on.... ..... </table></html> To better the code I have tried in this way but without success ... <html> <head> <script type="text/javascript"> function toggle(this) { if (this=='nome' || this=='name'){ tr=document.getElementsByTagName('tr') for (i=0;i<tr.length;i++){ if (tr[i].getAttribute(this)){ if (tr[i].style.display=='none'){tr[i].style.display = '';} else {tr[i].style.display = 'none';} } } } } </script> </head> Thanks in advance !!! First off I didn't know whether to post this here or in the PHP section since it deals with both, but mostly JS. I have a PHP scraper that scrapes the job title, company name and location from a website and stores them in separate arrays. These values are then extracted out one at a time from the array and stored into a string, that is then passed to a Google Maps API. I can make this successfully happen once, the thing is I need to do it multiple times. I have an idea on what I should do but don't really know how to implement it (correctly). The idea I had was to create a function in the JavaScript section that accepts three values from PHP. This function would be called in my PHP for loop that extracts the values from the array into a string. The thing that confuses me is that the Map function is called via <body onLoad="initialize()">. Here's the link to my code |