How to submit postfix '+ tag: <keyword>' to a form?
I have a Shopify store and would like to use a search form to filter based on tags. According to the Buy documentation , I must "Prefix a word with a field name and a colon to narrow the search for that term to the specified field" ..
The default search form looks like this:
<form action="/search" method="get" class="search-bar" role="search">
<input type="hidden" name="type" value="product">
<input type="search" name="q" value="{{ search.terms | escape }}" placeholder="Zoeken naar..." aria-label="Search all products">
<button type="submit" class="search-bar--submit icon-fallback-text">
<span class="icon icon-search" aria-hidden="true"></span>
<span class="fallback-text">Zoeken</span>
</button>
</form>
When a search is done celavita
, the url looks like this:
http://store.<redacted>.com/search?type=product&q=celavita
I want the url to end like this:
http://store.<redacted>.com/search?type=product&q=celavita+tag:Jumbo
I've tried this:
<form action="/search" method="get" class="search-bar" role="search">
<input type="hidden" name="type" value="product">
<input type="search" name="q" value="{{ search.terms | escape }}" placeholder="Zoeken naar..." aria-label="Search all products">
<input type="hidden" name="tag" value="Jumbo">
<button type="submit" class="search-bar--submit icon-fallback-text">
<span class="icon icon-search" aria-hidden="true"></span>
<span class="fallback-text">Zoeken</span>
</button>
</form>
But this causes the URL to look like this:
http://store.<redacted>.com/search?type=product&q=celavita&tag=Jumbo
What can I try next? Can this be done with JavaScript / jQuery?
+3
source to share
1 answer
Using jquery you can do something like this. (Unverified)
$(".search-bar").submit(function(){
var type=$("input[name='type']").val();
var q=$("input[name='q']").val();
var tag=$("input[name='tag']").val();
var url="http://store.<redacted>.com/search?type="+type+"&q="+q+"+tag:"+tag;
window.location = url;
return false;
});
0
source to share