JavaScript - Using Counter As Part Of Form Names
I have 2 questons.
1) Is there a way for the loop counter to loop while less then [a php variable]? 2) Is there a way to use a counter in the name of the form elements? Example, instead of "switchBox1" use: "switchBoxCounter" instead of "nameaddy1" use: "nameaddyCounter" Code: if(document.form1.switchBox1.checked) { document.form1.nameaddy1.style.backgroundColor = "#E5E5E5"; } else { document.form1.nameaddy1.style.backgroundColor = "#FFFFFF"; } Similar TutorialsHi everybody, I have a php file with an almost-standard html form. The not-so-standard part is that the name-attributes of the form elements are dynamically generated as such: PHP Code: <? for($i=0; $i<5; $i++) { ?> <input type="text" name="field_<? echo $i; ?>" /> <? } ?> Now I want to do some javascript validation on the fields, but I'm having a bit of trouble accessing the values of the fields. My current code is as follows: Code: var i = 0; var num = <? echo $step1_sag_faktura_num; ?>; for (i=0; i<num; i++){ window['file_' + i] = document.forms["nyisagform_step2"]["sag_fak_file_" + i].value; } But this doesn't seem to work. It gives no error message. It just validates true. Can somebody tell me a way to do this? I'm no good at javascript and the code above is pieced together by bit I found on the internet. Thanks in advance, deafdigit Hi I've got about 40 check-boxes on my 1 form. These check-boxes all have names (obviously) but they are NOT all unique names. The number of UNIQUE names on my form is probably around 8 or 9 (the actual number is NOT important). Because some check-boxes use the same names as other. It's set up this way, please don't ask me to change it, I can't change it. What's the syntax/method for looping through all the names? I was thinking I should do maybe a "for" loop; Code: for (var i = 0; i < fieldName.length; i++) But I don't know how to hold a variable of the unique names to start with. Can someone help please? I have a search form and added the "Clear All" Button functionality...but it clears the last part of the search form display preferences....how do I only clear the checkboxes at the top of the form only and not at the bottom of the form between the <DIV> tags? I have attached a copy of the JSP page. I am trying to use the Jquery loader (this ends when page loads) but I want it to load how many seconds the page took. (using the clean preloader) $( "#progressbar" ).progressbar({ value: setTimeout("seconds++",10000000) }); but getting "anything" to work in the "VALUE" has been such a pain. any one that knows how to create a timer to add to the value so that preload will keep loading? or if even possible? thanks Hey Everyone, I'm working on a counter. I have two images - each with their own click count. Right now each time the page loads the counter goes back to zero. I would assume I need some kind of server side coding. Any recommendations? Here's what I have so far. <html> <head> <script type="text/javascript"> var counter = 0; function increaseloveit() { counter += 1; document.getElementById('loveit').value = counter; } var counter = 0; function increasehateit() { counter += 1; document.getElementById('hateit').value = counter; } </script> </head> <body> <form> <a href="#" onclick="javascript:increaseloveit();"><input type="button" value="Love It!" name="loveit" onclick="" /></a><input id="loveit" value="0" size="2" /></form> <form> <a href="#" onclick="javascript:increasehateit();"><input type="button" value="Hate It!" name="hateit" onclick="" /></a><input id="hateit" value="0" size="2" /></form> </body> </html> So I'm really new to javascript and html. The most advanced thing Ive made was probably a Russian rullete simulator, but I need help with this one program Im working on. So if anyone could tell me whats wrong with this, I would appreciate it! <html> <head> <font size="4">Click the button below as many times as you can</font> <br> <script type="text/javascript"> var clicks=0 function count() { clicks=clicks+1; } </script> </head> <body> <input type="button" value="Click Me" OnClick="count()"> <br> <p>Clicks: <script type="text/javascript"> document.write(clicks); </script></p> </body> </html> I have the following codes and it seems to work well but when exiting the site and re-entering it resets the values to 0 again. I am not sure how to proceed with this, been considering cookies but what if the user clears there cookies, I then looked at PHP but not understanding that to well at this stage. Javascript Code: // Function to count clicks on links var clicks1 = 0; var clicks2 = 0; var clicks3 = 0; var clicks4 = 0; function link1(){ document.getElementById('clicked1').value = ++clicks1; } function link2(){ document.getElementById('clicked2').value = ++clicks2; } function link3(){ document.getElementById('clicked3').value = ++clicks3; } function link4(){ document.getElementById('clicked4').value = ++clicks4; } HTML Code: Code: <tr valign="middle" align="center"><td colspan="1"><a target="_blank" href="http://mistiquestormelectronics.webs.com/" onclick="link1()"><img src="site_graphics/reinet.jpg" alt="Mistique Storm" width="120" height="90" /></a></td> <td colspan="2" align="left"><p>For all your Electronic equipment needs.</p></td> <td colspan="1" width="8%"><input id="clicked1" style="color: #000000; font-weight:bold; border-style: none; font-family: arial; background-color: #00FF00; text-align: center;" readonly="readonly" size="10" onfocus="this.blur();" value="0" ></td></tr> Any ideas, suggestions. Please Help? I need help with a counter that will either display a different image everyweek or change text every week. The scenario is a counter will be on the top right corner of the page, and every week the number will change from 1 to 2 to 3... to 52... I searched on this forum for answers, i found some similar for a different day counter. Any help would be great! Hi All, could you please help me. A have a little program and i need to count somehow how many times a while loop is ran. how could i do that? Thanks for your help Hello, I am using javascript to dynamically edit a form and have run into some problems. In this excerpt of code "x" is already defined, "num" is already defined, and "eval(q)" is just pointing to the proper field in the proper form. Code: eval(q).onkeydown=function onkeydown(event) { checkLength(event,x,num,5); }; Now the problem is, it is literally calling the function with "x" and "num" instead of their values. I tried "eval(x)" and "eval(num)" but that literally calls it with that whole statement as the parameter. How can I call this with the actual values inside of x and num? Thank you. Hi Guys, Hope you can help. My sister has made a web site with a web counter and want to get the counter up by a few hundered. She cannot alter the number manually. Is there a script i can use to get the web counter up by a few hundred? So in other words a web page with java on so it gones on to her site (adds a count) leave it Or refresh it then reload it. Hope i have made my self Clear. thanx, Or even i culd run a web page which loads the page, closes it and load it again. Thanx. Lusa.. I have the following code but it is not even showing up in the browser. I am very new to JS and very willing to learn. The code was originally found on this site and I have tweaked it and now it doesn't work...Any assistance would be much appreciated. <script type = "text/javascript"> var seconds; var clockId; function startClock(seconds){ timeInSeconds = parseInt(seconds); clockId = setInterval("tick()",1000); } function runClock() { var seconds = timeInSeconds; if (seconds > 60) { // stop at "" seconds alert ("Your time is up!"); clearInterval(clockId); // stop counting return false; } else { timeInSecs++; } var hours= Math.floor(seconds/3600); seconds %= 3600; var mins = Math.floor(seconds/60); secs %= 60; var result = ((hours < 10 ) ? "0" : "" ) + hours + ":" + ( (mins < 10) ? "0" : "" ) + mins + ":" + ( (secondss < 10) ? "0" : "" ) + seconds; document.getElementById("countdown").innerHTML = result; } startClock(0); // start count at 0 seconds </script> <span id="countdown" style="font-weight: bold;"></span> Anybody help to start out this code: Create a "nag" counter that tells users to register. Save the counter in a cookie and display a message reminding users to register every fifth time they visit your site. There are four other parts to this task that I know how to do. I cannot find anything close to this in our book referencing a nag-counter or something similar to it. Thanks, in advance. Regards, AO5431 H, I'm trying to create an sms form. but I want the users to be able to monitor the characters and sms number as they type...taking 160 characters to be 1 page. pls I'll need help with coding this form to display characters left in 'ch_count' box and number of pages in the 'pages' box while typing in the 'message' textarea....hope it's clear enough...thanks Code: <p> <textarea name="message" cols="" rows="" id="message"></textarea> </p> <p> <input name="ch_count" type="text" id="ch_count" size="8" /> characters left <input name="pages" type="text" id="pages" size="8" /> pages </p> Hi, I have added a time counter in below code. This is used to track the total time of a project. If a person is going on break, then they will apply the break that stops the time counter. However, once they come back from break and end the break, then time is counting at double speed (two seconds instead at one second). Is there any mistake that I done that made the time counter to increment by 2 seconds instead of 1 second after break. Any help please.... Code: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> <title>Strategy One - Tracker</title> <link rel="stylesheet" href="style.css" type="text/css" media="screen" /> <!--[if IE 6]><link rel="stylesheet" href="style.ie6.css" type="text/css" media="screen" /><![endif]--> <!--[if IE 7]><link rel="stylesheet" href="style.ie7.css" type="text/css" media="screen" /><![endif]--> <!-- Script for Current time in text box --> <script type="text/javascript"> function GetDate() { var curDateTime = new Date() var curHour = curDateTime.getHours() var curMin = curDateTime.getMinutes() if(curHour<10) curHour = "0" + curHour if(curMin<10) curMin = "0" + curMin document.getElementById('start_time').value = curHour + ":" + curMin; var row = document.getElementById("end1_time"); var row1 = document.getElementById("start1_time"); row.style.display = 'none'; row1.style.display = 'none'; } </script> <!-- End of Script for Current time in text box --> <!-- Script for Current time in text box --> <script type="text/javascript"> function GetDate1() { var curDateTime = new Date() var curHour = curDateTime.getHours() var curMin = curDateTime.getMinutes() if(curHour<10) curHour = "0" + curHour if(curMin<10) curMin = "0" + curMin document.getElementById('end_time').value = curHour + ":" + curMin; var row = document.getElementById("start1_time"); var row1 = document.getElementById("end1_time"); var row2 = document.getElementById("start2_time"); var row3 = document.getElementById("end2_time"); row.style.display = 'none'; row1.style.display = 'none'; row2.style.display = 'none'; row3.style.display = 'none'; } </script> <script type="text/javascript"> function GetDate2() { var curDateTime = new Date() var curHour = curDateTime.getHours() var curMin = curDateTime.getMinutes() if(curHour<10) curHour = "0" + curHour if(curMin<10) curMin = "0" + curMin document.getElementById('break_time_out').value = curHour + ":" + curMin ; var row = document.getElementById("end2_time"); row.style.display = ''; } </script> <script type="text/javascript"> function GetDate3() { var curDateTime = new Date() var curHour = curDateTime.getHours() var curMin = curDateTime.getMinutes() if(curHour<10) curHour = "0" + curHour if(curMin<10) curMin = "0" + curMin document.getElementById('break_time_in').value = curHour + ":" + curMin ; } </script> <script type="text/javascript"> function tout1() { var temp= document.tracker.start_time.value; if(temp.length>0) { var row1 = document.getElementById("end1_time"); var row2 = document.getElementById("start2_time"); row1.style.display = 'none'; row2.style.display = 'none'; } else { var row = document.getElementById("start1_time"); var row1 = document.getElementById("end1_time"); var row2 = document.getElementById("start2_time"); row.style.display = 'none'; row1.style.display = 'none'; row2.style.display = 'none'; } } function tout2() { var temp= document.tracker.start_time.value; if(temp.length>0) { var row = document.getElementById("start1_time"); var row1 = document.getElementById("end1_time"); var row2 = document.getElementById("start2_time"); var row3 = document.getElementById("end2_time"); row.style.display = 'none'; row1.style.display = 'none'; row2.style.display = 'none'; row3.style.display = 'none'; } else { var row = document.getElementById("start1_time"); var row1 = document.getElementById("end1_time"); var row2 = document.getElementById("start2_time"); var row3 = document.getElementById("end2_time"); row.style.display = ''; row1.style.display = 'none'; row2.style.display = 'none'; row3.style.display = 'none'; } } </script> <script type="text/javascript"> var seconds = 0; var minutes = 0; var hours = 0; function zeroPad(time) { var numZeropad = time + ''; while(numZeropad.length < 2) { numZeropad = "0" + numZeropad; } return numZeropad; } function countSecs() { var j=document.tracker.hide.value; if(j=="yes") { seconds++; if (seconds > 59) { minutes++; seconds = 0; } if (minutes > 59) { hours++ minutes = 0; } document.tracker.time_utilization.value = zeroPad(hours) + ":" + zeroPad(minutes) + ":" + zeroPad(seconds); } else {} } function startTimer() { action = window.setInterval(countSecs,1000); } function s() { document.tracker.hide.value ="yes"; startTimer(); } function p() { document.tracker.hide.value ="no"; } </script> </head> <body> <form name="tracker" method="post" action="processor.php" onsubmit="return formCheck(this);"> <label class="formFieldQuestion">Start Time *</label><input readonly class=mainForm type=text name=start_time id=start_time size='30' value=''> <input type="button" id="start1_time" style="width: 100px" Value="Start Time" onClick="javascript:GetDate();s();"></li> <label class="formFieldQuestion">End Time *</label><input readonly class=mainForm type=text name=end_time id=end_time size='30' value='' > <input type="button" id="end1_time" style="width: 100px" Value="End Time" onClick="javascript:GetDate1(); p();" style='display: none'></li> <input type="hidden" name="hide" /> <label class="formFieldQuestion">Break Time Out </label><input class=mainForm readonly type=text name=break_time_out id=break_time_out size='30' value='' > <input type="button" id="start2_time" style="width: 100px" Value="Start Time" onClick="javascript:GetDate2();tout1();p();"></li> <label class="formFieldQuestion">Break Time In </label><input class=mainForm readonly type=text name=break_time_in id=break_time_in size='30' value=''> <input type="button" id="end2_time" style="width: 100px" Value="End Time" onClick="javascript:GetDate3(); tout2();s();" style='display: none'></li> <label class="formFieldQuestion">Time Utilization</label><input class=mainForm type=text name=time_utilization id=time_utilization size='30' value='' readonly></li> <br /> <br /> <input id="saveForm" class="mainForm" type="submit" value="Submit" style="width : 100px"/> </form> </body> </html> Hey Everyone, I'm trying to set up two different buttons that count their own individual clicks. So far I have everything except where one button leaves off, the other picks up. So if I click the left one three times it shows the number 3, and then if I click the button next to it, that button picks up at 4. I want each button to have its own count. Any ideas? Here's what I have so far. <html> <head> <script type="text/javascript"> var counter = 0; function increaseloveit() { counter += 1; document.getElementById('loveit').value = counter; } var counter = 0; function increasehateit() { counter += 1; document.getElementById('hateit').value = counter; } </script> </head> <body> <form> <a href="#" onclick="javascript:increaseloveit();"><input type="button" value="Love It!" name="loveit" onclick="" /></a><input id="loveit" value="0" size="2" /></form> <form> <a href="#" onclick="javascript:increasehateit();"><input type="button" value="Hate It!" name="hateit" onclick="" /></a><input id="hateit" value="0" size="2" /></form> </body> </html> Hi all, Apologies if this is a lame question, but I could not find an answer. Firstly, I am unable to post full HTML as it is way too long and I don't have a server to upload it to yet. I have a form that accepts a name and DOB and stores it in an array. Later in the form, a layer is triggered. Within this layer the previously enterred name(s) and DOB(s) are retrieved from the array and displayed on screen, with the addition of two extra input text fields. The code within the layer is as follows. As you can see I'm using the loop to add the additional fields, which in itself, does what I want, but may also be the root of my problem. Code: for (i=0;i<40;i++) { if (Array[i][0] != null) { lyrSrc += "<table style='width:600px;'cellspacing=0 cellpadding=0 border=0>" lyrSrc += "<tbody id='table1'>" lyrSrc += "<tr><td> <\/td><\/tr>" lyrSrc += "<tr><td style='width:220px;'>Name:<\/td><td> " + Array[i][0] + "<\/td><\/tr>" lyrSrc += "<tr><td style='width:220px;'>DOB:<\/td><td> " + Array[i][1] + "<\/td><\/tr>" lyrSrc += "<tr><td style='width:220px;'>Text 1:<\/td><td>$<input type=text name=\"txtone\" size=10><\/td><\/tr>" lyrSrc += "<tr><td style='width:220px;'>Text 2:<\/td><td> <select name=\"txttwo\" size=10><\/td><\/tr>" lyrSrc += "<tr><td> <\/td><\/tr>" lyrSrc += "<\/tbody>" lyrSrc += "<\/table>" } } The array is designed to store multiple names/dobs. If more than one name/dob is enterred, what I'm trying to find out is how to append the fieldnames of the two additional text fields so that the fieldnames are unique, as it returns an error if I try to call the field values if there is more than one name/dob in the array. I would appreciate any assistance or points,nudges,pushes in the right direction. I looked at trying to add the extra fields dynamically, but I couldn't get it to work, probably because of the layer(?). cheers. I have just bought a JS animated web template. I made changes to the file names on the splash page (index.html) and 2 landing pages www.keithmacstanton.com/dez Now everything is all messed up. Help
Ok, below is an example of what I am trying to do (it's easier to show than try to explain). Code: var abc1 = "this text "; var abc2 = "that text "; var abc3 = 483967; var xNum = 2; var myNum = "abc"+xNum; alert (myNum); // this gives the expected "abc2" concatCall(); function concatCall() { var newOne = myNum + abc3; //the output I want is "that text 483967" instead of "abc2483967" alert (newOne); } Now in the function, the variable is behaving as it should and I expected that, what I want though is what is commented. Any ideas on how that can be done? I know it has to do with the fact that once the var and string are concatenated, they become a string. What I want to know is the way to convert the string into a variable name that will produce the variable's data instead of the variable name. (for the curious, I have a <ul> that is passing the xNum var to my JS and currently have an else if statement to output the correct data - i'm looking for a way to shorten this code) |