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.
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';
}
}
});
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.
There are many articles which explain how to setup the Remote Web & SharePoint On-Prem. The following articles explains everything end to end.
http://blogs.msdn.com/b/russmax/archive/2014/06/23/part-1-intro-to-provider-hosted-apps-setup-the-infrastructure.aspx
http://blogs.msdn.com/b/russmax/archive/2014/06/26/part-2-intro-to-provider-hosted-apps-develop-package-and-deploy.aspx
Following is the JSOM code which will help in getting single or multiple items from a SharePoint’s People Picker Field.
function GetPeoplePickerFieldValue(currentListItem, internalFieldName) {
if (currentListItem.get_item(internalFieldName) !== 'undefined' && currentListItem.get_item(internalFieldName) !== null) {
if (currentListItem.get_item(internalFieldName).length > 0) {
var _user = "";
//If field has only one item
if (currentListItem.get_item(internalFieldName).length == 1) {
_user = currentListItem.get_item(internalFieldName)[0].get_lookupValue();
if (_user == null)
_user = "";
}
//If field has multiple item
if (currentListItem.get_item(internalFieldName).length > 1) {
for (var i = 0; i < currentListItem.get_item(internalFieldName).length; i++) {
//Append all User names with a semi colon separator
_user = _user + currentListItem.get_item(internalFieldName)[i].get_lookupValue() + "; ";
}
_user.trim;
if (_user == null)
_user = "";
}
}
return _user;
}
}
Recently I came across an issue where the query string had unicode characters and ASP.NET’s “HttpUtility.UrlDecode” was not properly converting the characters. After searching few minutes came across the following solution posted by cjsharp1 at Stackoverflow.
private string GetQueryStringValueFromRawUrl(string queryStringKey)
{
var currentUri = new Uri(HttpContext.Current.Request.Url.Scheme + "://" +
HttpContext.Current.Request.Url.Authority +
HttpContext.Current.Request.RawUrl);
var queryStringCollection = HttpUtility.ParseQueryString((currentUri).Query);
return queryStringCollection.Get(queryStringKey);
}
This is a simple beat sequence created using the