jquery code in url address bar

Question

I have 2 html <select>s and I want to redirect to a page using the values from the select lists

what i want to achieve is if i select option1 from both select lists, direct the page to http://localhost/option-1/option-1 and so on

What i get at the minute is a load of jquery in the address bar so i get a 404 with a message like this and not what i expect

The requested URL /test/function (e){var n,r,i,o=this[0];{if(arguments.length)return i=b.isFunction(e),this.each(function(n){var o,a=b(this);1===this.nodeType&&(o=i was not found on this server

here is some test code i have which does not work or do what i expect

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
</head>
<body>

<select id="choose-type">
    <option value=" " selected="selected">Type</option>
    <option value="option-1">Option 1</option>
    <option value="option-2">Option 2</option>
    <option value="option-3">Option 3</option>
</select>

<select id="urlList">
    <option value=" " selected="selected">Subject</option>
    <option value="option-1">Option 1</option>
    <option value="option-2">Option 2</option>
    <option value="option-3">Option 3</option>
</select>

<input type="button" name="go" value=" " id="finder-button" />


<script type="text/javascript">
    $(document).ready(function() {
        $("#finder-button").click(function(e) {
            window.location.href = 'http://localhost/test/'+($("#choose-type").val)+'/'+($("#urlList").val);
            return false;
        });
    });
</script>
</body>
</html>

Arun P Johny · Accepted Answer · 2013-12-27 15:05:12Z

2

.val() is a function, you need to invoke it by adding () at its end

window.location.href = 'http://localhost/test/' + $("#choose-type").val() + '/' + $("#urlList").val();

when you use just .val it returns a reference to the jQuery.fn.val function and then it will be used for string concatenation which will add the function definition to the string.

answered Dec 27, 2013 at 15:05

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Markus Kottländer · Accepted Answer · 2013-12-27 15:07:25Z

1

Use $("#choose-type").val();. .val is the name of the function which outputs its source in this case.

answered Dec 27, 2013 at 15:07

Markus Kottländer

8,2844 gold badges42 silver badges61 bronze badges

Collectives™ on Stack Overflow

jquery code in url address bar

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related