March 10, 2016 / Kannan / 0 Comments
While working on designing display template for drop down based refiners in SharePoint Search there was a requirement to show counts along with refiners in refiners list.
Following is the change which I made in the refiner’s display template.
Actual code
<option value='_#= onChangeOrClick =#_'>_#= $htmlEncode(refinementName) =#_</option>
Updated Code
<option value='_#= onChangeOrClick =#_'>_#= $htmlEncode(refinementName) =#_ (_#= refinementCount =#_)</option>
March 8, 2016 / Kannan / 0 Comments
Recently one of the customer had a strange request where the customer wanted to Hide “Available Refiners” in SharePoint search refinement panel.
The “Available Refiners” is available in “Drop Down” type refinement panel.
When the refinement panel is being loaded, SharePoint executes a JavaScript function named AddPostRenderCallback. This would be available in the Refinement Display Template located under MasterPage/Search Gallery. The actual method looks like below code which is taken from O365.
AddPostRenderCallback(ctx, function() {
if (hasAnyFiltertokens) {
// Get the hidden block
var hiddenOptions = document.getElementById(hiddenBlockID).children;
var unSelGroup = document.getElementById(unselDD);
var selGroup = document.getElementById(selDD);
// Clone all the elements from the hidden list to the unselected option group
for (var i = 0; i < hiddenOptions.length; i++) {
var selectedElm = GetAllElementsWithAttribute(selGroup, 'value', hiddenOptions[i].getAttribute('value').replace('updateRefinersJSON', 'removeRefinementFiltersJSON'));
if (selectedElm === null || selectedElm.length <= 0) {
var cloneElm = hiddenOptions[i].cloneNode(true);
unSelGroup.appendChild(cloneElm);
}
}
}
});To the above original code I made a small change so that “Clone all the elements” code executes only when user has selected a refiner.
// Clone all the elements from the hidden list to the unselected option group
if(selectedFilters.length <= 0)
{
for (var i = 0; i < hiddenOptions.length; i++) {
var selectedElm = GetAllElementsWithAttribute(selGroup, 'value', hiddenOptions[i].getAttribute('value').replace('updateRefinersJSON', 'removeRefinementFiltersJSON'));
if (selectedElm === null || selectedElm.length <= 0) {
var cloneElm = hiddenOptions[i].cloneNode(true);
unSelGroup.appendChild(cloneElm);
}
}
}
To the above orignal code I added the following code to hide the “Available Refiners” option.
if(selectedFilters.length > 0)
{
if(unSelGroup!=null)
{
unSelGroup.style.display = 'none';
}
}The above code will hide the “unSelGroup”‘s “Option Group” HTML to hide the Options for “Available Refiners”.
Final code would look like below.
AddPostRenderCallback(ctx, function() {
if (hasAnyFiltertokens) {
// Get the hidden block
var hiddenOptions = document.getElementById(hiddenBlockID).children;
var unSelGroup = document.getElementById(unselDD);
var selGroup = document.getElementById(selDD);
// Clone all the elements from the hidden list to the unselected option group
if(selectedFilters.length <= 0)
{
for (var i = 0; i < hiddenOptions.length; i++) {
var selectedElm = GetAllElementsWithAttribute(selGroup, 'value', hiddenOptions[i].getAttribute('value').replace('updateRefinersJSON', 'removeRefinementFiltersJSON'));
if (selectedElm === null || selectedElm.length <= 0) {
var cloneElm = hiddenOptions[i].cloneNode(true);
unSelGroup.appendChild(cloneElm);
}
}
}
//Added for Gold Asset requirement where once a refiner is selected the "Avaialble Refiners" item should be made hidden
if(selectedFilters.length > 0)
{
if(unSelGroup!=null)
{
unSelGroup.style.display = 'none';
}
}
var refinerUpArrow = document.getElementById('refinerExpandCollapseArrow');
if(refinerUpArrow!=null)
{
refinerUpArrow.style.display = 'none';
}
}
});
End Result is following
March 7, 2016 / Kannan / 0 Comments
Recently I had a requirement for OOTB search Box + Result where the customer wanted to clear the search results regardless of any refinement selected or not.
To implement this, in the display template HTML the following was added.
Do note that if refinements are there, the commented single line of code didn’t work and I had to replace the entire # as blank. Do check the original source (mentioned below) for more information.
<!--#_
clearSearchResults = function()
{
var hash = window.location.hash;
if( hash.indexOf('Default') == 1 ) {
hash = unescape(hash);
var kIdx = hash.indexOf('"k":');
var rIdx = hash.indexOf('","');
var query = hash.substring(kIdx+5,rIdx);
query = query.replace(/\\/g, '');
//window.location.href = window.location.pathname + window.location.search + '#k=' + escape(query);
window.location.href = window.location.pathname + window.location.search + '#';
} else {
window.location.href = window.location.pathname + window.location.search + "#";
}
}
_#-->
<div id="ClearSearch" class="ms-alignCenter">
<h2><a onclick="clearSearchResults();" style="cursor:pointer">Clear/Reset All</a></h2>
</div>The source for the above code is Add a “Clear Filters” link to your search page in SharePoint 2013
April 1, 2013 / Kannan / 0 Comments
We have a document list with 2 columns. One is a text column and other is a lookup column
The requirement was that, user should be able to search across two columns, where the condition being, search should match with either of the column. The following url format works for this particualr scenario.
http://server/sites/site1/sitePages/DocumentSearchPage.aspx?k= &r=Column1:”query*” OR Column2:”query*”&cs=This List&u=http://server/sites/site1/library1
Note:
DocumentSearchPage.aspx has a Search Core Results webpart.
The parameer “k” is not required. But sometime without this parameter search result is blank. Hence “k” will have a empty character as string.
cs=This List is a query paramter which helps in searching a particular library. This depends on the parameter “u” explained in next line.
u=http://server/sites/site1/library1 is the library from which search result should come.