JavaScript - Using The Same Input Repeatedly?
Basically, I have 3 inputs:
Code: enter your employee's job position <input type="text" name="position" /> describe the position <textarea name="description" /> enter your employee's initial daily wage <input type="text" name="wage" /> What I want to do is have a button that lets you "add another employee". I was thinking I would have an array for each field and then it could get the values from the text boxes, and add the values to the arrays, however the problem is I need to insert this data into a database at some point. How should I go about this? Similar TutorialsHey there everybody, Seems I need help again. Still trying to learn the ways of the javascript. So here is my dilemma: I have a text field and some buttons below it. When I click on the button it insert the text for it into the text field. However, in order for that text to display in the text field a second time in a row I have to click on the text field and then click on the button again. What I would like to be able to do is to click on the button several times in a row so that it inserts the text again and again without having to click on the text field to reselect it. What's wrong with this script that is causing it to work that way? What can I do to fix it? By the way, I will be coupling this code with a popup code. The popup code, which works perfectly fine, has buttons in it as well and insert that text into the main window text area repeatedly. I just need some buttons on my main window that do the same thing. I hope the explanation makes sense. With all of this playing around, I know I'll get the hang of it eventually. I hope. . . Any help is greatly appreciated. Code: <html> <script type="text/javascript"> function insert(el,ins) { window.lstText={}; if (el.setSelectionRange){ el.value = el.value.substring(0,el.selectionStart) + ins + el.value.substring(el.selectionStart,el.selectionEnd) + el.value.substring(el.selectionEnd,el.value.length); } else if (document.selection && document.selection.createRange) { el.focus(); var range = document.selection.createRange(); range.text = ins + range.text; } } </script> <body> <form> <textarea rows="20" cols="100" name="txt1" onfocus="window.lstText=this;"> This is sample text, click anywhere in here then choose on of the buttons above to see text inserted. </textarea><br /><br /> <input type="button" value="Hi" onclick="insert(window.lstText,'Hi')"> <input type="button" value="Bye" onclick="insert(window.lstText,'Bye')"> <br /> </form> </body> </html> I have a problem with adding new inputs to a form (if and when required), Internet Explorer is fine but in Firefox if any previous input fields are filled when the more button is clicked they get reset to blank. JS: Code: fields = 0; function addInput() { if (fields != 100) { document.getElementById('input').innerHTML += "<input type='text' name='input[]' size='30' />"; fields += 1; } else { document.getElementById('input').innerHTML += "<br />Maximum 100 fields allowed."; document.form.add.disabled=true;} } form: Code: <form action="index.php" method="post"> <div id="input"> <input type="text" name="input[]" size="30" maxlength="15" /> </div> <!-- button --> <div id="more"> <input type="button" onclick="addInput()" name="add" value="More" /> </div> <!-- // button --> <input type="submit" name="submit" value="Submit" /> </form> as usual any help is appretiated .. I am thinking this should be fairly easy but yet I am not getting far. I want to have a form with a single text imput field for a zip code. Depending on which zip code the user enters will determine which url they will be sent to. If they enter a zip code which is not in the script, they would be sent to a default url. I am also assuming this can be accomplished with javascript. Any help is greatly appreciated. Hi, i want to set an input value to the same value as the input selected from another input on the same form so when the user selects input 1 i want the hidden input2 to get the same value im guessing i use onsubmit because its hidden so there wont be a focus or blur this would be part of the input Code: onsubmit="(this.value = this.othervalue)" othervalue being the other input name="othervalue" is that the correct syntax Hi, i have an input value array for customer ids, i also need to make a copy of that array into another input element on submit to use for another process. So far here is what i have come up with regarding the js the current html is this Code: <!-- original input --> <input id="cb<?php echo $i;?>" name="cid[]" value="<?php echo $commissions[$i]['id'];?>" onclick="isChecked(this.checked);" type="checkbox" /> <!-- this is new html input which is outside the $i loop that i need a copy of cid[] stored on submit <input type="hidden" name="ids[]" onsubmit="valueTovalue();" /> <!-- here is the js so far --> <script type="text/javascript"> function valueTovalue() { var valin = document.adminForm.cid.value; //cid is the array cid[] document.adminForm.ids.value = valin; //copy the array to the new input element array ids } </script> so basically if they click 1 cid then ids will also show 1, if they click all cid then ids will show all as well. will that work the way i have it, am i even close here.. thanks update: what i have seems to work fine for text values or string values but not for arrays, what am i missing that it wont copy an array? Array ( [cid] => Array ( [0] => 1 ) [task] => remarksonly [remark] => hhhyyy [boxchecked] => 1 [ids] => Array ( [0] => ) ) am i getting closer lol Code: function valueTovalue() { var valin = cid.concat; document.adminForm.ids.value = valin.concat; return(true); this has to be close i hope Code: document.adminForm.ids.value = [].concat(document.adminForm.cid); Hi all can someone guide me (total JS newbie) on this presumably pretty easy task? I have a "parent" page with some text inputs in it (a form). This is what I am after: -when the user clicks a link it pops open a new window via JS - "child" (this is working). -in the "child" window there are also some text inputs (another form) (done). -when the user changes the value for 'testChild_textInput_4' in the child window, then I want it to automatically set this same value, to effectively overwrite, what is currently in 'testParent_textInput_2' in the parent window. Presumably this involves an onChange event, but it is also OK with me if the needful (the text input's value in the parent window being overwritten) happens upon the child window's form submit. If anyone can show me either trick, I would be thrilled! I set up a test page to make this all easy to talk about: http://www.yellow-turtle.com/testDumpMe_parent.html Please let me know! Thanks! -John I need to change input type="text" to input type="password" via JavaScript Code: <form id="login" action="#" method="post"> <input id="username-field" type="text" name="username" title="Username" onmousedown="javascript:this.value=''; javascript:this.focus();" value="Username" tabindex="1" /> <input id="password-field" type="text" name="password" title="Password" onmousedown="javascript:this.value=''; javascript:this.type='password'; javascript:this.focus();" value="Password" tabindex="2" /> <input type="submit" name="submit" value="sign in" tabindex="3" /> </form> This works in Firefox and Safari but not IE So then I tried this code Code: <script type="text/javascript"> function passit(ip){ var np=ip.cloneNode(true); np.type='password'; if(np.value!=ip.value) np.value=ip.value; ip.parentNode.replaceChild(np,ip); } </script> <form id="login" action="#" method="post"> <input id="username-field" type="text" name="username" title="Username" onmousedown="javascript:this.value=''; javascript:this.focus();" value="Username" tabindex="1" /> <input id="password-field" type="text" name="password" title="Password" onmousedown="javascript:this.value=''; passit(this.form[0]); javascript:this.focus();" value="Password" tabindex="2" /> <input type="submit" name="submit" value="sign in" tabindex="3" /> </form> This does what I need but turns the username type to password field not the password box Please can somone help! How can I ask the user for two different numbers and add them?
Hello Everyone, I am trying to set the value of a Input tag with a value retrieved from the cookies. However, it is not working. Here is the script: Code: <html> <head> <title>Example</title> </head> <body> <script type="text/javascript"> document.cookie = "username=John"; var user = get_cookie("username"); document.write ( "Hi " + user + ", welcome to my website!" ); oFormObject.elements["name"].value = user; </script> <center> <br><br><br><br> <form name="register_complaint" action="#"> User Name: <input type="text" size="5" name="name" > <br> <input type="checkbox" name="remeber">Remember Me <br> <input type="button" name="submit" value="Submit Complaint"> </form> </center> <script type="text/javascript"> function get_cookie ( cookie_name ) { var results = document.cookie.match ( '(^|;) ?' + cookie_name + '=([^;]*)(;|$)' ); if ( results ) return ( unescape ( results[2] ) ); else return ""; } </script> </body> </html> Please help me, I've been struggling with this issue for a long time. Cheers How can you get a input box to expand as you type if you exceed X amount of characters?
After searching the web most of the day, nothing has resolved this issue: Code: <!-- ALERT IS NEVER HIT --> <html> <input type="hidden" id="info" name="info" value="testInformation"/> <script type="text/javascript"> var me = document.getElementById('info').value; alert(me); </script> </html> Code: <!-- ALERT SAYS "null" --> <html> <input type="hidden" id="info" name="info" value="testInformation"/> <script type="text/javascript"> var me = document.getElementById('info'); alert(me); </script> </html> Code: <!-- WORKS GREAT, BUT I NEED THE INPUT FIELD HIDDEN --> <html> <input type="text" id="info" name="info" value="testInformation"/> <script type="text/javascript"> var me = document.getElementById('info').value; alert(me); </script> </html> Any idea how I can keep the input value "hidden" and have javascript still see the value? And yes, I've even tried using the "defer" method. Hey guys, have a bit of an issue/question... Not sure what I am doing wrong...i do not know javascript at all lol I have a URL stucture which needs to be changed according to the input fields https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer-jcode-USA-P4038P0122&adminflag=Y This part stays the same at all times https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId= after the "=" sign, I want it to input text from a input box "J-JOE123", so if I put J-DOE123 in the first input box and run the search, I want it to pull up https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId= J-DOE123 after the "J-DOE123", the next part "&vgroupName1=Dealer-" remains the same at all times https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123 &vgroupName1=Dealer- the next input box would have a drop down with 2 selections (jcode and lcode) so depending on which one is chosen, that is how it would populate the URL https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer- jcode next, i would need for it to put a "-" after the chosen jcode or lcode in the URL, which will also be there at all times https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer-jcode - the next input box would have a drop down with 2 selections (USA or CAN) so depending on which one is chosen, that is how it would populate the URL https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer-jcode- USA next, i would need for it to put a "-" after the chosen jcode or lcode in the URL, which will also be there at all times https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer-jcode-USA - next, i will have a drop down box containing several hundred codes such as "P0122" and many more. for this, I would need for the display value to be "P0122" but when the URL gets populated, it would have to be "P4038P0122" https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer-jcode-USA- P4038P0122 The reason why the entire code must change is because P0122 would be P4038P0122, but if it is P0165, it would be N1534P0165, so each code would have its own first part and second part, but in the drop down box, i want it to only display the 2nd part P0122/P0165/etc.. because that is what I go by, but the system only reads full codes. I do have a spreadsheet with the entire list of FULL codes and can do an extract from each cell in order to get the SHORT code. and finally, the URL would have to end with "&adminflag=Y" and will remain the same at all times. https://sls.example.com/Spc/viewUserProfile.do?source=search&UserId=J-DOE123&vgroupName1=Dealer-jcode-USA-P4038P0122 &adminflag=Y So, all together I would have 4 input fields in the form. UserID, jcode/lcode, USA/CAN, and Code. Please help who ever can. If you need more info, please let me know and I shall try my best to explain further. Thanks in advance guys I'm guessing this question will be one of the easiest questions ever posted but I'm just not getting this fix. I have a simple Javascript program that calculates a users pace for their run. The inputs are done through an HTML Form. The user can input hours, minutes, & seconds of their run. Then the distance number & measurment. Then finally the pace desired. I am having some trouble with null values in this program. If I input a 0 in hours and then fill everything out the program works great. 100%! But, if I leave the field blank and hit calculate I get a NaN. I'm guessing I need some kind of statement like if this value is null set it to zero but I am not having any luck with exactly what kind of syntax I need. So here is the code, again not very complex, any help would be greatly appreciated! function calculateTime(){ var time_hour = parseInt(document.getElementById("time_hour").value); var time_min = parseInt(document.getElementById("time_minute").value); var time_sec = parseFloat(document.getElementById("time_second").value); var dist_num = parseFloat(document.getElementById("dist_num").value); var pace_choice = document.getElementById("pace_choice").selectedIndex; var dist_choice = document.getElementById("dist_choice").selectedIndex; var total_sec = (time_hour * 3600) + (time_min * 60) + (time_sec); // Then I'm guessing my if statement would go here somewhere? Hello i am using a simple calendar date picker in which when u click a date is displayed in an input field. Using a javascript i am trying to retrieve data from a second page using this value but probably i am doing something wrong. 1st page: Code: <script type="text/javascript"> function showCustomer(str) { if (str=="") { document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","check6.asp?q="+str,true); xmlhttp.send(); } </script> </head> <body> <form> Check in: <input onchange="showCustomer(this.value)" size="22" id="f_date1" /><button id="f_btn1">...</button> <script type="text/javascript">//<![CDATA[ var cal = Calendar.setup({ onSelect: function(cal) { cal.hide() }, showTime: true }); cal.manageFields("f_btn1", "f_date1", "%Y-%m-%d"); //]]></script> </form> <br /> <div id="txtHint">here...</div> </body> </html> and in second one i am trying to get date like this: Code: sql_cmd.CommandText = "SELECT dbo.rooms.id, type, image, price,details FROM dbo.rooms, dbo.transactions WHERE dbo.rooms.id=dbo.transactions.roomid and '" & request.querystring("q") & "' not between checkin and checkout" Not sure how to describe this. I've been tasked with the responsibility of creating a web form. That's not the problem and I can do that. The trick is, each field needs to be incased in it's own box that flies in from the left. So, the first box that flies in from the left would be email address, when you click enter, it flies off to the right and the next box flies in from the left asking for the persons name. Is it possible to do this and where might I go to learn more about doing this type of coding. Hello. Good day, I'm having a problem with my input text.. I made a button that will increase the value of my input text by 1.. I used this code : Code: document.someForm.someInput.value += 1; the input will display 1111111, why is that? I also tried.. Code: document.someForm.someInput.value + 1; still, it won't work.. how do i put a red border around an input box with a class of .input1 if it goes into this loop?? Code: if(firstName=='' || firstName.length < 3 || firstName=='First Name:' ){ error = 'Please enter your first name'; $j('#errormsg').html('<p class="errors">'+ error +'</p>'); return false; } Hello all, I am pretty new to javascript and could use some help. I am validating a page (image attached) to make sure that total hours entered do not exceed the allocated amount, which is stored in the database. I have already validated to make sure that they enter a number and that it is not greater than 8. Could some one help me with the rest? thanks so much, Joe Code: var returncode = true var inputs = document.getElementsByTagName("INPUT") for(var x=0; x<inputs.length; x++) { if(inputs[x].type =='text' && isNaN(inputs[x].value)) { document.getElementById("hourserror").style.display = "block"; inputs[x].style.backgroundColor = '#FFCCCC'; returncode = false; } if(inputs[x].value > 8) { document.getElementById("totalerror").style.display = "block"; inputs[x].style.backgroundColor = '#FFCCCC'; returncode = false; } } return returncode; I am trying but I can't figure it out, let say you select something on your select values, after selecting that value, how can you dynamically put that value on an input box?
so I am creating a silly word ;irate word interpreter page, and I need some logic behind how to add text to a textarea each time I click on a button. Each time the user clicks on the button, the value is inserted into the text area. You should be able to click on multiple buttons to add to the last text that appears. Then I have a delete translation button when I want to clear the textarea field. A good example would be if the user clicks on the button with the value "sir", than "matey" will appear in the textarea. Now, if the user clicks on the button with the value "your", then "yer" will come up after matey. It's like creating a sentence on your own, and then deleting it when your done. Code: <body> <div id="page"> <div> <img style="float:left" src="slue.gif" width="205" height="190" alt=""> <div> <h1>Pirate Translator</h1> <p>Simply click on the buttons to translate words and/or phrases from English to pirate talk</p> </div> </div><br /> <hr /> <form name="pirate"> <div> <fieldset> <legend><b>Greetings:</b></legend> <input type="button" id="greeting" value="hello" /> <input type="button" id="greeting" value="pardon me" /> <input type="button" id="greeting" value="excuse me" /> <input type="button" id="greeting" value="" /> <input type="button" id="greeting" value="" /> <input type="button" id="greeting" value="" /> </fieldset> </div> <div> <fieldset> <legend><b>People:</b></legend> <input type="button" id="people" value="sir" /> <input type="button" id="people" value="madam" /> <input type="button" id="people" value="miss" /> <input type="button" id="people" value="stranger" /> <input type="button" id="people" value="officer" /> <input type="button" id="people" value="" /> <input type="button" id="people" value="" /> </fieldset> </div> <div> <fieldset> <legend><b>Questions:</b></legend> <input type="button" id="question" value="where is" /> <input type="button" id="question" value="can you help me" /> <input type="button" id="question" value="is that" /> <input type="button" id="question" value="how far is it to" /> <input type="button" id="question" value="" /> <input type="button" id="question" value="" /> <input type="button" id="question" value="" /> <input type="button" id="question" value="" /> </fieldset> </div> <div> <fieldset> <legend><b>Articles:</b></legend> <input type="button" id="article" value="the" /> <input type="button" id="article" value="my" /> <input type="button" id="article" value="your" /> <input type="button" id="article" value="" /> <input type="button" id="article" value="" /> <input type="button" id="article" value="" /> <input type="button" id="article" value="" /> </fieldset> </div> <div> <fieldset> <legend><b>Adjectives:</b></legend> <input type="button" id="adject" value="old" /> <input type="button" id="adject" value="attractiv" /> <input type="button" id="adject" value="happy" /> <input type="button" id="adject" value="" /> <input type="button" id="adject" value="" /> <input type="button" id="adject" value="" /> <input type="button" id="adject" value="" /> </fieldset> </div> <div> <fieldset> <legend><b>Places:</b></legend> <input type="button" id="places" value="restroom" /> <input type="button" id="places" value="restaurant" /> <input type="button" id="places" value="mall" /> <input type="button" id="places" value="hotel" /> <input type="button" id="places" value="pub" /> <input type="button" id="places" value="" /> <input type="button" id="places" value="" /> </fieldset> </div> <div> <fieldset> <legend><b>Desires:</b></legend> <input type="button" id="desire" value="I would like to" /> <input type="button" id="desire" value="I desire" /> <input type="button" id="desire" value="I wish I knew how to" /> <input type="button" id="desire" value="my mother told me to" /> <input type="button" id="desire" value="my campanion tells me to" /> <input type="button" id="desire" value="" /> <input type="button" id="desire" value="" /> </fieldset> </div> <div> <fieldset> <legend><b>Actions:</b></legend> <input type="button" id="action" value="find" /> <input type="button" id="action" value="take a nap" /> <input type="button" id="action" value="kill" /> <input type="button" id="action" value="hurt you" /> <input type="button" id="action" value="beat you up" /> <input type="button" id="action" value="go to the bathroom" /> <input type="button" id="action" value="" /> </fieldset> </div> <div> <p id="output"><textarea id="task_list" rows="5" cols="130"></textarea></p> <p id="output"><input type="button" id="" value="Delete Traslations" /></p> </div> </div> </form> <script src="js/translate.js"></script> </body> </html> |