Redirecting to different pages based on the selection of the user

User can select one option from a drop down list box , based on the option value the page can be redirected to different URLs .

Here we will keep URLs as option values for each selection.
Here is the demo. This will redirect to this page only after the selection but you can use different URL.
We use on change event of a list box.

HTML

<select class='form-control' name='s1' id=city_id>
  <option value=''>Select One City</option>
  <option value='https://www.plus2net.com/jquery/listbox-redirect.php?city=london'>London</option>
  <option value='https://www.plus2net.com/jquery/listbox-redirect.php?city=New York'>New York</option>
  <option value='https://www.plus2net.com/jquery/listbox-redirect.php?city=New Delhi'>New Delhi</option>
  <option value='https://www.plus2net.com/jquery/listbox-redirect.php?city=Paris'>Paris</option>

</select>
JQUERY
<script>
$(document).ready(function() {
///////////////////////////////
$("#city_id").change(function(){ // change function of listbox
//alert($('#city_id').val());
window.location = $('#city_id').val();
});
//////////////////////////
})
</script>


Subscribe

* indicates required
Subscribe to plus2net

    plus2net.com



    21-05-2022

    What about redirecting if the values are in the SQL table?

    Post your comments , suggestion , error , requirements etc here .







    Most Popular JQuery Scripts

    1

    Two dependant list boxes

    2

    Calendar with Date Selection

    3

    Data change by Slider

    4

    Show & Hide element


    JQuery Video Tutorials




    We use cookies to improve your browsing experience. . Learn more
    HTML MySQL PHP JavaScript ASP Photoshop Articles FORUM . Contact us
    ©2000-2024 plus2net.com All rights reserved worldwide Privacy Policy Disclaimer