|
JavaScript - Creating A Link Out Of Input Value
Hello everyone,
I'm new to the programming world so please be kind I'm trying to find a code which would take the input value entered in a form field and on click direct you to a page which corresponds with what was entered. So for example: Enter "5" in field. Click Submit. Page opens up (which in fact would be an html file on my server called... 5.html) ( i would want to create 10 pages for values entered from 1-10... each value having a unique result when entered and clicked) I have no idea how to put this all together, i've been searching everywhere. Any kind of help would be appreciated. Similar TutorialsI am trying to create a text area input filed for user input, and i want to be able to allow the user to format thier text, just like the ones used in this user forum. I am writing my website in html, php, javascript and css with a MySql database. I am trying to understand how to create such an format-able text area for input. Any ideas? Thank you; Ice Hi, I'm very new to Javascript and I'm stuck. I am trying to create a js script that will prompt the user for a times table (example the 5 times table, the 7 times table, etc.) & prompt the user for 2 more values; the 'start' number and 'end' number. So there would be 3 numbers total the user must input. The script should present a 'warning' message if the user inputs letters or negative numbers. I have come very close to getting it too work but can't quite get past the last hurdle. Upon entering the 3 numbers, the output should look similar to this: (the 5 times table starting with 1 and ending with 12) The 5 times table 5 * 1 = 5 5 * 2 = 10 5 * 3 = 15 5 * 4 = 20 5 * 5 = 25 5 * 6 = 30 5 * 7 = 35 5 * 8 = 40 5 * 9 = 45 5 * 10 = 50 5 * 11 = 55 5 * 12 = 60 I have placed the js script code on pastebin.com and below. The pastebin link is: http://pastebin.com/2NZPiFH9 Code: function writeTimesTable(timesTable, timesByStart, timesByEnd)
{
for (;timesByStart <= timesByEnd; timesByStart++)
{
document.write(timesTable + " * " + timesByStart + " = " +
timesByStart * timesTable + "<br>");
}
}
var timesTable;
while ( (timesTable = prompt("Enter the first number in the times table. Enter -1 to exit.", -1)) != -1)
{
while (isNaN(timesTable) == true)
{
timesTable = prompt(timesTable + " is not a valid number, please retry.",-1);
}
if (timesTable == -1)
{
break;
}
document.write("<br>The " + timesTable + " times table<br>");
writeTimesTable(timesTable,1,12);
}
I would like to apologize in advance if my question sounds too simple. I am a novice to Javascript and have not had any real formal training here. I am creating a webpage which utilizes a separate .xml file to populate values in my webpage. This is my webpage (links.html): and here is my xml file (links_data.xml): This is my output: I have a link at the bottom of the page that points to the device being displayed. In this case, the link should be: http://10.90.139.201 If my xml file changes, it should point to the new IP address. My question is, how do I get the link to work? Currently, my current link (<a href="http://"IP_address"">Link</a>) does not populate any information. Appreciate any guidance here... thanks. I'm using a form data reference, something like P-1234 for example to create a text file and a link to the file. This is during the construction of a new table or table row with javascript. I have an array of one or more references submitted via form using $_POST. On my action page I am creating a txt file P-1234. If I am creating a table ot table row using createElement(), one of the cells will have a link to the file. If the file is created as follows: PHP Code: $File = $_POST['ref'][$i] . "txt"; After creating the cell Code: var Cell = document.createElement('td');
I assign the file to a variable var File = "<?= $File ?> "; I assume the link is inserted using innerHTML? If so, do I just append the filename to the end of the file path like this? Cell.innerHTML = "http://localhost/Project/+File"; If this is not the right way can someone point me in the right direction? Hello, I'm trying to create a webpage where users can click on a dynamically generated set of questions: <?php do { ?> <p><?php echo $row_rsQuestions['question_text']; ?><?php echo $row_rsQuestions['question_type']; ?></p> <?php } while ($row_rsQuestions = mysql_fetch_assoc($rsQuestions)); ?> and by clicking on a particular question, there will be an update for their particular listing of personal questions in a MySql database. I know how to create the database update part, but I think that I would need to javascript to: 1) tell my page that it's time to update (i.e. add a particular question as soon as they click it) 2) pass along the correct variable to the database update portion of the page. Any help on these two items would be appreciated. Thank you! Hi, I'm really new to Javascript. Recently in my IT class, we made a HTML page which would open a popup box, where the user could enter a key word. When the user pressed enter, the page would navigate to a specific page. The code we used was: Code: <script language = "JavaScript">
where = window.prompt ("Please tell me where you would like to go.");
switch (where){
case "Digg" :
window.location = "http://www.digg.com" ;
break;
default:
window.location = "http://www.google.com" ;
}
</script>
What I am hopeing to do, is implement this code on my workplaces server, and have the keywords link to other html documents within the server. However when I tested this, for some reason the links are not working. Can this actually be done? Am I missing something silly? Are there any other ways of doing this? Thanks in advance Hi all, I think I have posted in the right place, if not appologies. Anyhow, I am currently creating a website for my canvas printing business and run into a few javascripting issues. I am trying to create a small navigation form whereby a customer can select from a dropdown the required width of canvas, this selection will then populate a second dropdown with a choice of canvas heights. Ok, so trawling many sites I came across some javascript that I was able to chop about and have this part sorted. The problem now is that I would like to include a submit button that when clicked takes the customer to a webpage based on their two dropdown choices, and being a complete newby when it comes to javascript I am stuck trying to include the script to enable this. eg: if they select '20" (51cm)' from the first dropdown and '16" (41cm)' from the second dropdown, they will navigate to "http: / / 20x16.co.uk" canvas print page. I have not currently created the canvas print pages so am unable to give the URLs of the pages. However if somebody can lend a hand to get me started and indicate where the desitnation URLs need to be added, I can drop these in later. The way that the script is currently written, the linked url could be based soley on the choice made in the second dropdown. I have a draft page with the working dropdowns he http://merchant.auctivacommerce.com/...iewtheme=32189 And the code that I currently have is: Code: <script type="text/javascript">
var SELECT_WIDTH_FIRST = []; var WIDTH08 = []; var WIDTH10 = []; var WIDTH12 = []; var WIDTH14 = []; var WIDTH16 = []; var WIDTH18 = []; var WIDTH20 = []; var WIDTH24 = []; var WIDTH30 = []; var WIDTH36 = []; var WIDTH42 = []; var WIDTH48 = []; var WIDTH60 = []; var WIDTH72 = [];
SELECT_WIDTH_FIRST[0] = new Option("Please Select Width First", "SelWidFir");
WIDTH08[0] = new Option("8'' (20cm)", "0808"); WIDTH08[1] = new Option("10'' (25cm)", "0810"); WIDTH08[2] = new Option("12'' (30cm)", "0812"); WIDTH08[3] = new Option("14'' (35cm)", "0814"); WIDTH08[4] = new Option("16'' (41cm)", "8016"); WIDTH08[5] = new Option("18'' (46cm)", "0818"); WIDTH08[6] = new Option("20'' (51cm)", "0820"); WIDTH08[7] = new Option("24'' (61cm)", "0824");
WIDTH10[0] = new Option("8'' (20cm)", "1008"); WIDTH10[1] = new Option("10'' (25cm)", "1010"); WIDTH10[2] = new Option("12'' (30cm)", "1012"); WIDTH10[3] = new Option("14'' (35cm)", "1014"); WIDTH10[4] = new Option("16'' (41cm)", "1016"); WIDTH10[5] = new Option("18'' (45cm)", "1018"); WIDTH10[6] = new Option("20'' (51cm)", "1020"); WIDTH10[7] = new Option("24'' (61cm)", "1024"); WIDTH10[8] = new Option("30'' (76cm)", "1030");
WIDTH12[0] = new Option("8'' (20cm)", "1208"); WIDTH12[1] = new Option("10'' (25cm)", "1210"); WIDTH12[2] = new Option("12'' (30cm)", "1212"); WIDTH12[3] = new Option("14'' (35cm)", "1214"); WIDTH12[4] = new Option("16'' (41cm)", "1216"); WIDTH12[5] = new Option("18'' (45cm)", "1218"); WIDTH12[6] = new Option("20'' (51cm)", "1220"); WIDTH12[7] = new Option("24'' (61cm)", "1224"); WIDTH12[8] = new Option("30'' (76cm)", "1230"); WIDTH12[9] = new Option("36'' (91cm)", "1236");
WIDTH14[0] = new Option("8'' (20cm)", "1408"); WIDTH14[1] = new Option("10'' (25cm)", "1410"); WIDTH14[2] = new Option("12'' (30cm)", "1412"); WIDTH14[3] = new Option("14'' (35cm)", "1414"); WIDTH14[4] = new Option("16'' (41cm)", "1416"); WIDTH14[5] = new Option("18'' (45cm)", "1418"); WIDTH14[6] = new Option("20'' (51cm)", "1420"); WIDTH14[7] = new Option("24'' (61cm)", "1424"); WIDTH14[8] = new Option("30'' (76cm)", "1430"); WIDTH14[9] = new Option("36'' (91cm)", "1436"); WIDTH14[10] = new Option("42'' (107cm)", "1442");
WIDTH16[0] = new Option("8'' (20cm)", "1608"); WIDTH16[1] = new Option("10'' (25cm)", "1610"); WIDTH16[2] = new Option("12'' (30cm)", "1612"); WIDTH16[3] = new Option("14'' (35cm)", "1614"); WIDTH16[4] = new Option("16'' (41cm)", "1616"); WIDTH16[5] = new Option("18'' (45cm)", "1618"); WIDTH16[6] = new Option("20'' (51cm)", "1620"); WIDTH16[7] = new Option("24'' (61cm)", "1624"); WIDTH16[8] = new Option("30'' (76cm)", "1630"); WIDTH16[9] = new Option("36'' (91cm)", "1636"); WIDTH16[10] = new Option("42'' (107cm)", "1642"); WIDTH16[11] = new Option("48'' (122cm)", "1648");
WIDTH18[0] = new Option("8'' (20cm)", "1808"); WIDTH18[1] = new Option("10'' (25cm)", "1810"); WIDTH18[2] = new Option("12'' (30cm)", "1812"); WIDTH18[3] = new Option("14'' (35cm)", "1814"); WIDTH18[4] = new Option("16'' (41cm)", "1816"); WIDTH18[5] = new Option("18'' (45cm)", "1818"); WIDTH18[6] = new Option("20'' (51cm)", "1820"); WIDTH18[7] = new Option("24'' (61cm)", "1824"); WIDTH18[8] = new Option("30'' (76cm)", "1830"); WIDTH18[9] = new Option("36'' (91cm)", "1836"); WIDTH18[10] = new Option("42'' (107cm)", "1842"); WIDTH18[11] = new Option("48'' (122cm)", "1848"); WIDTH18[12] = new Option("60'' (152cm)", "1860"); WIDTH18[13] = new Option("72'' (183cm)", "1872");
WIDTH20[0] = new Option("8'' (20cm)", "2008"); WIDTH20[1] = new Option("10'' (25cm)", "2010"); WIDTH20[2] = new Option("12'' (30cm)", "2012"); WIDTH20[3] = new Option("14'' (35cm)", "2014"); WIDTH20[4] = new Option("16'' (41cm)", "2016"); WIDTH20[5] = new Option("18'' (45cm)", "2018"); WIDTH20[6] = new Option("20'' (51cm)", "2020"); WIDTH20[7] = new Option("24'' (61cm)", "2024"); WIDTH20[8] = new Option("30'' (76cm)", "2030"); WIDTH20[9] = new Option("36'' (91cm)", "2036"); WIDTH20[10] = new Option("42'' (107cm)", "2042"); WIDTH20[11] = new Option("48'' (122cm)", "2048"); WIDTH20[12] = new Option("60'' (152cm)", "2060"); WIDTH20[13] = new Option("72'' (183cm)", "2072");
WIDTH24[0] = new Option("8'' (20cm)", "2408"); WIDTH24[1] = new Option("10'' (25cm)", "2410"); WIDTH24[2] = new Option("12'' (30cm)", "2412"); WIDTH24[3] = new Option("14'' (35cm)", "2414"); WIDTH24[4] = new Option("16'' (41cm)", "2416"); WIDTH24[5] = new Option("18'' (45cm)", "2418"); WIDTH24[6] = new Option("20'' (51cm)", "2420");
WIDTH30[0] = new Option("10'' (25cm)", "3010"); WIDTH30[1] = new Option("12'' (30cm)", "3012"); WIDTH30[2] = new Option("14'' (35cm)", "3014"); WIDTH30[3] = new Option("16'' (41cm)", "3016"); WIDTH30[4] = new Option("18'' (45cm)", "3018"); WIDTH30[5] = new Option("20'' (51cm)", "3020");
WIDTH36[0] = new Option("12'' (30cm)", "3612"); WIDTH36[1] = new Option("14'' (35cm)", "3614"); WIDTH36[2] = new Option("16'' (41cm)", "3616"); WIDTH36[3] = new Option("18'' (45cm)", "3618"); WIDTH36[4] = new Option("20'' (51cm)", "3620");
WIDTH42[0] = new Option("14'' (35cm)", "3614"); WIDTH42[1] = new Option("16'' (41cm)", "3616"); WIDTH42[2] = new Option("18'' (45cm)", "3618"); WIDTH42[3] = new Option("20'' (51cm)", "3620");
WIDTH48[0] = new Option("16'' (41cm)", "4816"); WIDTH48[1] = new Option("18'' (45cm)", "4818"); WIDTH48[2] = new Option("20'' (51cm)", "4820");
WIDTH60[0] = new Option("18'' (45cm)", "6018"); WIDTH60[1] = new Option("20'' (51cm)", "6020");
WIDTH72[0] = new Option("18'' (45cm)", "7218"); WIDTH72[1] = new Option("20'' (51cm)", "7220");
function populateSub(mainSel, subSel){ var mainMenu = mainSel; var subMenu = subSel; var subMenuItems; subMenu.options.length = 1;
switch (mainMenu.selectedIndex) {
case 0: subMenuItems = SELECT_WIDTH_FIRST; break;
case 1: subMenuItems = WIDTH08; break;
case 2: subMenuItems = WIDTH10; break;
case 3: subMenuItems = WIDTH12; break;
case 4: subMenuItems = WIDTH14; break;
case 5: subMenuItems = WIDTH16; break;
case 6: subMenuItems = WIDTH18; break;
case 7: subMenuItems = WIDTH20; break;
case 8: subMenuItems = WIDTH24; break;
case 9: subMenuItems = WIDTH30; break;
case 10: subMenuItems = WIDTH36; break;
case 11: subMenuItems = WIDTH42; break;
case 12: subMenuItems = WIDTH48; break;
case 13: subMenuItems = WIDTH60; break;
case 14: subMenuItems = WIDTH72; break;
}
for (var i = 0; i < subMenuItems.length; i++) { subMenu.options[i] = subMenuItems[i];
}
}
</script>
<div style="width:320px; text-align:right;">
<form name="Menus">
<label style="font-size:14px; font-variant:small-caps;">Width</label>
<select style="width:250px; margin-bottom:10px;" name="Width" onchange="populateSub(this, this.form.Height);">
<option>Please Select</option>
<option value="W08">8'' (20cm)</option>
<option value="W10">10'' (25cm)</option>
<option value="W12">12'' (30cm)</option>
<option value="W14">14'' (35cm)</option>
<option value="W16">16'' (41cm)</option>
<option value="W18">18'' (46cm)</option>
<option value="W20">20'' (51cm)</option>
<option value="W24">24'' (61cm)</option>
<option value="W30">30'' (61cm)</option>
<option value="W36">36'' (61cm)</option>
<option value="W42">42'' (61cm)</option>
<option value="W48">48'' (61cm)</option>
<option value="W60">60'' (61cm)</option>
<option value="W72">72'' (61cm)</option>
</select>
<label style="font-size:14px; font-variant:small-caps;">Height</label>
<select style="width:250px; margin-bottom:10px;" name="Height">
<option>Please Select Width First</option>
</select>
<input type="button" value="View Canvas!">
</form>
</div>
As mentioned, Javascript is completely new to me but I am attempting to learn. Any help would be greatly appreciated. Wayne Hello there, I am having trouble with a javascript snippet that adds text to a textarea when you click on the link. Problem is that when you regularly type into the textarea, the links no longer add text. Here is the links: Code: <a href="javascript:insertText('<b></b> ','textIns');" onClick="void(0)">Bold</a>
Here is the javascript Code: <script type="text/javascript">
function insertText(val,e) {
document.getElementById(e).innerHTML+=val;
}
</script>
Any ideas or suggestions? Hi all, I am working with a php code that I am trying to edit a bit. The last part I am trying to change I cannot figure out. Essentially I want to change the "Login" submit button to just a text link that says "Login" instead. Quote: <form action="<?php echo JRoute::_( 'index.php', true, $params->get('usesecure')); ?>" method="post" name="login" id="form-login" > <?php echo $params->get('pretext'); ?> <input id="modlgn_username" type="text" name="username" class="inputbox" alt="username" size="15" value="<?php echo JText::_('Username') ?>" onclick="login.username.value='';" /> <input id="modlgn_passwd" type="password" name="passwd" class="inputbox" size="15" alt="password" value="<?php echo JText::_('Password') ?>" onclick="login.passwd.value='';" /> <?php if(JPluginHelper::isEnabled('system', 'remember')) : ?> <label for="modlgn_remember"><?php echo JText::_('Remember me') ?></label> <input id="modlgn_remember" type="checkbox" name="remember" class="inputbox" value="yes" alt="Remember Me" /> <?php endif; ?> <input type="submit" name="Submit" class="button" value="<?php echo JText::_('LOGIN') ?>" /> <?php I am hoping this is just a minor change. Would someone mind showing me what I have to do? Thanks very much. I wrote a function, to change a input value to show a key, which PHP later recognizes and makes addition changes too. However I can't seem to get this simple function to work, can you see anything wrong with it? Code: function quote(id) {
var shout = document.getElementById('shout');
var currentShout = '; '.shout.value;
var prefix = '@'.id;
shout.value = prefix.currentShout;
}
I call it by Code: <a href="#" onclick="javascript: quote('2');">Comment</a>
the input that changes is written as Code: <input id="shout" name="shout" type="text" onKeyPress="return submitenter(this,event);"> Hi, I am trying to link the <input type="range" min="450" max="800" value="500" /> to a CSS style for an AP box so when you move the slider it then changes the Css style (top:--px). allowing the Ap box to move with the slider. (important to work in Chrome) Here is the code: [CODE] <!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> <style type="text/css"> <!-- #apDiv1 { position:absolute; left:214px; top:34px; width:141px; height:164px; z-index:1; background-color:#3FF } --> </style> </head> <body> <div id="apDiv1"><p>have an image in here. Need to make this box move up and down with the slider.</p></div> <input type="range" min="450" max="800" value="500" /> </body> </html> [CODE] I have tried a number of way but can't get it, I am sure it is simple. I need the code for if the user enters in a code into the field for example E1 and clicks submit it'll redirect them to a certain form. And if another user entered in E2 it would redirect them to a DIFFERENT form. I hope this is the correct category of the site for me to post this. Wasn't sure if it should be here or PHP.
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. 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 .. 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); I'm working on a technical document that has a glossary section. When I use a technical term, I link to its definition in the glossary then provide a return link to return the user to whence they came. But if I use that same term again, and if I want to link it to the glossary, I need to duplicate the glossary entry in order to provide a return link that returns them to the right place. Is there some way I could link them to the glossary and embed a unique return link in the link to the glossary?
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 |
|||||||