JavaScript - Parsing A Url To Pull A Single Item And Place It Into A Form Field
Hello all.
I have created a snippet of javascript code that will do the following: 1. read the window URL 2. depending on the window URL, a word will be placed into a hidden form field. 3. Person submits form...etc., etc. Here is what I have. Let's say that I have a single landing page with a simple form on it. I would like to reference the referred URL by pulling a part of the window URL into a hidden field of the form. Let's say the three URLs a http://www.whatever.com/index.htm?id=ref1 http://www.whatever.com/index.htm?id=ref2 http://www.whatever.com/index.htm?id=ref3 I have created a javascript that takes the exact URL and check for equality. If the URL is equal, it will place the corresponding id into the hidden form field. See my code below. Code: <script type="text/javascript"> var lead_source = window.location.href { if (lead_source == "http://www.whatever.com/index.htm?id=ref1") { document.writeln("<input type=hidden name='lead_source' id='lead_source' value='ref1'>"); } else if (lead_source == "http://www.whatever.com/index.htm?id=ref2") { document.writeln("<input type=hidden name='lead_source' id='lead_source' value='ref2'>"); } else if (lead_source == "http://www.whatever.com/index.htm?id=ref3") { document.writeln("<input type=hidden name='lead_source' id='lead_source' value='ref3'>"); } } </script> What I am looking to do is modify the code to only look at the "id" variable, not the entire URL. That way, if I add any additional items to the URL I will not have to change the code. I guess I am looking for an extra step of parsing the URL...maybe. Thanks for your help Similar TutorialsHi all I have relatively easy task I need to accomplish but as per usual I have very little idea of how to do it. I have done a google search to no avail. Basically I need to: 1. Pull a value from inside a div Code: <div id="number">(invoice #1017)</span> 2. Populate a form input field with that value. Does this make sense? If not let me know if you need any more info. Thanks I'm trying to add the ui autocomplete function to some form fields using a facebook style, but I'm not sure how to get more than one value to actually pass to the form field. As my script is now it only takes the last selected value into the hidden form field. Here's my current script: Code: <div id="editcbprofileinterests"> <div id="formWrap"> <div id="interests" class="ui-helper-clearfix"> <input id="cb_intereststerm" type="text"> <input id="cb_interests" name="cb_interests" type="hidden"> </div> </div></div> <script type="text/javascript" src="autocomplete/js/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="autocomplete/js/jquery-ui-1.8.custom.min.js"></script> <script type="text/javascript"> $(function(){ //attach autocomplete $("#cb_intereststerm").autocomplete({ //define callback to format results source: function(req, add){ //pass request to server $.getJSON("autocomplete/autocominterests.php?callback=?", req, function(data) { //create array for response objects var suggestions = []; //process response $.each(data, function(i, val){ suggestions.push(val.cb_intereststerm); }); //pass array to callback add(suggestions); }); }, //define select handler select: function(event, ui) { //create formatted interest var interest = ui.item.value, span = $("<span>").text(interest), a = $("<a>").addClass("remove").attr({ href: "javascript:", title: "Remove " + interest }).text("x").appendTo(span); //add interest to interests div span.insertBefore("#cb_intereststerm"); //add interest to hidden form field $('input[name=cb_interests]').val(interest); }, //define select handler change: function() { //prevent 'to' field being updated and correct position $("#cb_intereststerm").val("").css("top", 2); } }); //add click handler to activities div $("#interests").click(function(){ //focus 'to' field $("#cb_intereststerm").focus(); }); //add live handler for clicks on remove links $(".remove", document.getElementById("interest")).live("click", function(){ //remove current activity $(this).parent().remove(); //correct 'to' field position if($("#interests span").length === 0) { $("#cb_intereststerm").css("top", 0); } }); }); </script> Can someone help me I am trying to get these two values, firstname and lastname to both go into the same output box on a form. I want them to show up alongside one another like so nameform.output2.value=firstname + " " + lastname; but the values are assigned within seperate if statements as you can see below.. so I dont know how to get them to merge.. I am kinda new with javascript so any help will be very useful. Thakns very much. Code: function checkform(nameform){ var firstname=new Array(); firstname[0]="johndefinition"; firstname[1]="jamesdefinition"; var lastname=new Array(); lastname[0]="smithdefinition"; lastname[1]="simpsondefinition"; if (document.getElementById("namebox").value.indexOf("John")!=-1) {nameform.output2.value= firstname[0];} if (document.getElementById("namebox").value.indexOf("James")!=-1) {nameform.output2.value= firstname[1];} if (document.getElementById("namebox").value.indexOf("Smith")!=-1) {nameform.output2.value=lastname[0];} if (document.getElementById("namebox").value.indexOf("Simpson")!=-1) {nameform.output2.value=lastname[1];} } Hello i need help with a simple single field javascript login form, i am building a small website for I and my classmates. i want it to be able to redirect each user to a specific page when a corresponding passcode is entered, i know its unsafe but we dont plan on keeping valuable information on the site, i dont know about MSQL and dont even wish to use it, the code works at this level but am unable to add users since i dont understand javascript if someone could help me i will be very grateful thanks in advance /*here is the code i got so far*/ <tittle> Enter Passcode to proceed </title> <h1 style="font-family:Comic Sans Ms;text-align="center";font-size:20pt; color:#00FF00;> </h1> <form name="login"> Passcode: <input type="text" name="userid"/> <input type="button" onclick="check(this.form)" value="Login"/> <input type="reset" value="Cancel"/> </form> <script language="javascript"> function check(form)/*function to check userid */ { if(form.userid.value == "JohnDoe") /* checkes userid */ { window.open("johndoe.php")/*target page */ } else { alert("Invalid Passcode, please try again!")/*error message*/ } } Hey all, Objective: - when you select other the pull down menu is replaced by the text field. Currently: - Gotten it to the level of when you select the other the text field appears. Question: - HOw can I modify the code so when I select the other menu option from the pull down menu and it replaced by the text field? Quote: <script type="text/javascript"> function togglefield(val) { var o = document.getElementById('other'); (val == 'Other')? o.style.display = 'block' : o.style.display = 'none'; } </script> and the form: <form action="" method="post"> <select name="sel" id="sel" onChange="togglefield(this.value);"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="Other">Other</option> </select> <input type="text" name="other" id="other" style="display: none;"> </form> Hello everyone, I have done a lot of research looking for answers on this one but unable to find anything that helps. I have a couple of questions on a page and each are contained in there own form. The questions themselves use checkboxes. I would like the page to not refresh and jump to the top of the page after they submit there answer. So on questions that use radio buttons I have been using Code: <input type="submit" value="Submit" onclick="get_radio_value(); return false;" /> for the submit buttion and that works perfect. I try and use it on questions that use checkboxes and it doesnt work so as a work around I am using the form's action attribute to set it to a link on the page. Here is my form code: Code: <form name="question2" action="#q2">2. <strong>Multiple choice:</strong><a name="q2"></a> Which patient or patients could be transferred to another hospital under the EMTALA Act?<br /> <input type="checkbox" value="a" name="aquestion" />Smith, Bill<br /><input type="checkbox" value="b" name="bquestion" />Wells, Patricia<br /> <input type="checkbox" value="c" name="cquestion" />Hamilton, Larry<br /> <input type="checkbox" value="d" name="dquestion" />Rodriquez, Brad<br /><input type="checkbox" value="e" name="equestion" />Baker, Madison<br /><input type="checkbox" value="f" name="fquestion" />Kahn, Brent<br /> <input type="checkbox" value="g" name="gquestion" />Cahill, Mark<br /><input type="submit" onclick="get_radio2_value()" value="Submit" /></form> <script type="text/javascript" src="first_triage_java_clinical.js"> </script> and here is the javascript code if it helps: Code: function get_radio2_value() { var w = 400; var h = 400; var wleft = (screen.width/2)-(w/2); var wtop = (screen.height/2)-(h/2); var wrong = "<html><head><style type='text/css'> * {margin: 0; padding:0; border:0;}</style>\ <title>Incorrect, try again!</title></head><body><bgsound src='Plbt.wav'>\ <a href='javascript:window.close()'><img src='wrong.jpg'></a></body></html>"; var right = "<html><head><style type='text/css'> * {margin: 0; padding:0; border:0;}</style>\ <title>You are Correct!</title></head><body>\ <a href='javascript:window.close()'><img src='right.jpg'></a></body></html>"; var correct = "false"; if (document.question2.cquestion.checked) { if(document.question2.dquestion.checked) { if(document.question2.equestion.checked) { if(document.question2.fquestion.checked) { if(document.question2.gquestion.checked) { var correct = "true"; } } } } } if (document.question2.aquestion.checked) { var correct = "false"; } if (document.question2.bquestion.checked) { var correct = "false"; } if (correct != "true") { var popup = window.open('','','resizeable=no,scrollbars=no,width=221,height=112, top='+ wtop +', left='+ wleft); popup.document.write(wrong); pops.document.close(); } else { var popup = window.open('','','resizeable=no,scrollbars=no,width=221,height=112, top='+ wtop +', left='+ wleft); popup.document.write(right); pops.document.close(); } } Hi Peers, i have a Drop down list with 10 choices (skillset). users must choose one skillset and the corresponding level (beginer/intermediate/master). ( they have to do this 10 times for all the sillsets) what i want is : 1 - i need to show up only one record (dropdowanlist) with level then have a button to add new skill and level if required 2- then when they choose the 1st skill from the dropdown , this one will not show up on the 2nd choice dropdown. is it possible any help ? thanks guys Hello, I am trying to assign a variable using a form value, but it returns as undefined. However, if I directly set em (uncomment them), it works. Why are my values not working? Code: <script type="text/javascript"> //lichbloom = 2; //frostlotus = 5; lichbloom = document.endlessragevalue.lichbloom.value; frostlotus = document.endlessragevalue.frostlotus.value; var endlessrage = lichbloom+frostlotus; </script> <form name="endlessragevalue" id="endlessragevalue"> Lichbloom <input type="text" size="20" name="lichbloom" value="2" /><br /> Frost Lotus <input type="text" size="20" name="frostlotus" value="5" /><br /> <script type="text/javascript">document.write(endlessrage);</script> </form> thanks for looking! I'm still a relative noob and i'm wondering if anyone can help. items use a structured form, so any item in that category will display on the same form when selected i want to have the save button run its normal save on all items except 1 specific item - on the 1 item i want to have it function as a save as copy (while still having "save" as its visible text), the current code set in a drop down list is $options[] = array( 'text' => 'JSAVE', 'task' => $this->getName() . '.save'); $options[] = array( 'text' => 'Save as new project', 'task' => $this->getName() . '.save2copy', 'options' => array('access' => ($this->item->id > 0))); can anyone offer any suggestions? really stuck on this one I've set up a mock registration form page so I can learn a bit about javascript's form validation. (newbie) I want to try to attempt to style the border of a form field green when the user enters the correct info into the form text field and red on all other fields if the user doesnt enter any info into them. When i test it, enter the right info into the username field, leave the others blank, and hit the submit button it styles the username field green ok but it doesnt make the next fields (password and so on) red. Could someone please explain what I am doing wrong? here is my code so far... Note: just for testing purposes I've put return false on everything so it displays a message when everythings ok. Code: .... <script type="text/javascript"> window.onload = function() { document.forms[0].username.focus(); } function validate(form) { var form = document.getElementById("reg"); var e = document.getElementById("error"); e.style.background = "red"; for(var i = 0; i < form.elements.length; i++) { var el = form.elements[i]; if(el.type == "text" || el.type == "password") { if(el.value == "") { e.innerHTML = "Please fill in all fields!"; el.style.border = "1px solid red"; el.focus(); return false; } else { el.style.border = "1px solid green"; return false; } } } var un = form.username; un.value = un.value.replace(/^\s+|\s+$/g,""); if((un.value.length < 3)|| (/[^a-z0-9\_]/gi.test(un.value))) { e.innerHTML = "Only letters,numbers and the underscore are allowed (no spaces) - 3-16 characters"; un.focus(); return false; } var pw = form.password; pw.value = pw.value.replace(/^\s+|\s+$/g,""); if((pw.value.length < 3) || (/[^a-z0-9]/gi.test(pw.value))) { e.innerHTML = "Only letters and numbers are allowed (no spaces) - 3-16 characters"; pw.focus(); return false; } e.innerHTML = "You filled in all the fields, well done!"; e.style.background = "green"; return false; } </script> </head> <body> <div id="wrapper"> <div id="header"> <h1>My Cool Website</h1> </div> <div id="content"> <div class="padding"> <h2>Registration</h2> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem, consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae purus. Aenean viverra malesuada libero. Fusce ac quam. Donec neque. Nunc venenatis enim nec quam. Cras faucibus, justo vel accumsan aliquam, tellus dui fringilla quam, in condimentum augue lorem non tellus. Pellentesque id arcu non sem placerat iaculis. Curabitur posuere, pede vitae lacinia accumsan, enim nibh elementum orci, ut volutpat eros sapien nec sapien. Suspendisse neque arcu, ultrices commodo, pellentesque sit amet, ultricies ut, ipsum. Mauris et eros eget erat dapibus mollis. Mauris laoreet posuere odio. Nam ipsum ligula, ullamcorper eu, fringilla at, lacinia ut, augue. Nullam nunc.</p> <form id="reg" action="#" method="post" onsubmit="return validate(this)"> <div id="error"></div> <div><label for="username">Username</label></div> <div><input type="text" name="username" id="username" size="30" maxlength="16" /></div> <div><label for="password">Password</label></div> <div><input type="password" name="password" id="password" size="30" maxlength="16" /></div> <div><label for="c_password">Confirm Password</label></div> <div><input type="password" name="c_password" id="c_password" size="30" maxlength="16" /></div> <div><label for="email">Email address</label></div> <div><input type="text" name="email" id="email" size="30" maxlength="200" /></div> <div><label for="c_email">Confirm Email address</label></div> <div><input type="text" name="c_email" id="c_email" size="30" maxlength="200" /></div> <div><label for="firstname">First name</label></div> <div><input type="text" name="firstname" id="firstname" size="30" maxlength="100" /></div> <div><label for="surname">Surname</label></div> <div><input type="text" name="surname" id="surname" size="30" maxlength="100" /></div> <div><label for="gender">Gender</label></div> <div> <div><input type="radio" name="gender" id="gender" value="m" checked="checked" />Male</div> <div><input type="radio" name="gender" value="f" />Female</div> </div> <div><input type="submit" value="Register" name="submit" /></div> </form> </div> </div> <div id="footer"> <p>Copyright © 2009 My Cool Website</p> </div> </div> </body> </html> How can I add a form field value to a url. I tried the below but it no work. Code: href="index2.php?q=4&id=+document.theForm.lists.value+&picklist" function checkValidFormInput() { if (document.getElementsByName('customerName').value != '') { document.getElementById('customerNameImg').innerHTML = '<img alt="Valid" src="images/greenTick.png">'; } else { document.getElementById('customerNameImg').innerHTML = '<img alt="Invalid" src="images/redX.png">'; } if (document.getElementsByName('customerEmail').length > 0) { document.getElementById('customerEmailImg').innerHTML = '<img alt="Valid" src="images/greenTick.png">'; } else { document.getElementById('customerEmailImg').innerHTML = '<img alt="Invalid" src="images/redX.png">'; } } Hi there, I have a html form, and I need it so that when a user clicks a button, it adds a field into the form. I also need it to write <td></td> around the new field, and I need it to write this in a specific part row of a table. How would I go about doing this? I've tried searching for the past two hours, but no luck. Many thanks, I appreciate it, Jason I need to learn how to clear form fields when a user clicks on them. Here is the site in question: http://www.yourvancouvermortgagebroker.ca/apply They used to work, but then I changed the field value and now it doesn't work on some of the fields (whichever ones I changed). Here is a link to the .js file: http://www.yourvancouvermortgagebroker.ca/js/apply.js I have a form which has various fields which are arrays (so the name of a field may be myField[]). The reason for this is that the form has add buttons to add another field or fields for the purpose of entering another email address, etc., to send invitations and do other things. The problem that I am running into is how to access the individual fields in an array of fields inside javascript to do form validation. So if I have an email address field name emailAddress[], and using the add button, the user of my site adds 3 other copies of the emailAddress[] field, I want to then do form validation onSubmit to ensure those email address are valid using standard procedures. However, inside the javascript code, how do I access the individual fields that make up emailAddress[]? I just cannot find anywhere online the proper way to get at these values. If anyone can help me, I would greatly appreciate it. Happy Holidays Is there a way to give an input or textarea field the focus and set the focus to begin right at the end of the current text in the field?
Hi! I use the :: Form field Progress Bar from DynamicDrive: Form field Progress Bar Now I trided to change the text when the textarea is full "Limit:100%" to "Your max. characters is reached" I trided it but with no luck. This is the main code.. Code: <script type="text/JavaScript"> function textCounter1(field,counter,maxlimit,linecounter) { // text width// var fieldWidth = 137; var charcnt = field.value.length; // trim the extra text if (charcnt > maxlimit) { field.value = field.value.substring(0, maxlimit); } else { // progress bar percentage var percentage = parseInt(100 - (( maxlimit - charcnt) * 100)/maxlimit) ; document.getElementById(counter).style.width = parseInt((fieldWidth*percentage)/100)+"px"; document.getElementById(counter).innerHTML="Limiet: "+percentage+"%" // color correction on style from CCFFF -> CC0000 setcolor(document.getElementById(counter),percentage,"background-color"); } } function setcolor(obj,percentage,prop){ obj.style[prop] = "rgb(80%,"+(100-percentage)+"%,"+(100-percentage)+"%)"; } </script> This is the place where the text is set. Code: ((fieldWidth*percentage)/100)+"px"; document.getElementById(counter).innerHTML="Limiet: "+percentage+"%" Help would be highly appreciated ! greetings Jardin use in form fields - onBlur="chkalpha(this)" function chknum(field) { var valid = "0123456789"; var ok = "yes"; var temp; for (var i=0; i<field.value.length && ok == "yes"; i++) { temp = "" + field.value.substring(i, i+1); if (valid.indexOf(temp) == "-1") { var ok = "no"; } } if (ok == "no") { alert("Invalid entry! Only numeric data is accepted!"); field.value=""; field.focus(); field.select(); } } function chkalpha(field) { var valid = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ "; var ok = "yes"; var temp; for (var i=0; i<field.value.length && ok == "yes"; i++) { temp = "" + field.value.substring(i, i+1); if (valid.indexOf(temp) == "-1") { var ok = "no"; } } if (ok == "no") { alert("Invalid entry! Only alphabetic data is accepted!"); field.value=""; field.focus(); field.select(); } } function chkalphanum(field) { var valid = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ@_-. "; var ok = "yes"; var temp; for (var i=0; i<field.value.length && ok == "yes"; i++) { temp = "" + field.value.substring(i, i+1); if (valid.indexOf(temp) == "-1") { var ok = "no"; } } if (ok == "no") { alert("Invalid entry! Only alphanumeric data is accepted!"); field.value=""; field.focus(); field.select(); } } |