Based on the question below and example , I wanted to achieved that result based on the clicked box with the name and value to be added on the url.example of that is based on the checked box the url output https://test.com/searchnewdata?Year=2020,2019,2018&Model=EcoSport,Edge.
Basic JS basis
$(document).ready(function(){
$("#btnSearch").click(function(){
//var url="http://example.com/results?choice=choice2&choice=choice4"
var url="http://example.com/results?choice=";
var flag=false;
$("input:checkbox[name=choice]:checked").each(function(){
if(!flag)
{
url=url+$(this).val();
flag=true;// To trace if first query string added
}
else
{
url=url+"&choice="+$(this).val();
}
});
alert(url);
});
});
HTML CODE
<form name="search_something" action=/results method="get">
<text>Year</text>
<li class="checkbox margin-top-x"><label
for="refine-search-Year-2019"><input type="checkbox"
name="Year" value="2019"
id="refine-search-Year-2019">2019 <span
class="filterVehicleCount">(15)</span></label>
</li>
<li class="checkbox margin-top-x"><label
for="refine-search-Year-2018"><input type="checkbox"
name="Year" value="2018"
id="refine-search-Year-2018">2018 <span
class="filterVehicleCount">(30)</span></label>
</li>
<li class="checkbox margin-top-x"><label
for="refine-search-Year-2017"><input type="checkbox"
name="Year" value="2017"
id="refine-search-Year-2017">2017 <span
class="filterVehicleCount">(43)</span></label>
</li>
<li class="checkbox margin-top-x"><label
for="refine-search-Year-2016"><input type="checkbox"
name="Year" value="2016"
id="refine-search-Year-2016">2016 <span
class="filterVehicleCount">(30)</span></label>
</li>
<text>Model</text>
<li class="checkbox margin-top-x"><label
for="refine-search-Make-Acura"><input
type="checkbox" name="Make" value="Ecosport"
id="refine-search-Make-Acura"><span
class="notranslate">Ecosport</span> <span
class="filterVehicleCount">(1)</span></label>
</li>
<li class="checkbox margin-top-x"><label
for="refine-search-Make-BMW"><input type="checkbox"
name="Make" value="Edge"
id="refine-search-Make-BMW"><span
class="notranslate">Edge</span> <span
class="filterVehicleCount">(1)</span></label>
</li>
</form>
Desired Result for example based on the checked box.
https://test.com/searchnewdata?Year=2020,2019,2018&Model=EcoSport,Edge
Aucun commentaire:
Enregistrer un commentaire