JavaScript - How To Take Data Entered Into A Textbox And Place It Into The Url?
Hello!
First off, please excuse my ignorance. I am a bit new to the coding world. I want users to be able to enter data into a textbox on my site, and the data then be placed at the end of a specific url, followed by '.html'. For example, say my website is mysite.com. If someone enters in the word "John" in the textbox and clicks the 'Submit' button, the URL should now be: mysite.com/John.html Thanks in advance! Similar TutorialsHi Friends, i have a smal task i.e i have textbox1 ,botton,textbox2 when i enter 21 value then i click button its get in sama row values in textbox2. i have xml file like this <DATAPACKET > <ROWDATA> <R_ID>101</R_ID> <R_NAME>R-12</R_NAME> <R_TEMP>4.266</R_TEMP> <R_COLOR>White</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>20</R_ID> <R_NAME>R-22</R_NAME> <R_TEMP>4.266</R_TEMP> <R_COLOR>Green</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>21</R_ID> <R_NAME>R-32</R_NAME> <R_TEMP>4.266</R_TEMP> <R_COLOR>White</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>104</R_ID> <R_NAME>R-134A</R_NAME> <R_TEMP>4.246</R_TEMP> <R_COLOR>Light Blue</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>21</R_ID> <R_NAME>R-290</R_NAME> <R_TEMP>4.246</R_TEMP> <R_COLOR>White</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>31</R_ID> <R_NAME>R-401A</R_NAME> <R_TEMP>4.246</R_TEMP> <R_COLOR>Pink</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>32</R_ID> <R_NAME>R-401B</R_NAME> <R_TEMP>4.264</R_TEMP> <R_COLOR>White</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>108</R_ID> <R_NAME>R-402A</R_NAME> <R_TEMP>4.426</R_TEMP> <R_COLOR>Light Greem</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>129</R_ID> <R_NAME>R-402B</R_NAME> <R_TEMP>4.266</R_TEMP> <R_COLOR>White</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>110</R_ID> <R_NAME>R-404A</R_NAME> <R_TEMP>4.246</R_TEMP> <R_COLOR>Orange</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>121</R_ID> <R_NAME>R-407A</R_NAME> <R_TEMP>4.267</R_TEMP> <R_COLOR>White</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>122</R_ID> <R_NAME>R-408A</R_NAME> <R_TEMP>4.267</R_TEMP> <R_COLOR>White</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>113</R_ID> <R_NAME>R-409A</R_NAME> <R_TEMP>4.267</R_TEMP> <R_COLOR>White</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>134</R_ID> <R_NAME>R-407C</R_NAME> <R_TEMP>4.264</R_TEMP> <R_COLOR>White</R_COLOR> </ROWDATA> <ROWDATA> <R_ID>115</R_ID> <R_NAME>R-410A</R_NAME> <R_TEMP>4.426</R_TEMP> <R_COLOR>White</R_COLOR> </ROWDATA> </DATAPACKET > then i try this hear i get all values function gettxt() { results = new Array; var searchterm = document.getElementById("searchme").value; if (searchterm == null || searchterm == "") { alert("Enter textbox value"); return false; } var istrlen1 = searchterm.length; var tempname1; if (istrlen1 == 1) { tempname1 = searchterm; } if (istrlen1 == 2) { tempname1 = searchterm; } if (istrlen1 == 3) { tempname1 = searchterm; } if (istrlen1 == 4) { tempname1 = searchterm; } for (i = 0; i < x.length; i++) { var name = x[i].getElementsByTagName("R_ID")[0].firstChild.nodeValue; var name1 = x[i].getElementsByTagName("R_NAME")[0].firstChild.nodeValue; var exp = new RegExp(tempname1, "i"); if (name.match(exp) != null) { y = y + 1; results.push(name1); } } textbox2.value = results; } i try the above code hear small problom when i enter 21 and click button its display 21,121,123... related values i dont want like that for example textbox1=21 buttonclick textbox2=R-32,r-407A,r-408A like that i dont want like that i want textbox1=21 buttonclick textbox2=R-32 only in same row value please any one knows well in js please resolve my problom Hello, I am not well-versed with javascript. Actually i have some calculations has to be displayed in total (textbox) as soon as i enter the values in other text box. I have done that. But if multiple rows added (its dynamically added ) that code doesn't work for 2nd row or 3rd row... I don't know how to do it. Here is my form where i am entering data and displaying result Code: <input type="text" class="span2" name="item[]" id="category" value="<?php echo $row1['item'];?>" /> <input type="text" class="span1" name="uom[]" id="category" value="<?php echo $row1['uom'];?>" /> <input type="text" name="description[]" id="category" value="<?php echo $row1['description'];?>" /> <input type="text" class="span1" name="quantity[]" id="qty" onkeyup="getValues(1)" /> <input type="text" class="span1" name="price[]" id="price" value="<?php echo $row1['selling_price'];?>" onkeyup="getValues(2)" /> <input type="text" class="span1" name="discount[]" id="discount" value="<?php echo $row1['discount'];?>" onkeyup="getValues(3)" /> <select name="tax[]" class="span1" id="tax" onkeyup="getValues(4)"> <option value="<?php echo $row1['tax'];?>"><?php echo $row1['tax'];?></option> <?php $l1 = mysql_query("select * from taxes") or die (mysql_error()); while($l2 = mysql_fetch_array($l1)) { ?> <option value="<?php echo $l2['rate']; ?>"> <?php echo $l2['name'];?> - <?php echo $l2['rate'];?>% </option> <?php } ?> </select> <input type="text" class="span1" name="freight[]" id="freight" onkeyup="getValues(5)" placeholder="Freight" /> <!--<input type="text" class="span1" name="freight_tax[]" id="frtax" placeholder="Frt Tax" /> --> <input type="text" class="span2" name="total[]" id="total" /> And java script Code: <script language="javascript"> function getValues(val){ var numVal1=parseInt(document.getElementById("qty").value); var numVal2=parseInt(document.getElementById("price").value); var numVal3=parseInt(document.getElementById("discount").value); var numVal4=parseFloat(document.getElementById("tax").value); var numVal5=parseFloat(document.getElementById("freight").value); var sub_total = (numVal1 * numVal2) - numVal3; var subt_tax = sub_total * (numVal4/100); var total = parseFloat(sub_total + subt_tax); var totalValue = parseFloat(total + numVal5); document.getElementById("total").value = totalValue; } </script> Hi friends, i have xnl file like <DATAPACKET > <data1> <R_ID>101</R_ID> <R_PRE>38</R_PRE> <R_PRE2>39</R_PRE2> <R_TEMP>8.35</R_TEMP> <R_TENP2>0.64</R_TENP2> </data1> <data1> <R_ID>102</R_ID> <R_PRE>36</R_PRE> <R_PRE2>37</R_PRE2> <R_TEMP>7.23</R_TEMP> <R_TENP2>1.21</R_TENP2> </data1> <data1> <R_ID>103</R_ID> <R_PRE>34</R_PRE> <R_PRE2>36</R_PRE2> <R_TEMP>7.21</R_TEMP> <R_TENP2>1.95</R_TENP2> </data1> <data1> <R_ID>104</R_ID> <R_PRE>32</R_PRE> <R_PRE2>35</R_PRE2> <R_TEMP>6.25</R_TEMP> <R_TENP2>2.30</R_TENP2> </data1> <data1> <DATAPACKET > then i have textbox...when i type 101 its go and get all data in the row in text area like 101 32 6025 2.30 please give me any idea how to do this i m try this if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp = new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("GET", "Refrigerater.xml", false); xmlhttp.send(); xmlDoc = xmlhttp.responseXML; x = xmlDoc.getElementsByTagName("ROWDATA"); //x = xmlDoc.getElementsByTagName("data1"); function displayInfo(selBox) { x = xmlDoc.getElementsByTagName("ROWDATA"); var col = (selBox.options[selBox.selectedIndex].text); document.getElementById("show").innerHTML = " " + col; } Please resolve my problem Thanks Venkat.S Hi.. I have form and i want to input data using barcode and it will display on textbox and after input on the first textbox the focus will go to next textbox untill it will go on the last textbox and on the last textbox it will automatically save the data's on the database. How is it possible? here is my sample code: Code: <?php error_reporting(0); date_default_timezone_set("Asia/Singapore"); //set the time zone $con = mysql_connect('localhost', 'root',''); if (!$con) { echo 'failed'; die(); } mysql_select_db("mes", $con); ?> <html> <head> <script type="text/javascript"> function ini() { // Retrieve the code var code =document.getElementById ("code_read_box1").value; var code =document.getElementById ("code_read_box2").value; var code =document.getElementById ("code_read_box3").value; var code =document.getElementById ("code_read_box4").value; var code =document.getElementById ("code_read_box5").value; var code =document.getElementById ("code_read_box6").value; // Return false to prevent the form to submit return false; } </script> </head> <body onLoad="document.barcode.code_read_box1.focus()"> <form name=barcode onsubmit = "return ini()"> <input type="text" id="code_read_box1" value="" /><br/> <input type="text" id="code_read_box2" value="" /><br/> <input type="text" id="code_read_box3" value="" /><br/> <input type="text" id="code_read_box4" value="" /><br/> <input type="text" id="code_read_box5" value="" /><br/> <input type="text" id="code_read_box6" value="" /><br/> </form> </body> </html> It will be best to use server side scripting like php for it , because user can disable his javascript in that condition your code won't work
I have 2 text boxes on my page. When the user clicks in one text box, I would like whatever is in there to be copied to the other text box. Is this possible? I have looked into it and onClick seems like it might do it but I can't get it to work. Thanks. hi there, i wish there could be solution to this as I cannot figure how to do it. I would like to have an autocopy and paste data from a page to a textbox...Like if a webpage has the details like receive from: and receive to:, can this text be autocopied to a textbox on a click of a button? the text box is place on another webpage, so there are basically two webpages, 1st page is where the data to be copied is contained while the 2nd webpage is where the textbox is contained. the data to be copied on the 1st page are the contents of received from: and recieved to: like receive from:edward receive to:jacob. So with a click of a button I would like the contents receive from:edward receive to:jacob be copied and pasted on the text box from another page... I hope this sounds clear enough...sorry to be a pain... regards, verve Hi.. I just want to know how does it happen that when I scan the barcode using barcode scanner it will automatically put on the first textbox, then the focus will go to the next textbox and on the last textbox will automatically save the data to database. here is my sample form. PHP Code: <?php error_reporting(0); date_default_timezone_set("Asia/Singapore"); //set the time zone $con = mysql_connect('localhost', 'root',''); if (!$con) { echo 'failed'; die(); } mysql_select_db("mes", $con); $sr_date =date('Y-m-d H:i:s'); $sql = "SELECT sr_number FROM receiving_materials ORDER BY sr_date DESC LIMIT 1"; $result = mysql_query($sql, $con); if (!$result) { echo 'failed'; die(); } $total = mysql_num_rows($result); if ($total <= 0) { $currentSRNum = 1; $currentYear = (int)(date('y')); $currentMonth = (int)(date('m')); $currentDay = (int)(date('d')); $currentSRYMD = substr($row['sr_number'], 0, 6); $currentYMD = date("ymd"); if ($currentYMD > $currentSRYMD) { $currentSRNum = 1; } else { $currentSRNum += 1; } } else { //------------------------------------------------------------------------------------------------------------------ // Stock Number iteration.... $row = mysql_fetch_assoc($result); $currentSRNum = (int)(substr($row['sr_number'],0,3)); $currentSRYear = (int)(substr($row['sr_number'],2,2)); $currentSRMonth = (int)(substr($row['sr_number'],0,2)); $currentSRNum = (int)(substr($row['sr_number'],6,4)); $currentYear = (int)(date('y')); $currentMonth = (int)(date('m')); $currentDay = (int)(date('d')); $currentSRYMD = substr($row['sr_number'], 0, 6); $currentYMD = date("ymd"); if ($currentYMD > $currentSRYMD) { $currentSRNum = 1; } else { $currentSRNum += 1; } } //------------------------------------------------------------------------------------------------------------------ $yearMonth = date('ymd'); $currentSR = $currentYMD . sprintf("%04d", $currentSRNum); ?> <html> <title>Receiving Materials</title> <head> <link rel="stylesheet" type="text/css" href="kanban.css" /> <style type="text/css"> #SR_date{ position: relative; font-family: Arial, Helvetica, sans-serif; font-size: .9em; margin-left: 10px; width: auto; height: auto; float: left; top : 10px; } </style> </head> <body> <form name="receiving_form" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post"> <div id="SR_date"> <label>Date :</label> <input type="text" name="sr_date" value="<?php echo $sr_date; ?>" size="16" readonly="readonly" style="border: none;"> </div> <div id="SR_number"> <label>RM# :</label> <input type="text" name="sr_number" value="<?php echo $currentSR; ?>" size="9" readonly="readonly" style="font-weight: bold; border: none;"> </div> <div id="SI_number"> <label class="LLabelRM">SI/DR# :</label> <input type="text" name="si_num" id="si_num" class="LFieldRM" value="" size="25"> <br/></br/> <label class="LLabelRM">Supplier Name :</label> <input type="text" name="s_name" id="s_name" class="LFieldRM" value="" size="25"> <br/></br/> <label class="LLabelSecRM">PO # :</label> <input type="text" name="po_num" id="po_num" class="LFieldSecRM" value="" size="25"> <label class="LLabelSecRM">Quantity :</label> <input type="text" name="qty" id="qty" class="LFieldSec1RM" value="" size="25"> <br/> <br/> <label class="LLabelSecRM">Material Code :</label> <input type="text" name="mat_code" id="mat_code" class="LFieldSecRM" value="" size="25"> <label class="LLabelSecRM">Material Desc. :</label> <input type="text" name="mat_desc" id="mat_desc" class="LFieldSec1RM" value="" size="25"> <br/></br/> <label class="LLabelSecRM">WH Code :</label> <input type="text" name="wh_code" id="wh_code" class="LFieldSecRM" value="" size="25"> <label class="LLabelSecRM">BIN Location :</label> <input type="text" name="bin_loc" id="bin_loc" class="LFieldSec1RM" value="" size="25"> </div> </form> </body> </html> Thank you Hello. I've been teaching myself HTML and CSS for a while, and now I've moved into the world of Javascript (but I'm still very much a beginner). For practice, I've been building a sample sign up form for a mock website, and I'm having problems with the birthdate section. The idea I had was to have MM, DD, and YYYY be the default values of my 3 textboxes (as an example for users), then set the value to nothing when the box gained focus. That all works fine, but I ran into problems when I tried to write an if statement to set the value back to MM, DD, or YYYY if the value was still nothing when the user clicked away. As it is now it just replaces the text inputted into the textbox (which of course is not good). Any ideas for what the problem might be? Code: <form name="signup" action="javascript:void(0);" method="post"> <table> <tr> <td>Date Of Birth:</td> <td> <input name="DOBmonth" type="text" value="MM" size="2" style="color: #555555;" onFocus="clearDOBmonth()" onBlur="restoreDOBmonth()" /> <input name="DOBday" type="text" value="DD" size="2" style="color: #555555;" onFocus="clearDOBday()" /> <input name="DOByear" type="text" value="YYYY" size="4" style="color: #555555;" onFocus="clearDOByear()" /></td> </tr> <tr> <td></td> <td><button name="Submit" type="submit" style="font-size: 1em;">Sign Up</button></td> </tr> </table> </form> <script type="text/javascript" language="javascript"> <!-- document.signup.DOBmonth.value="MM"; document.signup.DOBday.value="DD"; document.signup.DOByear.value="YYYY"; function clearDOBmonth() { document.signup.DOBmonth.value="";} function clearDOBday() { document.signup.DOBday.value="";} function clearDOByear() { document.signup.DOByear.value="";} function restoreDOBmonth() { if ('document.signup.DOBmonth.value = ""') { document.signup.DOBmonth.value = "MM"; // alert(document.signup.DOBmonth.value); } } //--> </script> Another side question, if I set a variable equal to the value of a textbox, then change the value of the variable, does that also change the value of the textbox? or is the variable no longer associated with the textbox. Example: Code: var a = document.form.textbox.value; a = blue; does document.form.textbox.value = blue? or is var a now completely independent of the textbox value? Thanks! I have the following code that I wrote myself (except for the function isNumberKey). However, I don't know how to actually add the numbers together. My plan is to store the value entered in the forms as a variable, then manipulate the variables to get my final number. The final number would be stored in variable named Total and would be displayed after Total: at the bottom of my page. Could anyone help me? I can provide additional information if you need it. Code: <HTML> <TITLE>Magazine Prices </TITLE> <BODY> <SCRIPT language=Javascript> <!-- Price = oForm.elements["price"].value; Quantity = oForm.elements["quantity"].value; Subtotal = oForm.elements["subtotal"].value; Shipping = oForm.elements["shipping"].value; function isNumberKey(evt) { var charCode = (evt.which) ? evt.which : event.keyCode if (charCode > 31 && (charCode < 48 || charCode > 57)) return false; return true; } //--> </SCRIPT> <!-- Price * Quantity = Subtotal. Subtotal value should fill in automatically in the Subtotal input field. Subtotal * Shipping = Total. //--> <TABLE> <TR><TD>Price: </TD><TD><INPUT id="Price" name="Price" onkeypress="return isNumberKey(event)" type="text" name="txtChar"> </TD></TR> <TR><TD>Quantity:</TD> <TD><INPUT id="Quantity" name="Quantity" onkeypress="return isNumberKey(event)" type="text" name="txtChar"> </TD></TR> <TR><TD>Subtotal:</TD> <TD><INPUT id="Subtotal" name="Subtotal" onkeypress="return isNumberKey(event)" type="text" readonly="readonly" name="txtChar"> </TD></TR> <TR><TD>Shipping:</TD> <TD><INPUT id="Shipping" name="Shipping" onkeypress="return isNumberKey(event)" type="text" value="10%" readonly="readonly" name="txtChar"> </TD></TR> </TABLE> <b>Total: </b> </BODY> </HTML> Hey friends, I'm writing a program but I'm having issues. I need to write a program that asks for 3 different numbers (prompt boxes) and determine which number entered was the highest and the 2nd highest. I know what to do for the input and output but I don't know what to do during the processing.
Hi, I am trying to write a small javascript program where I can call the following two functions and store information which a user enters. The problem is if I call the function a second time to add more information the array gets overwritten. info () insert (name, surname, favouriteColour) function info () { name = prompt ("Please enter your name."); surname = prompt ("Please enter your surname."); favouriteColour = prompt ("Please enter your favourite colour."); } function insert (name, surname, favouriteColour) { var info = new Array (); info.name = name; info.surname = surname; info.favouriteColour = favouriteColour; return info }; Help is really appreciated.. Hello Everyone, I am inexperienced in JavaScript. I have an html page with several numeric input fields which are an array. At the bottom of the screen is a running total of the numbers entered. The html is like: <INPUT TYPE=TEXT NAME='array[0]' onchange='addup()'> <INPUT TYPE=TEXT NAME='array[1]' onchange='addup()'> etc..... <INPUT TYPE=TEXT NAME='array[9]' onchange='addup()'> <INPUT TYPE=TEXT NAME='arraytotal'> The javascript is: function addup() { var total = 0; for (var i=0; i<=10; i++) { total += Number(document.forms["formname"]["array["+i+"]"].value); } document.forms["formname"]["arraytotal"].value = total; } This works ok, but I don't want the field arraytotal to be an input field. How can I do this please? I have a page with textarea where user can enter html code for link exchange I need to verify whether the code entered contains url in anchor's href tag having same url as that of reciprocal link how can i do this Hi everyone, new here. I'm trying to write a program that displays what a user has entered, it processes it, and displays it backwards This is what I have so far, Code: <script type="text/javascript"> var input ("Please enter a sentance","") So really this is what it needs to display. "The sentance you entered are "Hi people"" "The sentance in REVERSE order are "elpoep iH" If anyone can help, it would be awesome, since I'm a noob at this. Brand new to the forum, so first off... Hello all!! I have been working on a project which randomly changes the text font of a word submitted (Color and Size). At present the code works fine, using the below Javascript. Code: <SCRIPT LANGUAGE="JavaScript"> function randomise(){ var words=document.myform.wordlist.value; var spacer=""; words=words.split(document.myform.randomiseby.value) document.myform.code.value=" "; var colourscheme=new Array("0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F") for(var time=0;time<=(words.length-1);time++){ {var c1=Math.round(Math.random()*(colourscheme.length-1)); var c2=Math.round(Math.random()*(colourscheme.length-1)); var c3=Math.round(Math.random()*(colourscheme.length-1)); var c4=Math.round(Math.random()*(colourscheme.length-1)); var c5=Math.round(Math.random()*(colourscheme.length-1)); var c6=Math.round(Math.random()*(colourscheme.length-1)); var size=1+Math.round(Math.random()*6); document.myform.code.value+="<font color=\"#"+colourscheme[c1]+colourscheme[c2]+colourscheme[c3]+colourscheme[c4]+colourscheme[c5]+colourscheme[c6]+"\" size=\""+size+"\">"+words[time]+"</font>"+spacer+" "; } } looks_like.innerHTML=document.myform.code.value; } </script> To really highlight the text i would like to keep the font white and change the background colour but i don't have a clue how to do it... Please note: i am a complete noob to Javascript and the above code has been bodged together from a number of tutorials. Can anyone help? Hello, I have a form that works out some basic math questions e.g. area etc. I run a function when a form field is updated to do the calculations, however I'd like to run a different calculation depending on which form element was updated. Is there a way to say something like: if (area1 was updated) { work out this calculation } if(area2 was updated) { work out this calculation } and so on? Thanks, Nicola Hello! I need some help here. I need to pre-populate a name and a phone number box based on what's entered in the employee id box. By entering in the employee id - EMPLOYEE ID: [JOHN R] It automatically fills in - Employee Name: [John Roberts] Employee Phone: [1234567890] Thanks. Hi, I am trying to only allow a person to enter alpha characters in this field and if they try to enter a number a pop up box will tell them they can only enter alpha characters. Can this be done? Here is my code: How would you like us to address you? ("Dear Pat" Dear <input name="SALUT" type="text" id="address2" style="color: #000000; border-left: 0px solid #008000; border-right: 0px solid #254D78; border-top: 0px solid #008000; border-bottom: 2px solid #0033CC; background-color: #EBE1BE" tabindex="5" size="15" maxlength="50" onFocus="if(this.value=='SALUT')this.value='';"> Any help would be greatly appreciated. Thanks |