asked on

input box value to change URL or href link in html

Dear Experts,

I would like to ask html question about user input number in input box to
link href or URL according to the input number change in html. How to change URL from input box with enter keys
and with submit button. Hope you can provide two method simple code.
Frr example, if I input product no=666789 , the href link will go to web search
http://www.mywbsite.com/666789.htm

Please advise

Duncan

*********
< input product number and press enter key  to change href link
<html>
<body>
<form method="get" action="http:/www.mywebsite.com/#myvariable#.htm">
ProductNO: <input type="text" name="myvariable" value="">
</form>
</body>
</html>
************************************************
<-Click input product no and click submit button to change href
<html>
<body>
<form method="get" action="http:/www.mywebsite.com/#myvariable#.htm">
ProductNO: <input type="text" name="myvariable" value="">
<input type="submit" value="Submit">
</form>
</body>
</html>

Open in new window

SOLUTION

sammySeltzer

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

duncanb7

ASKER

Is it okay for enter key only without button click

duncanb7

ASKER

I try it and no response for enter key or click, the url is same as before

Justin Mathews

Try this:

*********
< input product number and press enter key  to change href link
<html>
<head>
<script>
function formSubmit(frm)
{
  frm.action = frm.action.replace(/#[^#]+#/, frm.myvariable.value);
}
</script>
</head>

<body>
<form method="get" action="http:/www.mywebsite.com/#myvariable#.htm">
ProductNO: <input type="text" name="myvariable" value="">
</form>
</body>
</html>
************************************************
<-Click input product no and click submit button to change href
<html>
<body>
<form method="get" action="http:/www.mywebsite.com/#myvariable#.htm" onsubmit="return formSubmit(this)">
ProductNO: <input type="text" name="myvariable" value="">
<input type="submit" value="Submit">
</form>
</body>
</html>

Open in new window

SOLUTION

Justin Mathews

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

duncanb7

ASKER

it is same as before URL is no change, be reminded I also need both way of entery keys to submit and button click submit

sammySeltzer

sorry, some silly bug

<html>
<head>

<script language="Javascript">
<!--

function passtourl(){

var frm = document.FormName

var valuea = frm.myvariable.value

frm.action = "mywebsite.com?myvariable=" + valuea
frm.submit()

}

//-->
</script>

</head>

<body>

<form name="FormName" method="Post">
<input type="text" name="myvariable" ><br>
</form>
<p><a href="javascript: passtourl()">click to pass</a></p>

</body>

</html>

Open in new window

sammySeltzer

Try this with button

<html>
<head>

<script language="Javascript">
<!--

function passtourl(){

var frm = document.FormName

var valuea = frm.myvariable.value

frm.action = "mywebsite.com?myvariable=" + valuea
frm.submit()

}

//-->
</script>

</head>

<body>

<form name="FormName" method="Post">
<input type="text" name="myvariable" ><br>
</form>
<p><input type="submit" name="submit" Onclick="passtourl()" value="Submit">

</body>

</html>

Open in new window

duncanb7

ASKER

where ie *.htm" you put

duncanb7

ASKER

frm.action = "mywebsite.com?myvariable=" + valuea

Is it typing mistake valuea, it should be no "a", right

duncanb7

ASKER

it is same and just a little change but why it will have "?=" and could it delete it

www.mywbeiste.com/?=123

ASKER CERTIFIED SOLUTION