dragonball dragonball - 4 months ago 10
Javascript Question

How to create search 'filter' using PHP & MySQL

I am working on a job portal Website. I have the following form code in my Webpage:

<form action="" method="get">
<h6>Location:</h6>
<select class="form-control" onchange="if (this[this.selectedIndex].value !== '0') document.location.href=this.value;">
<option value="0" selected="selected">Anywhere</option>
<option value="?l=Bengaluru">Bengaluru</option>
<option value="?l=Noida">Noida</option>
</select>
<h6>Job Type:</h6>
<select class="form-control" onchange="if (this[this.selectedIndex].value !== '0') document.location.href=this.value;">
<option value="0" selected="selected">Select</option>
<option value="?t=Freelancer">Freelancer</option>
</select>
</form>
<h6>Job Category:</h6>
<select class="form-control" onchange="if (this[this.selectedIndex].value !== '0') document.location.href=this.value;">
<option value="0" selected="selected">Select</option>
<option value="?c=data-scientist">Data Scientist</option>
</select>
</form>


But everytime I click to get the selected option I get them seperately. Like this : Getting seperated selection values from the form in the URL

I want to concat all these selected values in the URL based on whichever select box is selected first by user.

I want to make search data appear as following

Please help! Click on the links to understand my question better. Sorry for my english! :(

Answer

Check this fiddle change it to fit your needs.

$("select").on("change", function() {
    var url = "";
    $("select").each(function() {
        if ($(this).val() != 0) {
            url += $(this).val();
        }
    });
    $(".url").html(url);
});

It's a basic example you need to change the result to change the URL.