CODEWITHSUNDEEP
javascriptjquery
Pete Tong
Pete Tong

Reputation: 51

Change path URL on change of a dropdown box in javascript

Hi i want to change the path of the URL when the drop-down box is changed on my page. 

<select id="SelectLocation" class="large" data-bind="value: StoreLocationSelected" >
<option value="0" label="choose one"></option>
<option>1</option>
<option>1</option>
<option>1</option>
<option>1</option> 
</select>

When the option is changed on the drop-down i want the page to re-load with the relevant URL path i have asked it to. Any suggestions?

Thanks

Upvotes: 1

Views: 4185

Answers (5)

Anuj Yadav
Anuj Yadav

Reputation: 990

Not sure whether I got your question correctly or not. I think you want to post back to the server. If you want to change form url then you can use javascript/jquery and then do a submit with all the form data. 

//by name
document.myform.action = url;

//by id
document.getElementById("form_id").action = url;
document.getElementById("form_id").submit();

//jquery
$("#form_id").attr("action", url);
$("#form_id")[0].submit();

You can use drop downs selected index changed event to execute your JS.

Check the URL below for more information: http://www.web-source.net/web_development/form_action.htm#.VEjMgyKUdDQ

Upvotes: 0

KiV
KiV

Reputation: 2263

You can use the below approach.

<select id="dynamic_select">
    <option value="" selected>Pick a Website</option>
    <option value="http://www.google.com/">Google</option>
    <option value="http://www.youtube.com/">YouTube</option>
    <option value="http://www.stackoverflow.com/">Stack Overflow</option>
</select>

<script>
    $(function(){
      // bind change event to select
      $('#dynamic_select').bind('change', function () {
          var url = $(this).val(); // get selected value
          if (url) { // require a URL
              window.location = url; // redirect
          }
          return false;
      });
    });
</script>

Fiddle: http://jsfiddle.net/kiranvarthi/z60sxfkd/

Upvotes: 2

artm
artm

Reputation: 8584

Something like this:

$("#SelectLocation").on("change", function(){
    document.location.href = $(this).val(); //assuming options have urls's in them
});

Upvotes: 0

saun4frsh
saun4frsh

Reputation: 383

Use This

   location.href="Your dropdown ITEM"   // Set this with your js function, onclick or whatever the way u want.

Upvotes: 0

Albin
Albin

Reputation: 3012

Try something like

<select id="SelectLocation" class="large" data-bind="value: G4.Model.Ticketing.StoreLocationSelected" onchange="window.location.href = 'Here get right url depending on value';" >
<option value="0" label="choose one"></option>
<option>1</option>
<option>1</option>
<option>1</option>
<option>1</option>
</select>

Upvotes: 0

Related Questions