Using two different templates for search results - Haystack - templates

Question

I am totally confused how I can use two different template files for the search results. Suppose I have two different pages for searching and I want to have different decorations for each page search results.
This search bar is in one page:
<div class="main-header_search">
<form method="get" action="/search1" id="header_find_form" class="main-search yform" role="search"
data-component-bound="true">
<div class="arrange arrange--middle arrange--6">
<div class="arrange_unit" style="width: 100%;">
<div class="main-search_suggestions-field search-field-container find-decorator">
<label class="main-search_pseudo-input pseudo-input">
<span class="pseudo-input_text">Find</span>
<span class="pseudo-input_field-holder">
<input autocomplete="off" type="search" id="id_q" maxlength="64" name="q"
placeholder="Cheap dinner, Cafe" value=""
class="main-search_field pseudo-input_field"
aria-autocomplete="list" tabindex="1" data-component-bound="true">
</span>
</label>
<div class="main-search_suggestions suggestions-list-container search-suggestions-list-container hidden"
data-component-bound="true">
<ul class="suggestions-list" role="listbox" aria-label="Search results"></ul>
</div>
</div>
</div>
<div class="arrange_unit main-search_actions">
<button class="ybtn ybtn-primary main-search_submit" id="header-search-submit"
tabindex="3"
title="Search" type="submit" value="search">
<i class="i ig-common_sprite i-search-common_sprite"></i>
</button>
</div>
</div>
</form>
</div>
And this is in another page:
<form method="get" name="business_search_form" class="yform business-search-form"
action="/search2" role="search">
<div class="arrange arrange--6 arrange--stack">
<div class="arrange_unit arrange_unit--fill">
<div class="arrange arrange--equal arrange--6 arrange--stack">
<div class="arrange_unit">
<label class="responsive-visible-small-block hidden-non-responsive-block">Business
Name</label>
<div class="pseudo-input business-find-decorator">
<div class="flex-container-inline">
<div class="label responsive-hidden-small">Business Name</div>
<div class="flex-box input-holder">
<input class="landing-search-biz-name" placeholder="e.g. Mel's Diner"
name="q" autocomplete="off" type="text">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="arrange_unit nowrap">
<button type="search" value="search"
class="ybtn ybtn-primary yform-search-button ybtn-full-responsive-small"><span><span
class="i-wrap ig-wrap-common i-search-dark-common-wrap"><i
class="i ig-common i-search-dark-common"></i> Get Started</span></span></button>
</div>
</div>
</form>
I would like to use something like this in urls.py to have two different templates for each search results:
(r'^search1/', include('haystack.urls'), name='template1'),
(r'^search2/', include('haystack.urls'),name='template2'),
I am using simple haystack backend in my setting.py:
HAYSTACK_CONNECTIONS = {
'default': {
'ENGINE': 'haystack.backends.simple_backend.SimpleEngine',
},
}

Answer 1

Here is how I would do it:
First, create a search form that inherits haystack's SearchForm:
class ItemSearchForm(SearchForm):
def search(self, request):
items = super(ItemSearchForm, self).search().models(Item) // Item is your model name
shops = super(ItemSearchForm, self).search().models(Shop)
return {'items': items, 'shops': shops}
Second, create views that uses this form:
def searchItems(request):
form = ItemSearchForm(request.GET)
results = form.search(request)
return render(request, 'search/search.html', {
'items': results['items']
})
def searchShops(request):
form = ItemSearchForm(request.GET)
results = form.search(request)
return render(request, 'search/search.html', {
'shops': results['shops']
})
Please note that these two views use different return values. You can change it to fix your situation.
Then, configure urls:
(r'^search1/', 'views.search1', name='search1'),
(r'^search2/', 'views.search2', name='search2'),
The only thing left to do, write your indexes file and documents. This should do it.