Link select does not work?

Navigation
3

Hello everyone, good afternoon!

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

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

Note: I need only the "Filter" button to get the values ONclick. 

<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>
    
asked by anonymous 05.10.2015 / 18:30

1 answer

2

You must use + to concatenate this url. In fact you should not do this in the middle of HTML but rather apart:

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 this code at the bottom of the page.

Another important thing : It is the select that must have the ID and not the same ID in all option . IDs have to be unique, he was always selecting the same element, the first one to find. Change this in HTML.

Example online: link

    
05.10.2015 / 18:38
Create flanges dynamically in excel Why does the for-loop convert from Date to integer?