jQuery and form value onchange function call?

Question

I need a form selection to trigger a jquery function and launch the link.

<form>
<select onchange="drop_down(this.value)">
    <option value="http:google.com">Google</option>
    <option value="http:yahoo.com">Yahoo</option>
    <option value="http:bing.com">Bing</option>
    <option value="http:msn.com">MSN</option>
</select>

<script>
function drop_down(value){
    document.location = this.value;
}
</script>

Also, fix your URLs i.e. `http://google.com`. You're missing the `//`. — Coby, Nov 12 '12 at 21:57
Try.. window.location.href = value; http://stackoverflow.com/questions/503093/how-can-i-make-a-redirect-page-in-jquery-javascript — Raunak Agarwal, Nov 12 '12 at 21:59
But you do have values for the options which you want to load? — Raunak Agarwal, Nov 12 '12 at 22:00
than I think it is preferable to write `$(".select-class").change(function() { window.location = $(this).val(); })` — dav, Nov 12 '12 at 22:01

score 2 · Answer 1 · answered Nov 12 '12 at 22:00

2

Change your markup to:

<select onchange="drop_down(this.value)">
    <option value="http://www.google.com">Google</option>
    <option value="http://www.yahoo.com">Yahoo</option>
    <option value="http://www.bing.com">Bing</option>
    <option value="http://www.msn.com">MSN</option>
</select>

and your script to:

function drop_down(value) {
   location.href = value;
}

http://jsfiddle.net/ZF9gF/

answered Nov 12 '12 at 22:00

Ram

140,563
16
160
190

1

I prefer this method as it addresses the original issue + the `location.href`. – Selvakumar Arumugam Nov 12 '12 at 22:05

score 1 · Accepted Answer · answered Nov 12 '12 at 21:57

1

window.location will redirect the visitor:

function drop_down(value){
    window.location = value;
}

answered Nov 12 '12 at 21:57

Matthew Blancarte

8,151
2
23
34

http://stackoverflow.com/a/10016109/297641 for using `location.href` instead of just `location`. FYI only. – Selvakumar Arumugam Nov 12 '12 at 22:03

score 0 · Answer 3 · answered Nov 12 '12 at 22:06

DEMO — Here's how to do it in jQuery.

<script>
$(function(){
    $('select').on('change', function(){
        location.href = $(this).val();
    });
});
</script>

<select>
    <option value="http://www.google.com">Google</option>
    <option value="http://www.yahoo.com">Yahoo</option>
    <option value="http://www.bing.com">Bing</option>
    <option value="http://www.msn.com">MSN</option>
</select>

score 0 · Answer 4 · answered Nov 12 '12 at 22:12

<script type="text/javascript">
function drop_down(value) {
 window.location.replace(value);
 }
 </script>


<select onchange="drop_down(this.value)">
<option value="https://www.google.com/">Google</option>
<option value="https://www.yahoo.com/">Yahoo</option>
<option value="http://www.bing.com/">Bing</option>
<option value="http://www.msn.com/">MSN</option>
</select>

This works for me.Let me know if it works for you.......

jQuery and form value onchange function call?

4 Answers4