View Full Version : Concatenating form values into Submit link

09-26-2012, 07:35 PM
I'd like to have a number of dropdown forms whose options each include a different url as their value...easy enough. But then I want the "submit" button to take the visitor to a url that was created by concatenating together the values of the options.

For example if one of the selected option values is "color/blue/" and another selected option values in "size/large/", I'd want my "submit" button to change into a link to "http://www.example.com/color/blue/size/large/" ... any suggestions on how to accomplish this? It's been awhile since I've touched javascript.

09-26-2012, 07:51 PM
start with the base url as a string, lets say

var str="http://www.example.com/"

loop through the values of the selects, concatenating the values to the string:


once the loop is finished, redirect the page:


of course, you may want to put in some backstops for if the user doesn't select something on one of the selects

Philip M
09-26-2012, 07:55 PM
Here you are:-

<select id = "color">
<option value = "red" selected>Red</option>
<option value = "green" >Green</option>
<option value = "blue" >Blue</option><

<select id = "size">
<option value = "small" selected>Small</option>
<option value = "medium" >Medium</option>
<option value = "large">Large</option><

<input type = "button" value = "Go To Page" onclick = "makeURL()">

<script type = "text/javascript">
function makeURL() {
var colval = document.getElementById("color").value;
var sizeval = document.getElementById("size").value;
var url = "http://www.example.com/color/" + colval + "/size/" + sizeval + "/";
window.location.href = url;

A gentleman is one who never hurts anyone's feelings unintentionally. -
Oscar Wilde (Irish Poet, Novelist, Dramatist and Critic, 1854-1900)

09-26-2012, 08:14 PM
Thank you so much, Phillip. I'll swap in my options and let you know.