jQuery Forum

I'm tring to create a url with query string data using a form with multiple dropdown options.

I'm using the first dropdown to select the url and the second dropdown to add the query string to the selected url. The change method updates variable values and the click event merges those variables to form the url. The problem is that I can't seem to tag anything onto the end of the url. I've read about using the $.param function but I have yet to find an example where the output is appended to the end of a url. 

Here is my html form and jquery:

2. <form id="myForm" method="GET">
3. <select id="url-select">
4.     <option value="select">Select Page</option>
5.     <option value="example-1.php">Industry 1</option>
6.         <option value="example-2.php">Industry 2</option>
7.     </select>
8.     <select id="query-select">
9.     <option value="select">Select Tab</option>
10.     <option value="query1">Query One</option>
11.         <option value="query2">Query Two</option>
12.         <option value="query3">Query Three</option>
13.     </select>
14. <button id="submit">Submit</button>
15. </form>
16. 
    
18. $(function() {
19. var urlSelect = null;
20. var querySelect = null;
21. var url = null
23. $("#url-select").change(function() {
24. urlSelect = $("#url-select").val();
25. });
27. $("#query-select").change(function() {
28. querySelect = $("#query-select").val();
29. });
31. $("#submit").click(function() {
32. url = urlSelect + querySelect;
33. $("#myForm").attr("action", url);
34. });
35. });