Link select not working?

Question

Hello folks good afternoon!

I have the following code, that I need to form a link at the end, and display the filtered page to the client, but the link always falls on the first ID, which in case is : Agrale.

My question is: How could I be making this filter work ?

Note: I need only the "Filter" button to have the Onclick of values.

<div class="container">
    <select>
        <option id="" type="text" value="">Selecione o departamento...</option>
        <option id="departamento" type="text" value="automotivo">Automotivo</option>
    </select>
    <select>
        <option id="" type="text" value="">Selecione a categoria...</option>
        <option id="categoria" type="text" value="pastilhas-de-freio">Pastilhas de Freio</option>
    </select>
    <select>
        <option id="" type="text" value="">Selecione a montadora...</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Agrale">Agrale</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Alfa Romeo">Alfa Romeo</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Audi">Audi</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Cadillac">Cadillac</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Chevrolet">Chevrolet</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Chrysler">Chrysler</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Citroën">Citroën</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Daewoo">Daewoo</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Fiat">Fiat</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Ford">Ford</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Gurgel">Gurgel</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Honda">Honda</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Hyundai">Hyundai</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Isuzu">Isuzu</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Iveco">Iveco</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Jac Motors">Jac Motors</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Jeep">Jeep</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Kia Motors">Kia Motors</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Lancia">Lancia</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Land Rover">Land Rover</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Marcopolo">Marcopolo</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Mercedes Benz">Mercedes Benz</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Nissan">Nissan</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Peugeot">Peugeot</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Renault">Renault</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Scania">Scania</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Seat">Seat</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:SsangYong">SsangYong</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Subaru">Subaru</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Suzuki">Suzuki</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Toyota">Toyota</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Troller">Troller</option>
        <option id="montadora" type="text" value="?fq=specificationFilter_351:Troller">Volkswagen</option>
    </select>
    <INPUT id="filtro-j" type="submit" name="b1" value="Filtrar" onClick="location.href='http://www.rs1.com.br/' document.getElementById('departamento').value '/' document.getElementById('categoria').value '/' document.getElementById('montadora').value">
</div>

Answer 1

You have to use the + to concatenate this url. You really shouldn’t do that in the middle of HTML:

Instead of

onClick="location.href='http://www.rs1.com.br/' document.getElementById('departamento').value '/' document.getElementById('categoria').value '/' document.getElementById('montadora').value"

you should do:

<script>
var departamento = document.getElementById('departamento');
var categoria= document.getElementById('categoria');
var montadora= document.getElementById('montadora');
var input = document.getElementById('filtro-j');
input.addEventListener('click', function(e){
    e.preventDefault(); // não precisarias disto se o input fosse <button type="button">Filtrar</button>
    location.href = ['http://www.rs1.com.br', departamento.value, categoria.value, montadora.value].join('/');
});
</script>

and put that code at the bottom of the page.

Another important thing: Is the select which must have the ID and not the same ID at all option. Ids have to be unique, he was always selecting the same element, the first one he found. Changes this in HTML.

Online example: http://codepen.io/anon/pen/zvwGVj