I have 2 dropdown menus, and I need to pose a link with it's values.

Here is the code:

<form id="dropdown1">
    <select id="linha">
        <option value="G12">Option 1</option>
        <option value="G11">Option 2</option>
        <option value="H89">Option 3</option>
    </select>
    <select id="dia">
        <option value="all">Every day</option>
        <option value="work">working days</option>
        <option value="sat">saturday</option>
        <option value="sun">sunday</option>
    </select>
</form>

I need something in JavaScript to "pose" a link with /*selected_linha_value*/*selected_dia_value*

How can I do that?

I have 2 dropdown menus, and I need to pose a link with it's values.

Here is the code:

<form id="dropdown1">
    <select id="linha">
        <option value="G12">Option 1</option>
        <option value="G11">Option 2</option>
        <option value="H89">Option 3</option>
    </select>
    <select id="dia">
        <option value="all">Every day</option>
        <option value="work">working days</option>
        <option value="sat">saturday</option>
        <option value="sun">sunday</option>
    </select>
</form>

I need something in JavaScript to "pose" a link with http://somewebsite./*selected_linha_value*/*selected_dia_value*

How can I do that?

• javascript
• html
• forms
• html-select

5 Answers 5

    <select name="dia" id="dia">
      <option value="all">Every day</option>
      <option value="http://stackoverflow.">working days</option>
      <option value="http://anotherSite.">saturday</option>
      <option value="http://anotherSite2.">sunday</option>
    </select>
    <script>
    $("#dia").change(function () {
              var selctedValue = "";
              $("select option:selected").each(function () {
                    selctedValue += $(this).val();
window.location.href = selctedValue;

    });
    });

i think u need something like this.

<script type="text/javascript">
params = getParams();
var name1 = unescape(params["linha"]);
switch(name1)
{
case "g12":
window.location = "http://www.google."
}

function getParams(){
var idx = document.URL.indexOf('?');

var params = new Array();
if (idx != -1) {
var pairs = document.URL.substring(idx+1, document.URL.length).split('&');
for (var i=0; i<pairs.length; i++){
nameVal = pairs[i].split('=');
params[nameVal[0]] = nameVal[1];
}
}
return params;
}

Its not the full code. It will give you some idea. If you have any doubt just ment

Take a look at: http://jsfiddle/ERHhA/

You can use jQuery val() to get the value of the select boxes. Then just append these values to the base url.

var url = "http://somewebsite./" + $('#linha').val() + "/" + $('#dia').val();

What about this one?

function make_url(){
    var linha = document.getElementById('linha').value;
    var dia = document.getElementById('dia').value;
    var url=window.location.href;
    var pos=url.indexOf('?');
    if (pos>-1){
        url = url.substr(0,pos);
    }
    //alert(url + '?linha='+linha+'&dia='+dia); return;
    document.location.href = url + '?linha='+linha+'&dia='+dia;
}

fiddle

HTML

<div class="container">
    <select class="small-nav">
    <option value="" selected="selected">Go To</option> 
    <option value="http://whiterabbitexpress.">Services</option>
    <option value="http://shop.whiterabbitjapan.">Shop</option>
</div><!-- container -->

JScript:

$(".small-nav").change(function() {
        window.location = $(this).find("option:selected").val();
    });