JavaScript - Whats The Best Way To Loop Through All Unique Names On A Form?
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? Similar TutorialsFind it really hard to understand these random variable names and what they are doing, can anyone explain what is going on exactly in the bolded parts. I have a rough idea but the 3 arrays confuse me somewhat im sure the random variable names are pointers and counts but id love to hear an expert explain them for sure thanks if you can help or are willing to take the time 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"; } Hi 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 all. I have a form named "theForm". How can I loop through this form elements that have an "id" ATTRIBUTE to them and then populate my ids array? var ids = new Array; for(i=0; i<document.theForm.elements.length; i++) { IF ELEMENT HAS AN ID ATTRIBUTE POPULATE ids array } I am trying to develop a function that creates a certain number of form elements based on a certain number that a user inputs. It does not do what I want it to do (obviously). The problem lies within the TextBoxAppear() function. The function worked when I tested it by adding just text (document.getElementByID('leftcolumn').innerHTML = "<p>test function</p>" so I know for a fact whatever I added to the function is the problem. What has been added to the function and needs fixing is in BOLD Code: <!DOCTYPE html> <html> <head> <meta charset = "utf-8"> <title>Exercise 4</title> <style type = "text/css"> #leftcolumn { width: 300px; border: 1px solid red; float: left} #rightcolumn { width: 300px; border: 1px solid red; float: left} </style> <script> function start() { var button = document.getElementById( "submitButton" ); button.addEventListener( "click", TextBoxAppear, false ); } function TextBoxAppear() { var numberOfValuesInput = document.getElementByID( 'NumberOfValuesField' ); var numberOfValues = parseFloat( numberOfValuesInput.value ); var textBoxCreation = "<form action ="http://www.deitel.com"><p>"; for ( var i = 1; i < numberOfValues; ++i ) { textBoxCreation += "<label>Value" + i + ":<input id = 'Value" + i + "' type = 'text'></label>"; } textBoxCreation += "<input id = "calculateButton" type = "button" value = "Calculate"></p></form> document.getElementById('leftcolumnn').innerHTML = textBoxCreation; } window.addEventListener( "load", start, false ); </script> </head> <body> <form action ="http://www.deitel.com"> <p><label>Number of values to be calculated: <input id = "numberOfValuesField" type = "text"></label> <input id = "submitButton" type = "button" value = "Submit"></p> </form> <div id ="leftcolumn"><p>test left column</p></div> <div id ="rightcolumn"><p>test right column</p></div> </body> </html> Origins? note: it's not really seachable, because if you search javascript foo, or javascript foo origins example javascript just shows up... Code: <html> <title>hi</title> <Head> <SCRIPT language="JavaScript"> <!-- var rand_url= new Array() rand_url[0]="http://www.facebook.com"; rand_url[1]="http://www.youtube.com"; rand_url[2]="http://www.bing.com"; rand_url[3]="http://www.yahoo.com"; rand_url[4]="http://www.google.com"; var rand_num= Math.floor(Math.random()*5); //--> </SCRIPT> </head> <body> <H2>Try your luck!</H2> <a href="javascript:func(rand_url[rand_num])"><img src="http://www.mycasinogames.org/editor/assets/button_playnow.jpg" alt="CLICK ME!"/></a> </body> </html> I'm testing out some JavaScripts, and im using one that give a random link. So, basically they have to click a "Play Now" IMAGE to launch ONE of the links above in the "rand_url" However what is in red isn't working. When clicking the image, it does nothing. Can you help? I am doing project exercises from a JavaScript book for a college class. I am creating a brand new .html document for each project. I was under the impression that each unique page name would have its very own cookie scope. But to my surprise it seems adding/loading cookies using 'document.cookie' doesn't assign new cookies to each page. I am seeing that when I try to load document.cookie in new .html pages there are cookies that were already created in past pages in the document.cookie property/string. So whats the 'default' scope of a document cookie. Do I have to set the domain property to get unique cookies for each .html page I create? Thanks for the help. Edit: Okay, it seems that cookies have a default scope of the folder your .html page resides in and all sub-folders that your page resides in. I moved my project folder so that it was a sibling of my projects folder and it got its own cookies that way. i have been working on Javascript and HTML for long time but never had such kind of a problem. A very simple code isnt getting executed. Please help me out with what i am missing : Here is the HTML code with javascript(a very simple webpage to say hello) : Code: <html> <head> <script type = "Javascript"> function say_hi() { window.alert("Said hiii.."); } </script> </head> <body> ahgdahsgdhagshd <input type = "checkbox" onclick= say_hi()/>click the check box sdfsdf </body> </html> Problem is that say_hi() isnt getting called. I have tried : Code: onclick= "say_hi();" also.. but still its not getting called when i am clicking the checkbox which it should!!! Yes but if i am writing : Code: onclick= "window.alert("Hi");" then its getting executed!!!. Whats going on here in my code. Thanks in advance Im looking at how or what this effect is called i am not even sure if it is javascript i assume it is from looking at the code. But i cant seem to convert it to what i want. So if someone could point me to a more simple version of this code or what the technique is called that would be great. Here is the page. http://www.pizzacapers.com.au/the-me...nature-pizzas/ What i am talking about: You click the pizza and it comes up inside of the border picture on the left side of the page. Thanks Simply what is wrong with my code. The following code is for a simple slideshow that is supposed to accept a range of images to display. Its for a website where it shows all the store for a company and when you rollover the image of it is plays a slideshow of images. If you have any other way of doing this that would be easier than please post it here. It must work in all browsers. As you can see there are lots of images to me loaded for this Code: <!-- var image1=new Image() image1.src="contact/images/wingham/01.jpg" var image2=new Image() image2.src="contact/images/wingham/02.jpg" var image3=new Image() image3.src="contact/images/wingham/03.jpg" var image4=new Image() image4.src="contact/images/wingham/04.jpg" var image5=new Image() image5.src="contact/images/wingham/05.jpg" var image6=new Image() image6.src="contact/images/wingham/06.jpg" var image7=new Image() image7.src="contact/images/listowel/01.jpg" var image8=new Image() image8.src="contact/images/listowel/02.jpg" var image9=new Image() image9.src="contact/images/listowel/03.jpg" var image10=new Image() image10.src="contact/images/listowel/04.jpg" var image11=new Image() image11.src="contact/images/listowel/05.jpg" var image12=new Image() image12.src="contact/images/listowel/06.jpg" var image13=new Image() images13.src="contact/images/hanover/01.jpg" var image14=new Image() images14.src="contact/images/hanover/02.jpg" var image15=new Image() images15.src="contact/images/hanover/03.jpg" var image16=new Image() images16.src="contact/images/hanover/04.jpg" var image17=new Image() images17.src="contact/images/hanover/05.jpg" //--> <!-- //variable that will increment through the images var step=1 function slideit(start,finish,action){ if(action == 'abort'){ return } //if browser does not support the image object, exit. if (!document.images) return document.images.slide.src=eval("image"+step+".src") if (step<finish){ step++ } else{ step=start } //call function "slideit()" every 2.5 seconds timer = setTimeout("slideit(start,finish)", 1000); } function slideOff() { document.images.slide.src=eval("image1.src") clearTimeout(timer); } //Called something like this: slideit(1,6)// What is best for creating a PTC script
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. Ok, I'm nearly pulling my hair out with this one. I have been looking at this code for two evenings now, and rewrote it 4 times already. It started out as jQuery code and now it's just concatenating strings together. What I'm trying to do: Build a menu/outline using unordered lists from a multidimensional array. What is happening: Inside the buildMenuHTML function, if I call buildMenuHTML, the for loop only happens once (i.e. only for 'i' having a value of '0'.) If I comment out the call to itself, it goes through the for loop all 3 times, but obviously the submenus are not created. Here is the test object: Code: test = [ { "name" : "Menu 1", "url" : "menu1.html", "submenu" : [ { "name" : "menu 1 subitem 1", "url" : "menu1subitem1.html" }, { "name" : "menu 1 subitem 2", "url" : "menu1subitem2.html" } ] }, { "name" : "Menu 2", "url" : "menu2.html", "submenu" : [ { "name" : "menu 2subitem 1", "url" : "menu2subitem1.html" }, { "name" : "menu 2subitem 1", "url" : "menu2subitem1.html" } ] }, { "name" : "Menu 3", "url" : "menu3.html", "submenu" : [ { "name" : "menu 3 subitem 1", "url" : "menu3subitem1.html" }, { "name" : "menu 3 subitem 1", "url" : "menu3subitem1.html" } ] } ]; Here is the recursive function: Code: function buildMenuHTML(menuData,level) { var ul; if (level == 1) { ul = "<ul id='menu'>"; } else { ul = "<ul class='level" + level + "'>"; } for (i = 0; i < menuData.length; i++) { menuItemData = menuData[i]; ul += "<li>"; ul += "<a href='" + menuItemData.url + "'>" + menuItemData.name + "</a>"; if (typeof menuItemData.submenu != 'undefined') { ul += buildMenuHTML(menuItemData.submenu,level + 1); } ul += "</li>"; } ul += "</ul>"; return ul; } Here is how the function is called initially: Code: buildMenuHTML(test,1); This is it's return value (with indentation added for readability): Code: <ul id='menu'> <li><a href='menu1.html'>Menu 1</a> <ul class='level2'> <li><a href='menu1subitem1.html'>menu 1 subitem 1</a></li> <li><a href='menu1subitem2.html'>menu 1 subitem 2</a></li> </ul> </li> </ul> 'Menu 2' and 'Menu 3' don't show up! I'm sure it's something small that I'm overlooking, but any help would be appreciated. Dear Users, I am trying to validate 4 radio groups (YES/NO) and get user to select at least one YES, doesnt matter which one. I am using a Spry Validation from Dreamweaver + the function listed below, but when I use this function the Spry Validation doesnt work, I think so I need to rebuild attached file (please change txt for js) function validate(f) { if(!f.RadioGroup1[0].checked && !f.RadioGroup2[0].checked) { alert('Please select at least one Yes'); return false; } return true; } I think so this is the place inside the Spry file to make a changes but I am ot quite sure how to make it // check isRequired if (this.isRequired && (nochecked == 0 || required != 0)) { this.addClassName(this.element, this.requiredClass); this.addClassName(this.additionalError, this.requiredClass); return false; } this.addClassName(this.element, this.validClass); this.addClassName(this.additionalError, this.validClass); return true; }; 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
I have a function that capitalizes surnames including Scottish surnames, I can't remember where I found it but it has been working perfectly....until recently! The function will uppercase names that start with mc or mac, so mcdonald will become McDonald and macdonald will become MacDonald. The problem is if someone has the surname mack, it comes out as MacK. I think a good fix would be to tell the expression there needs to be at least 2 characters after mc or mac for it to assume it is Scottish but I have no idea how to do it. The code I have so far is Code: var temp = s.value.toLowerCase().replace( /\b((m)(a?c))?(\w)/g, function($1, $2, $3, $4, $5) { if($2){return $3.toUpperCase()+$4+$5.toUpperCase();} return $1.toUpperCase(); }); Can anyone help tweaking what I have please? I'm useless on regular expressions 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) 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 a function to dynamically create an image on the screen the problem is i need it to slide down the screen, and i am using the function to have the picture up in more than one place at more then one one time. is their anything i can build into the div tag containing the image that would let it scroll down on its own (or some other method of accomplishing this i haven't thought of) i am putting my function below Code: function newtree(){ x_axis=Math.floor(Math.random()*height); newdiv=document.createElement('div'); newdiv.setAttribute('style','position:absolute; left:'+x_axis+';top:0'); document.body.appendChild(newdiv); newimg=document.createElement('img'); newimg.src="Tree.png"; newimg.width="150"; newdiv.appendChild(newimg); } the 'height' and 'width' variable are already set to the available room in pixels |