Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

How do I create a form and use the value to pass to a base URL? 2

Status
Not open for further replies.
johngiggs

johngiggs

Technical User
Oct 30, 2002
492
US
I am trying to create a HTML form and pass the value of the search field to append it to the URL.

For example:

Search: 123456

Press "Go" and the destination URL becomes
I know how the basic forms work, but I can't figure out how to append the base URL with the variable from the input.

<HTML>
<HEAD>
<SCRIPT type="javascript">
function goToPage(var url = '')
{
var initial = "
window.location(initial+url);
}
</SCRIPT>
<TITLE>Test</TITLE>
<BASE HREF="</HEAD>
<BODY>
<P>
<FORM name="something" action="#">
Search
<INPUT type="text" name="url" value="" onSubmit="goToPage(this.value)">
<INPUT type="submit" value="GO">
</FORM>
</BODY>
</HTML>

Any assistance would be greatly appreciated.

Thanks,

John
 
Sort by date Sort by votes
Don't submit, have Js intercept the form, and use the value to create the URL:

Code: 
[COLOR=#990000]<[/color]FORM name[COLOR=#990000]=[/color][COLOR=#FF0000]"something"[/color] action[COLOR=#990000]=[/color][COLOR=#FF0000]"#"[/color] onsubmit[COLOR=#990000]=[/color][COLOR=#FF0000]"return goToPage(this);"[/color][COLOR=#990000]>[/color]
Search
[COLOR=#990000]<[/color]INPUT type[COLOR=#990000]=[/color][COLOR=#FF0000]"text"[/color] name[COLOR=#990000]=[/color][COLOR=#FF0000]"urlInput"[/color] value[COLOR=#990000]=[/color][COLOR=#FF0000]""[/color] onSubmit[COLOR=#990000]=[/color][COLOR=#FF0000]"goToPage(this.value)"[/color][COLOR=#990000]>[/color]
[COLOR=#990000]<[/color]INPUT type[COLOR=#990000]=[/color][COLOR=#FF0000]"submit"[/color] value[COLOR=#990000]=[/color][COLOR=#FF0000]"GO"[/color][COLOR=#990000]>[/color]
[COLOR=#990000]</[/color]FORM[COLOR=#990000]>[/color]

Code: 
[b][COLOR=#0000FF]function[/color][/b] [b][COLOR=#000000]goToPage[/color][/b][COLOR=#990000]([/color]formObj[COLOR=#990000])[/color]
[COLOR=#FF0000]{[/color]
[b][COLOR=#0000FF]var[/color][/b] initial [COLOR=#990000]=[/color] [COLOR=#FF0000]"[URL unfurl="true"]http://www.example.com/page1/"[/URL][/color][COLOR=#990000];[/color]
[b][COLOR=#0000FF]var[/color][/b] url [COLOR=#990000]=[/color] formObj[COLOR=#990000].[/color]urlInput[COLOR=#990000].[/color]value[COLOR=#990000];[/color]

window[COLOR=#990000].[/color][b][COLOR=#000000]location[/color][/b][COLOR=#990000]([/color]initial[COLOR=#990000]+[/color]url[COLOR=#990000]);[/color]
[b][COLOR=#0000FF]return[/color][/b] [b][COLOR=#0000FF]false[/color][/b][COLOR=#990000];[/color]
[COLOR=#FF0000]}[/color]

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 
Upvote 0 Downvote
Hi vacunita,

Thank you for your response. I tried your suggestion and it seems to do something similar to what I tried; It appends ?urlInput=$INPUT# to the URL instead of going to the correct destionation URL where $INPUT is the data entered into the form.

Any thoughts?

Thanks,

John
 
Upvote 0 Downvote
The error is in the usage of window.location. Copied from your code, and forgot to correct it. It should be:

Code: 
function goToPage(formObj)
{
var initial = "[URL unfurl="true"]http://localhost/showGet.php";[/URL]
var url = formObj.urlInput.value;

[red]window.location = initial+url[/red];
return false;
}


----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 
Upvote 0 Downvote
Hi Vacunita,

This is what I have:

Code: 
<HTML>

<FORM name="something" action="#" onsubmit="return goToPage(this);">
Service Tag
<INPUT type="text" name="urlInput" value="" onSubmit="goToPage(this.value)">
<INPUT type="submit" value="GO">
</FORM> 

<SCRIPT type="javascript">
function goToPage(formObj)
{
var initial = "[URL unfurl="true"]http://www.dell.com/support/troubleshooting/us/en/04/Servicetag/";[/URL]
var url = formObj.urlInput.value;

window.location = initial+url;
return false;
} 

</HTML>

Am I doing something wrong?

John
 
Upvote 0 Downvote
Hi

John said:
Am I doing something wrong?
Click to expand...
[ul]
[li]Invalid value for [tt]script[/tt] tag's [tt]type[/tt] attribute. Use "text/javascript" instead.[/li]
[li]Invalid [tt]script[/tt] section. Add a close [tt]script[/tt] tag.[/li]
[/ul]

Feherke.
[link feherke.github.com/][/url]
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

penguinspeaks
  • Locked
  • Question
How do I pass a classic asp variable to JS
Replies
1
Views
482
xwb
xwb
jomat
  • Locked
  • Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
352
xwb
xwb
lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
313
lexer
lexer
Kennelbloke
  • Locked
  • Question
Can't Get Markers to show on Map
Replies
0
Views
380
Kennelbloke
Kennelbloke
Mike Lewis
  • Locked
  • Question
Anyone here got any experience of Grid.JS (a sortable Javascript grid) 1
Replies
5
Views
715
Mike Lewis
Mike Lewis

Part and Inventory Search

Sponsor

Back
Top