JavaScript - Dynamic Variable Name How To
I am trying to concatenate text to refer to a variable:
Code: var HomePlayer1Points = 17 var i = 1 var a = "HomePlayer" var b = "Points" var c = a + i + b alert(c.value) it give me undefined instead of 17. How should this be done without using eval() ??? Similar TutorialsHello, I am trying to access a dynamic asp variable with onclick either in a javascript function where I can use it globally or set another div id with this dynamic variable. Any help is very much appreciated. Thank you! <script> function doSomething(article_id) } return article_id; } </script> <a href="#test" onClick="doSomething("<%=rsHeadline("article_id")%>")">try here...</a> <div id="test"> <%articleid = request.querystring("article_id") %> <% Response.Write articleid %> The article id is articleid</div> I have a signup form on a site that does a check on submission of fields to see if they populated and error box if not changes focus to missing field and highlights field name in red. I wanted to improve on its effectiveness as it only checks 2 fields atm and I wanted it to check some dynamic fields as well the fields are associative arrays generated via php as follows:- Code: echo "<select name='nfield[$t]'>\n"; for ($i = 0; $i<count($value2); $i++) { echo "<option value=\"".trim($value2[$i])."\">".trim($value2[$i])."</option>\n"; } echo "</select>"; the javascript is as follows:- Code: function checkForm() { //This is the name of the function if (Form1.password.value == "") { alert("Please enter a Password."); Form1.password.focus( ); document.getElementById('password').style.color="red"; return false; } The field is displayed via php as follows:- echo "<tr><td align='center' id='password'>Password:</td><td><input type='password' name='password' size='10'></td></tr>\n"; So i thought ah easy, i will just add the following checking javascript to check each of the associative arrays as they never change Code: if (Form1.nfield[1].value == "") { alert("Please choose an option for option1"); Form1.nfield["1"].focus( ); //This focuses the cursor on the problem field document.getElementById('nfield[1]').style.color="red"; return false; //This prevents the form from being submitted } if (Form1.nfield[2].value == "") { alert("Please choose an option for option2"); Form1.nfield[2].focus( ); //This focuses the cursor on the problem field document.getElementById('nfield[2]').style.color="red"; return false; //This prevents the form from being submitted } if (Form1.nfield[3].value == "") { alert("Please choose an option for option3"); Form1.nfield[3].focus( ); //This focuses the cursor on the problem field document.getElementById('nfield[3]').style.color="red"; return false; //This prevents the form from being submitted } but this doesn't work, i think it doesn't recognise the nfield[1] syntax, can a javascript guru point me in the right direction ? I also wanted to enhance the form somewhat as atm it only displays one error popup at a time, so if the user has missed out a few fields they will get an initial popup, try and submit again and then get the second popup for the other missing field. Can my code be modified to show a list of the missing fields and highlight all the titles in red (and if possible change the background colour of the input boxes or border the input fields in red etc)? Hi All, i know how to create a dynamic form or DIv ..but what i do not know is how to create a dynamic form/ or div into a previous dynamic one.. i need basically to see 5 dynamic forms / DIV in cascade where each one trigger the one coming after.. For what i need that : i have my user inserting information on the level 1. let say Copagny info 2- then he will be asked if he wants to add a sub level information ( subform) for that compagny or even many subforms at the same level .. and so on... 3- those sub level ( subforms ) can also call their respective subforms.. Any idea how to design this ? thanks I have made a script where you can add extra fields, and next to the row is a span that automatically displays the outcome from a calculation of three fields in that row. i.e. Q x (B - A) = total. Here is the bit that does the calculation: Code: function advCalc(selected) { var result = Number(document.formmain.elements["quantity"+selected].value) * (Number(document.formmain.elements["provideamount"+selected].value) - Number(document.formmain.elements["supplyamount"+selected].value)) ; result = result.toFixed(2) ; result = addCommas(result) ; document.getElementById("total"+selected).innerHTML = result ; } The bit that adds a new row of fields is: Code: function addPart(divName){ var newdiv = document.createElement('div') ; newdiv.setAttribute('id', 'partrow' + counter) ; newdiv.setAttribute('style', 'clear:both;') ; newdiv.innerHTML = "<div style='float:left;width:40px;text-align:center;margin:5px 5px 0px 0px;'>\r<input onkeyup=\"advCalc('" + counter + "')\" id=' quantity " + counter + "' type='text' value='1' size='1'/>\r</div>\r<div style='float:left;width:100px;text-align:left;margin:5px 0px 0px 0px;'>\r<input id='manufacturer" + counter + "'type='text' value='' size='9'/>\r</div>\r<div style='float:left;width:95px;text-align:left;margin:5px 5px 0px 0px;'>\r<input id='partnumber" + counter + "'type='text' value='' size='9'/>\r</div>\r<div style='float:left;width:80px;text-align:left;margin:5px 5px 0px 0px;'>\r<input id='supplier" + counter + "'type='text' value='' size='4'/>\r</div>\r<div style='float:left;width:100px;text-align:left;margin:5px 5px 0px 0px;'>\r<input id='type" + counter + "'type='text' value='' size='6'/>\r</div>\r<div style='float:left;width:85px;text-align:left;margin:5px 5px 0px 0px;'>\r<input id='deliverytime" + counter + "'type='text' value='' size='13'/>\r</div>\r<div style='float:left;width:40px;text-align:left;margin:5px 0px 0px 45px;'>\r<select id='supplyCurrency" + counter + "'>\r<option value='pound' selected='selected'>£</option><option value='dol'>$</option><option value='euro'>€</option></select>\r</div>\r<div style='float:left;width:15px;text-align:left;margin:5px 5px 0px 0px;'>\r<input onkeyup=\"advCalc(\'" + counter + "\')\" id=' supplyamount " + counter + "'type='text' value='' size='3'/>\r</div>\r<div style='float:left;width:40px;text-align:left;margin:5px 0px 0px 45px;'>\r<select name='provideCurrency" + counter + "'><option value='pound' selected='selected'>£</option><option value='dol'>$</option><option value='euro'>€</option></select>\r</div>\r<div style='float:left;width:15px;text-align:left;margin:5px 5px 0px 0px;'>\r<input onkeyup=\"advCalc(\'" + counter + "\') id=' provideamount " + counter + "' type='text' value='' size='3'/>\r</div>\r<div style='float:left;width:20px;text-align:left;margin:5px 0px 0px 45px;'>\r<strong>£</strong>\r</div>\r<div style='float:left;width:40px;text-align:left;margin:5px 5px 0px 0px;'><span id=' total " + counter + "'></span></div> \r" ; document.getElementById(divName).appendChild(newdiv) ; counter++ ; } The problem I am having is that it works fine for the first row which is hardcoded as e.g. id="provideamount0" etc. It isn't working for any other fields added but I can't see what is wrong Hi, I have a programing problem that have been around for ages. I have search on google using several expressions and words and after hours of digging i'm still unable to do it. I would like to get a value from a HTML page hosted remotely with an inconstant value. Then define this value and name as a javascript variable and apply or show in my page. Thanks for all the help P.S. Is there any way to make a domain lookup in javascript? I mean a user enters a domain and the script converts to an ip and shows to the user. If not thanks, probably it can only be done in the server side... I don't know how I should do ? Quote: <html> <head> <script type="text/javascript"> function add(a,b){ y=a+b return y } var aaa = add(one,two) //one needs to get somehow get the value of yil, in this case 10 var one = function reas(){i=10;if(i<10){yil = 15}; else{yil = 10; yil = one;}; var two = 20; document.write(y) </script> </head> </html> also why doesn't this work? Quote: <html> <head> <script type="text/javascript"> function adder(a,b){ var k=a+b; return k } var hes=adder(5,kol); kol=40; alert(hes); </script> </head> </html> you cannot have variables in callback functions? Hello I have a php page in which I declared a js variable... right at the top of the page... <script type="text/javascript"> var tester = 0; </script> Later in the page I test this variable... <script type="text/javascript"> if (tester==1){ do some stuff!! } </script> But I keep getting an error variable _tester undefined Am I missing something obvious... I am new to js... but this seems really straightforward Hi! I have a javascript in the head of the document which has a variable named "ref2" ... ref2 is already working as I can see its value working in another function. I need to send this variable as the value of a hidden field in the form which is in the body of the document. This is my JavaScript Code: Code: function WriteContactFormStatement1 () { var ContactFormValue = ref2; document.write('<input type="hidden" name="UReferrersName" value="' + ContactFormValue + '" />'); } var WriteContactFormStatement = WriteContactFormStatement1 (); And at the end of my form, before the submit button, I have the following code: Code: <!-- START -- Javascript to print the statement for UReferrersName --> <script language="JavaScript" type="text/JavaScript"> //WriteContactFormStatement(); document.write (WriteContactFormStatement); </script> <!-- End -- Javascript to print the statement for UReferrersName --> When I execute the form, it doesn't work the way it should, plus, gives me a word "undefined" next to the "Submit" button ..... Please help !... - Xeirus. This might be a stupid question, but is there any memory usage difference between var variable1, variable2; and var variable1; var variable2;? I'm learning how to use faster code hence the question.
If I manually write out "2/22/2012 4:00 PM" in TargetDate, I get the correct result for what I want to do (a countdown). But I want the countdown to always be the current day at 4pm. So I tried the code below thats commented, but it is not working. New to javascript, still reading the books, just hoping for some guidance on this. Code: Next Update: <script language="JavaScript"> var currentTime = new Date() var month = currentTime.getMonth() + 1 var day = currentTime.getDate() var year = currentTime.getFullYear() TargetDate = "2/22/2012 4:00 PM"; //TargetDate = "document.write(month + "/" + day + "/" + year) + 4:00PM"; BackColor = "white"; ForeColor = "red"; CountActive = true; CountStepper = -1; LeadingZero = true; DisplayFormat = "%%H%% H, %%M%% M, %%S%% S"; FinishMessage = "Forecasts posted"; </script> <script language="JavaScript" src="countdown.js"></script> Hello everybody I have a problem with Java Script damned I want to add the values of several variables in one variable and then use this variable, which contains the values of variables You can see the following example HTML Code PHP Code: <input type="text" name="txt1" /> <br/>age <input type="text" name="txt2" /> <br/><br/> <input type="button" name="submits" value="send"/> Javascript Code PHP Code: field = document.getElementsByName('txt1')[0]; field2 = document.getElementsByName('txt2')[0]; submit = document.getElementsByName('submits')[0]; data = 'data=' + field.value + '&data2=' + field2.value + '&submits=' + submit.value; document.getElementsByName('submits')[0].onclick = function(){ alert(data); } After executing this code I find that the variables are not displayed values As in the following picture I want to know what the cause of this problem ? Hello I have a piece of javascrip that refreshes the page: ---------- Code: <script type="text/javascript"> <!-- Begin function reFresh() { location.reload(true) } /* Set the number below to the amount of delay, in milliseconds, you want between page reloads: 1 minute = 60000 milliseconds. 2 minutes = 120000 milliseconds 5 minutes = 300000 milliseconds*/ window.setInterval("reFresh()",20000); // End --> </script> -------- I am new to javascript and wanted to use an html options menu in order to be able to choose the refresh interval: Code: <SELECT NAME="refreshtime"> <OPTION VALUE="60000">1 min</option> <OPTION VALUE="120000">2 min</option> <OPTION VALUE="180000">3 min</option> <OPTION VALUE="240000">4 min</option> </SELECT> I know that I have to pass a variable to the function. I have tried several variations but none have worked. I have mostly received a "done with errors" warning. Any help would be appreciated. Thanks Zam Hi, I want to write some javascript code that uses arrays, I have a list of arrays named array1, array2, array3 etc. I want to perform a function on each of these arrays. I wanted to have a variable for the number after array so this is what I have: <code> var array1 = new Array ("1","2","3","4","5"); var array2 = new Array ("5","6","7","8","9"); for (var i=1; i<=2;i++){ document.writeln(("array"+i)[1]); } </code> the problem is it gives me the letters in the string array instead of the array values. How do I get javascript to treat ("array"+i) as array1? Can anyone tell me of how to take or assign a javascript variable into php.
I have a dynamic website where my client can upload pictures to, i have php dynamically show the images and etc, i also have php assign each photo an id number. Basically what it is each photo dynamically gets id=$i++. So every photo uploaded it goes up one higher. Now i wanted to make it so in javascript the same happens, the id is dynamically i++ but im not very good in javascript so i was hoping i could get some help. Basically i want it to be something like this. (unless u know a better way of doing the same kind of effect) Code: var i=0; $(document) .ready(function(){ setTimeout(function () {$("#i++").fadeOut("slow");}, 100); setTimeout(function () {$("#i++").fadeIn("fast");}, 400); }); I just need help getting the i++ to work. Hello all. I am currently viewing various reports based on a location chosen by a dropdown. When I select GO, the page sends the location to a popup, which then queries based on that location and displays the graph on the popup window. What I want to do is to eliminate the popup and send the location to a <div> on the same page and then have the query run and display the graph on the same page. Is this possible, or do Divs have to be static content? Thanks, Parallon Hey there CF members, i have a huge problem with dynamic JavaScript i am using .load function which is the part of my script built by my programmers to load objects dynamically in JS. the code reads PHP Code: $("#content").load("SOME CODE HERE",hideUpdate); The division id is Content as u can see above. the need is to add a html code at the beginning of it like in php we can use dot operator like "SOME CODE IS " . $ code same way what can we use in here in dynamic html to combine a custom HTML regards Hi All, I am working on a script to generate a dynamic table and populate the fields in that table with data from a number of text fields on my page. The page uses Adobe spry validation and this is the only way I can get my validation to function and add the data to the table dynamically (I had a script where the text fields were part of the first row and blank rows were added dynamically but the validation would not work for the added rows... This is a workaround). Being new to JS I did the best I could and I think it's clear what I am going for but I am sure my syntax and method usage is off. When I click to add the table row, I get "[object HTMLLabelElement]" in each cell (dunno what that is). Could someone please help me get going in the right direction with this code? Here it is and thanks in advance for any help. Code: A<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script src="SpryAssets/SpryValidationTextField.js" type="text/javascript"></script> </style> <link href="SpryAssets/SpryValidationTextField.css" rel="stylesheet" type="text/css" /> </head> <SCRIPT language="javascript"> function addRow(tableID) { //These variable are commented out and coded inline below. //var StartTime = document.getElementById(StartTime); //var EndTime = document.getElementById(EndTime); //var MaterialID = document.getElementById(MaterialID); //var Title = document.getElementById(Title); var table = document.getElementById(tableID); var rowCount = table.rows.length; var row = table.insertRow(rowCount); var cell1 = row.insertCell(0); var element1 = document.createElement("input"); element1.type = "checkbox"; cell1.appendChild(element1); var cell2 = row.insertCell(1); var element2 = document.createElement("input"); element2.type = "text"; element2.setAttribute("id","StartTime[]"); //Set the value to the form's textfield. element2.value = document.getElementById(StartTime); cell2.appendChild(element2); var cell3 = row.insertCell(2); var element3 = document.createElement("input"); element3.type = "text"; element3.setAttribute("id","EndTime[]"); //Set the value to the form's textfield. element3.value = document.getElementById(EndTime); cell3.appendChild(element3); var cell4 = row.insertCell(3); var element4 = document.createElement("input"); element4.type = "text"; element4.setAttribute("id","MaterialID[]"); //Set the value to the form's textfield. element4.value = document.getElementById(MaterialID); cell4.appendChild(element4); var cell5 = row.insertCell(4); var element5 = document.createElement("input"); element5.type = "text"; element5.setAttribute("id","Title[]"); //Set the value to the form's textfield. element5.value = document.getElementById(Title); cell5.appendChild(element5); } function deleteRow(tableID) { try { var table = document.getElementById(tableID); var rowCount = table.rows.length; for(var i=0; i<rowCount; i++) { var row = table.rows[i]; var chkbox = row.cells[0].childNodes[0]; if(null != chkbox && true == chkbox.checked) { table.deleteRow(i); rowCount--; i--; } } }catch(e) { alert(e); } } </SCRIPT> <body> <span id="spryStartTime"> <label for id="StartTime">Start Time:</label><br /> <input name="StartTime" type="text" id="StartTime" tabindex="1" size="10" maxlength="8" /> <span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldInvalidFormatMsg">Invalid format.</span></span><br /> <label for id="EndTime">End Time:</label><br /> <span id="spryEndTime"> <input name="EndTime" type="text" id="EndTime" tabindex="2" size="10" maxlength="8" /> <span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldInvalidFormatMsg">Invalid format.</span></span><br /> <label for id="MaterialID">Material ID:</label><br /> <span id="spryMaterialID"> <input name="MaterialID" type="text" id="MaterialID" tabindex="3" size="10" maxlength="10" /> <span class="textfieldRequiredMsg">A value is required.</span></span><br /> <label for id="Title">Title:</label><br /> <span id="spryTitle"> <input name="Title" type="text" id="Title" tabindex="4" size="50" maxlength="50" /> <span class="textfieldRequiredMsg">A value is required.</span></span><br /> <INPUT type="button" value="Add Row" onclick="addRow('dataTable')" /> <INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" /> <!-- I would prefer not to start with a table with blank rows (but rather create the rows already populated) but I can work on this later. --> <TABLE id="dataTable" width="350px" border="1"> <TR> <TD><INPUT type="checkbox" name="chk"/></TD> <TD><INPUT type="text" /></TD> <TD><INPUT type="text" /></TD> <TD><INPUT type="text" /></TD> <TD><INPUT type="text" /></TD> </TR> </TABLE> <script type="text/javascript" /> var sprytextfield3 = new Spry.Widget.ValidationTextField("spryStartTime", "time", {validateOn:["blur"], format:"HH:mm:ss", useCharacterMasking:true}); var sprytextfield4 = new Spry.Widget.ValidationTextField("spryEndTime", "time", {format:"HH:mm:ss", useCharacterMasking:true, validateOn:["blur"]}); var sprytextfield5 = new Spry.Widget.ValidationTextField("spryMaterialID", "none", {validateOn:["blur"]}); var sprytextfield6 = new Spry.Widget.ValidationTextField("spryTitle", "none", {validateOn:["blur"]}); </script> </body> </html> I'm a complete rooking at javascript (and haven't looked at php in months), but am wondering if its possible to do the following with javascript. I have a listing of 10 to 16 teams. I'd like to be able to list the teams in a drop down select box. And when the user selects a team, that teams listing of players is than shown below. The user should than be able to toggle through the listing to review each time. Is something like this possible with javascript? |