JavaScript - Newbie: Append Code To Array Output
Similar TutorialsHey guys, if someone could help point me in the right direction that would be great. I cant get seem to get this array to print the numbers 1 to 15 out. When I preview I get nothing, anyone know what I am doing wrong? Thanks to those that reply. thanks got it I have an array, I can not figure out how to take myTemplateholder = myTemplateholder.replace(" "+children[child],children[child]+"<div id='questionRadio'><input type='radio' name='answer' value='Y' /> Y <input type='radio' name='answer' value='N' /> N <input type='radio' name='answer' value='NA' /> N/A<br /></div>");} to display to separate lines. Right now, if there is more than one value, it gets added together. Here's the rest of the code: Code: function showText(){ // var myTemplateholder = document.getElementById('myTemplateholder').innerHTML; // document.getElementById('showMe').innerHTML = myTemplateholder; var children = new Array('Chills','Fatigue','Fever','Health History','Screening','Eye-ROS','Skin','Assessment','General Appearance','Vitals','Hearing','200','300','400','500'); var myTemplateholder = $('#myTemplateholder').text(); myTemplateholder = myTemplateholder.replace("Sections ",""); myTemplateholder = myTemplateholder.replace("History","<div id='templateHeader'>History</div>"); myTemplateholder = myTemplateholder.replace("ROS","<div id='templateHeader'>ROS</div><br>"); myTemplateholder = myTemplateholder.replace("Exam","<div id='templateHeader'>Exam</div>"); myTemplateholder = myTemplateholder.replace("ICD9","<div id='templateHeader'>ICD9</div>"); for(child in children) { myTemplateholder = myTemplateholder.replace(" "+children[child],children[child]+"<div id='questionRadio'><input type='radio' name='answer' value='Y' /> Y <input type='radio' name='answer' value='N' /> N <input type='radio' name='answer' value='NA' /> N/A<br /></div>"); } $('#showMe').html(myTemplateholder); } I'm totally stuck! Thanks for bearing with a newbie - any help would be greatly appreciated. Hi, I have 3 functions. I do not know how to have 2 functions recognize the output of an array from the other function. All of this revolves around input(text boxes). What is the array's output? In other words, how do I get the newly added textboxes recognized by the initial functions - what are they called? I have tried adding names like "No. of Hours[1]"; "No. of Hours(1)"; or,"No. of Hours1"; but none of that works. For example, one of the inputs is called "No. of Hours". That is the input textbox on the web page. When the add new rows array is invoked it adds new input textboxes and the new element is Code: el.type = 'text'; el.name = 'No. of Hours' + iteration; el.id = 'No. of Hours' + iteration; el.size = 7; cellRight.appendChild(el); What is this new input/element called so that I can refer to it for the coded function shown below? The first function provides validation for user input. Code: function checkQuarters( fld ) { var val = parseFloat(fld.value); if ( isNaN(val) || ( val*4 != Math.floor(val*4) ) ) { alert("Value must be a numeric and a multiple of 0.25"); return false; } return true; } </script> The input for the above function is Code: <td> <form style="width: 5px; height: 1px;"> <input type="text" name="No. of Hours" id="No. of Hours" style="width: 70px;" onblur="checkQuarters(this);" /> </form></td> The array outputs added textboxes thusly, Code: new_rows[row_count]['cell3']=sel; var cellRight = row.insertCell(3); var el = document.createElement('input'); el.type = 'text'; el.name = 'No. of Hours' + iteration; el.id = 'No. of Hours' + iteration; el.size = 7; cellRight.appendChild(el); new_rows[row_count]['cell']=el; row_count++; The other function uses a JQuery for a datepicker. Code: <script type="text/javascript"> $(function() { $("#startdate").datepicker(); $("#enddate").datepicker(); }); </script> The input is this. Code: <td><input style="width: 70px" type="text" id="startdate"></td> <td><input style="width: 70px" type="text" id="enddate"></td> I am lost on this and could really use some help and guidance. Thanks, John Hi How can i output two maximum numbers of an array if they are equal? var flower["roses", "violets", "buttercups", "daisies"]; var flowerAmounts[9, 8, 3, 9]; Output should be: The maximum amount of flowers is 9. There are 9 roses and 9 daisies. Hope someone can help, thanks Hello everyone I am trying to receive the output of an array from a text input here is the code that I am attempting to do but it is not displaying the output January Here is the code example [CODE] <html> <script type ="text/javascript"> <!-- function coms(str){ var myArray = new Array(); myArray[0] = ["January"]; var index = 0; for(var i = 0; i < myArray.length; i++){ index; if(myArray[i] == "January"){ index i; } if(str.length == myArray[i]){ document.write(str); } } } </script> <body> <form> Panel:<input type="text" name="panel" onkeyup="coms(this.value)" /> <div id="read"><p>Data is displayed here</p></div> </form> </body> </html> [CODE] Any tips to make this possible are welcome thank you kindly Hi guys, i am trying to work with google maps api my issue is with creating an array of markers count the number of marker, and then if it equal two, issue an error msg. i wrote some code, but that doesn't work obviously. and my question is how do i write that code in javascript ? GEvent.addListener(map, 'click', function (overlay, latlng) { if (placeMarker.length < 2) { pendingLatLng = latlng; setTimeout("settleClick()", 225) } else { message("You can only select 2 points."); } }); a sample click event which looks like the line below does work. what am i doing wrong ?: google.maps.event.addListener(map, 'click', function (event) {placeMarker(event.latLng); }) Hi! I'm start learning javascript and can't solve one problem. I need to case user click first radiobutton browser show him first form ($mat1), else second. For example, I have this php code: PHP Code: $mat1="<span id="form_notes_text">".$saved_info."</span><br>\ <input class=\"form_notes_element\" value="0" type="text" name="name" maxlength="9"><br><br>\ <span id="form_notes_text">".$price_info."</span><br>\ <input class=\"form_notes_element\" type=\"text\" name=\"name2\" maxlength\"9\"><br><br>"; $mat2="<span id="form_notes_text">".$saved_info."</span><br>\ <input class=\"form_notes_element\" value="0" type="text" name="name" maxlength="9"><br><br>\ <span id="form_notes_text">".$price_info."</span><br>\ <input class=\"form_notes_element\" type=\"text\" name=\"name2\" maxlength\"9\"><br><br>"; echo "<span id=\"form_notes_text\">$add_title</span><br> <input class=\"form_notes_element\" type=\"text\" name=\"name\" maxlength=\"30\"><br><br> <span id=\"form_notes_text\">$material_type</span><br> <input type=\"radio\" name=\"type\" value=\"1\" checked onclick=\"document.getElementById('add_form').innerHTML = $mat1\">Value 1<br> <input type=\"radio\" name=\"type\" value=\"2\" onclick=\"document.getElementById('add_form).innerHTML = $mat2\">Value 2<br><br><br>"; But it doesn't work. What am I doing wrong? For some reason, none of my javascript executes! Perhaps I am making a blindingly simple mistake, but whenever I load my page, only the HTML shows! To explain what I am trying to make happen; I am trying to make a simple page where the user types in some text, selects random color or not, and the text is displayed in a random (or not) color. I understand I have not added the part where the text is a random color, but I was merely trying to display the random color (color[c]) with document.write to see if the color was random. To summarize my questions: 1. Why won't the color array ( color[c] ) show with the document.write 2. Why won't the user's inputted text show up ( also with document.write ) 3. How would I go about making the random color variable work with the text? ( something along the lines of <h1 style="color:color[c]">usertext</h1>? Here's the code: Code: <html> <head> <title>Custom Text Generator!</title> </head> <body> <form name="form"> <input type="text" name="usertext" value="Enter Text Here" style="padding:3"><br /><br /> <font>Random Color:</font><input type="checkbox" name="colorcheck"> </form> <button type="button" onclick="go ()">Go</button> <script type="text/javascript"> var randomnumber=Math.floor(Math.random()*11); switch (randomnumber) {case randomnumber<3.3: c=0 break; case randomnumber<6.6: c=2 break; default: c=1 break} var color=new Array (); color[0]="blue"; color[1]="green"; color[2]="red"; document.write(color[c]); function go () { usertext = document.form.usertext.value; document.write(usertext)}; </script> </body> </html> Hi, I have 31 audio files and want to play one each day from a single html button. I have the audio files in the same directory as the html page. I have tried to adapt some code to do this, but have not had success. Any help would be much appreciated! Here is what I have so far: Code: <body> <button id="button" onclick=" " return false">Play</button> </body> <script type="text/javascript"> var currentDay = (new Date()).getDate(); document.getElementById('button').onclick = "proverbs" + currentDay + ".mp4" ; </script> I'm a newbie...please! html lists making javascript array I need help with a HTML UL I have ul inside ul but all I want to get when I select a certain list is the children of that list but remove the ul inside that list so they dont show at all http://pastebin.com/m98deaff any help would be great , current selecting code is http://pastebin.com/m6f4b886f Code: <div class="demo" id="demo_1"> <ul> <li id="1" class="open"><a id="1" href="#"><ins> </ins>Root node 1</a> <ul> <li id="2"><a id="2" href="#"><ins> </ins>Child node 1</a></li> <li id="3"><a id="3" href="#"><ins> </ins>Child node 2</a></li> <li id="4"><a id="4" href="#"><ins> </ins>Some other child node with longer text</a></li> <li id="6"><a id="6" href="#"><ins> </ins>Root node 222</a> //SHOUL NOT BE IN MY ARRAY <ul> <li id="7"><a id="7" href="#"><ins> </ins>Child node 222a</a></li> <li id="8"><a id="8" href="#"><ins> </ins>Child node 222b</a></li> <li id="9"><a id="9" href="#"><ins> </ins>Some other child node with longer text 222</a></li> </ul> //END OF UL ELEMENT N OT NEEDED THERE COULD BE more than 1 </li> </ul> </li> <li id="5"><a id="5" href="#"><ins> </ins>Root node 2</a></li> </ul> Hi there, this is my first post so forgive me if it is frustrating to those who try to help. I am trying to create a side navigation menu that I want to just be a heading then once clicked it toggles on a list. Each item must be a link to a different webpage. so far i have only managed to create a toggle list but cannot control each item to make it a unique link. I'll post the script I have so far; -------------------------------------------------------------------------- <script language="javascript" type="text/javascript"> function list_colours() { var i=0; var colours = new Array(); colours[0]=<a href="../Yellow Inventory.html"> Yellow </a>; colours[1]=<a href="../Orange Inventory.html">"Orange"</a>; colours[2]=<a href="../Pink Inventory.html">"Pink"</a>; colours[3]=<a href="../Green Inventory.html">"Green"</a>; colours[4]=<a href="../Blue Inventory.html">"Blue"</a>; colours[5]=<a href="../Red Inventory.html">"Red"</a>; var text=""; for(var i=0; i < colours.length; i++) { text = text + colours[i] + "</a><br/>"; } return text; } //creating a toggle menu var onOff = "off" function insertText() { if(onOff == "off") { var paragraph = document.getElementById("colour-items"); var colours_list = list_colours(); paragraph.innerHTML=colours_list; onOff="on" } else { var paragraph = document.getElementById("colour-items"); var colours_list=""; paragraph.innerHTML=colours_list; onOff="off" } } </script> <div id="left-container"> <div id="Nav-title"><h3 onmouseover="insertText();">Colours</h3></div> <p id="colour-items"></p> </div> ------------------------------------------------------------------------- It is my guess that you make the array lists a list of a links, though I can't seem to find the correct way how. The second problem I have is that I have a large number of images of products on my page. I would like 4 headings that contain all my images, like the toggle menu above. so I click the heading and only those images come up. I will be happy to answer any questions that may help. Thanks all. Hi I use dreamweaver to build sites, and so don't really have to do much with the code, however adobe cs5 has removed the navigation bar tool and I am totally lost without it. I know Java script is needed... Could anyone help? If someone has some code ,for a vertical navigation bar with 8 buttons, 3 images for each button, buttonup mouse over and button down (which is of course a link to another page), that I could copy and edit, it would help alot! Hi to all, Sorry to ak this question it may be easy but i didn't got the solution on net please provide the proper answer. My question is : I am defining hyperlink in struts as <a href= Javascript:formSubmit(<bean:write name="AA" property="aa">','<bean:write name="BB" property="bb">) defining function as function formSubmit(Aa,Bb) { document.forms[0].action="/accesingpage.do?method=create&AA=+Aa" ----> in above statement how to pass the second parameter(i.e Bb)....I tried different ways but giving syntax error. please post the ans as soon as possible hello, I'm trying to build a simple function to append and replace an argument in a query string, for example, if my url was like; www.domain.com/page.php?test=123&blah=abc and I want to add on qty=5 like; www.domain.com/page.php?test=123&blah=abc&qty=5 ok, no problem there, however if I now want to update that to qty=6, i get this: http://www.domain.com/page.php?test=...bc&qty=5&qty=6 my code thus far; Code: function AppendURL(){ var AURL = document.getElementById('AddToCartLink'); var numQty = document.getElementById('Qty').value; var TempURL = AURL.href; AURL.href = TempURL + '&Qty=' + numQty; } Hi I am new to javascript programming. Is it possible to append an event handler to a tag dynamically. <input type="button" id="cmdNext" value="Next Page"> i want to be able to programatically loop through the buttons on a page and then add the onClick event. So my finally result will be the following: <input type="button" id="cmdNext" value="Next Page" onClick="CheckValues()"> Since i am new (if possible) can someone provide detail code example so i can break it down and study it before i implement. edit: I further identified the problem. Hi, I'm new to JavaScript and I'm having problem with appending a div node returned from a function. Here's where it crashed: Code: var div=document.getElementById("dashboard_secondary_cat_list"); var s=get_secondary_cat_node(attributes); alert("b4 appendin:"+s); div.appendChild(s); alert("done appendin"); alert("done appendin"); never gets called because the previous line crashes. alert("b4 appendin:"+s); shows: b4 appendin:[object HTMLDivElement] I am trying to make a lightbox type plugin and I am running into a problem. I hope it is something simple that I am overlooking. Here is my code: jQuery.fn.overlay = function() { $(this).click(function() { $('body').append('<div id="over"></div>'); $('#over').fadeIn(); }); }; It (almost) does what it should. It draws the #over div to the screen just fine. The problem is when I try to access it. I try something like this and get no response: $(function() { $('#over').click(function() { alert('moo'); }); }); Its like the element is not getting the ID assigned to it. Does anyone have any ideas? Thanks in advance. I have following JS snippet var t = document.createElement ('div'); t.id = "testDiv"; t.innerHTML = "test content"; window.top.document.getElementById ('anotherDiv').appendchild (t); 'anotherDiv' exists in the document; The statement above is not working in IE I'm seeing JS error. but it works in Firefox (i.e t element is appended to anotherDiv). Can any one please let me know how i can resolve this. |