Recently, a friend asked if I could come up with a simple form that would allow you to enter a value into a field, hit the submit button, and have it take the user to a URL with the value they entered in the field appended to the URL. I’m not great with JavaScript, but I figured it’d be a good learning exercise for me.

Scripting is an area I have never been comfortable in. I can work with existing code without any problems, but writing my own has always been a challenge for me.

Here’s what I came up with:

<form action="http://subdomain.example.com/" method="post" name="redirect">
<input type="text" value="" name="url" id="" />
<input type="submit" value="Submit" name="submit"
onclick="this.form.action=document.redirect.action + document.redirect.url.value;" />
</form>

View Code on Snipplr

To use this, simply change the URL set in the form action to your own URL. Once the user hits submit, the form will post to http://subdomain.example.com/XXXX where ‘XXXX’ equals the value of the text field. Obviously, there’s no validation whatsoever. Also, the domain needs to have a slash after it or it’ll fail in IE. If a user enters a value that doesn’t pair up with a URL that resolves, it won’t work.