how to create a pop up dialog box with details, when I click an event in a Content Search Web Part in Sharepoint 2013

Items displayed in a Content Search web part is controlled by the chosen display template in the web part properties.
To make the results open in a modal dialog, go to the site collection where the web part is > site settings > Master pages and page layouts > Display templates > Content Web Parts. 
Download a copy of the display template HTML file that you are using to display your data, for example Item_TwoLines.html
Open the display template in any text editor ( notepad or notepad++ ).
Begin with changing line 3 so that you know which one is your custom display template, for example <title>Two lines Custom</title>
Then replace the following value on line 67 ( Item-TwoLines.html. ) 

<a class="cbs-Line1Link ms-noWrap ms-displayBlock" href="_#= linkURL =#_" title="_#= $htmlEncode(line1.defaultValueRenderer(line1)) =#_" id="_#= line1LinkId =#_">_#= line1 =#_</a>

to

<a onclick="javascript:SP.UI.ModalDialog.showModalDialog({ url: '_#= linkURL =#_', title: '_#= $htmlEncode(line1.defaultValueRenderer(line1)) =#_' }); return false;" onmouseover="javascript:this.style.cursor='pointer';">_#= line1 =#_</a>

Save your custom Display template as Item_TwoLinesCustom.html as an example. Upload the file to the same place where you downloaded it. Then a javascript ( .js file ) file should be created with the same name. Make sure that you publish the html file that you uploaded.
Go back to the site where your content search web part is and edit the web part, you should now be able to set your custom template "Two lines Custom" as the Display Template to use. Select it and save the page. When clicking on a result, it should now open in a dialog. 

 

Open display form in Sharepoint Dialog using CSOM

In one of my project we got a requirement to show the display form of list item in popup same as default dialog in sharepoint. we have used JSOM to dispaly all the items of a list in specific design. On clicking on Read More link we need to display the popup.

Solution:

function ShowInModal(dispTitle, pageUrl) {  

             var viewportWidth = $(window).width();

             var viewportHeight = $(window).height();

             var options = {

                url: pageUrl,

                title: ''+dispTitle,

                width: viewportWidth * 0.7,

                height: viewportHeight * 0.8 

             };

             SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options);

          } 

<a href="javascript: void(0);" onclick="ShowInModal('DialogName','SiteUrl/Lists/ListName/DispForm.aspx?ID={{:ID}}&IsDlg=1');" alt="">read more</a>

Search Host Controller Service in "Starting" state

On my SharePoint 2013 developer machine I had an issue with the Search Service. i have created search service for the first time and configured crawling rules. i have started the full crawl for the first time but the status is showing as "Starting" though it wait for two days still it is showing as status as "Starting".

To solve this issue Copy the following script to a new .ps1 file and execute it within the SharePoint PowerShell console (run as (Farm-) Administrator):

$acl = Get-Acl HKLM:\System\CurrentControlSet\Control\ComputerName
$person = [System.Security.Principal.NTAccount]"Users"
$access = [System.Security.AccessControl.RegistryRights]::FullControl
$inheritance = [System.Security.AccessControl.InheritanceFlags]"ContainerInherit, ObjectInherit"
$propagation = [System.Security.AccessControl.PropagationFlags]::None
$type = [System.Security.AccessControl.AccessControlType]::Allow
$rule = New-Object System.Security.AccessControl.RegistryAccessRule($person, $access, $inheritance, $propagation, $type)
$acl.AddAccessRule($rule)
Set-Acl HKLM:\System\CurrentControlSet\Control\ComputerName $acl

$sh = Get-SPServiceInstance | ? {$_.TypeName -eq "Search Host Controller Service"}
$sh.Unprovision()
$sh.Provision($true)

Hide "Group" Header and ':(colon)' using css and Javascript in SharePoint list

Add  below code to either specific view of the list or  to script editor web part

.ms-gb a

{

display:none !important

}

</style>

<script type="text/javascript">

    _spBodyOnLoadFunctionNames.push("HideHeaders");

    function HideHeaders() {

        var elements = getElementsByClassName(document, "td", "ms-gb");

        var elem;

        for (var i = 0; i < elements.length; i++) {

            elem = elements[i];

            elem.childNodes[1].nodeValue = elem.childNodes[1].nodeValue.replace(':', '');

        }

        elements = getElementsByClassName(document, "td", "ms-gb2");

        for (var i = 0; i < elements.length; i++) {

            elem = elements[i];

            elem.childNodes[2].nodeValue = elem.childNodes[2].nodeValue.replace(':', '');

        }

    }

    function getElementsByClassName(oElm, strTagName, strClassName) {

        var arrElements = (strTagName == "*" && oElm.all) ? oElm.all : oElm.getElementsByTagName(strTagName);

        var arrReturnElements = new Array();

        strClassName = strClassName.replace(/\-/g, "\\-");

        var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");

        var oElement;

        for (var i = 0; i < arrElements.length; i++) {

            oElement = arrElements[i];

            if (oRegExp.test(oElement.className)) {

                arrReturnElements.push(oElement);

            }

        }

        return (arrReturnElements)

    }

Add SharePoint list choice field data to dropdown Programatically using SPField Class

Add SharePoint list choice field data to dropdown


SPSite oSite = new SPSite(url);
     SPWeb myWeb = oSite.OpenWeb();
    SPFieldChoice myField = (SPFieldChoice)myWeb.Lists["List Name"].Fields["FieldName"];
    DataTable dataTasks = new DataTable();
    DataColumn[] dtCols = new DataColumn[] { new DataColumn("FieldName", Type.GetType("System.String")) };
    dataTasks.Columns.AddRange(dtCols);
    for (int i = 0; i < myField.Choices.Count; i++)
     {
        DataRow dRow = dataTasks.NewRow();
        dataTasks.Rows.Add(Convert.ToString(myField.Choices[i]));
     }
    this.DrpTask.DataSource = dataTasks;
    this.DrpTask.DataValueField = Convert.ToString(dataTasks.Columns["FieldName"]);
     this.DrpTask.DataTextField = Convert.ToString(dataTasks.Columns["FieldName"]);
    this.DrpTask.DataBind();
     this.DrpTask.Items.Insert(0, "All");

Create a Slide Show in SharePoint 2010 using an Announcements List and SPServices

   

• The first step was using the Announcements list for the announcements slider.  Then create two custom list columns, “Image” and “Body”. The “Image” column is a “Hyperlink or Picture” column type and “Body” is a “multiple lines of text” column type.

• Reference SP Services, jQuery, jShowoff, and copy below JavaScript code to pull an image column from the Announcements list.

$(document).ready(function () {
 var emptyResults = "<div class='sliderDiv'><p class='announceTitle'>Company Name</p></div>";
  var maxVal = 0;
  var toShow = false;
  var heightTemp = 0;
  $().SPServices({
    operation : "GetListItems",
    async : false,
    listName : "Announcements",
    CAMLViewFields : "<ViewFields><FieldRef Name='Title' /><FieldRef Name='Image' /><FieldRef Name='Body' /><FieldRef Name='Modified' /></ViewFields>",
    CAMLQuery : "<Query><OrderBy><FieldRef Name='Created' /></OrderBy>" + "<Where><Or><Geq><FieldRef Name='Expires' /><Value Type='DateTime'>" + "<Today /></Value></Geq><IsNull><FieldRef Name='Expires' /></IsNull></Or></Where></Query>",

    completefunc : function (xData, Status) {
      var itemCount = $(xData.responseXML).SPFilterNode("rs:data").attr("ItemCount");
      if (itemCount > 0) {
        toShow = true;

        $(xData.responseXML).SPFilterNode("z:row").each(function () {
          var modDate = $(this).attr("ows_Modified");
          modDate = modDate.substr(5, 2) + "/" + modDate.substr(8, 2) + "/" + modDate.substr(0, 4);

          var titleHtml = "<div class='sliderDiv'><p class='announceTitle'>" + $(this).attr("ows_Title") + "</p>";
          var imgBody = "<img class='anImage' src='" + $(this).attr("ows_Image").split(',')[0] + "'></img>";
          var bodyHtml = "<p class='announceBody'>" + $(this).attr("ows_Body") + "</p>";
          var expireHtml = "<p class='announceFooter'>Modified: <span>" + modDate + "</span></p></div>";

          //div announcements is added by jshowoff js.

         $("#announcements").append(titleHtml + imgBody + bodyHtml + expireHtml);

        });

      } else {

        $("#announcements").append(emptyResults);

      }

    } //completefunc

  }); //SPServices

  if (toShow == true) {
    $('.sliderDiv').each(function () {
      heightTemp = $(this).height();
      if (heightTemp > maxVal) {
        maxVal = heightTemp
      };
    });
    $('#announcements').css('min-height', maxVal);
    $('#announcements').jshowoff({
      speed : 12000,
      changeSpeed : 3000,
      controls : true,
      animatePause : false,
      effect : 'fade',
      cssClass : true,
      links : true
    });
  } //if stm
}); //ready

Hiding Share Option in Document Library Callout Actions

To Hide Share Option in Document Library Callout Actions add below script.

<script type="text/ecmascript">

(function(){

if (typeof(_spBodyOnLoadFunctions) === 'undefined' || _spBodyOnLoadFunctions === null) {

return;

}

_spBodyOnLoadFunctions.push(function() {

if (typeof(SPClientTemplates) === 'undefined' || SPClientTemplates === null || (typeof(APD_InAssetPicker) === 'function' && APD_InAssetPicker())) {

return;

}

var registerOverrideToHideSocialActions = function(id) {

var socialactionsOverridePostRenderCtx = {};

socialactionsOverridePostRenderCtx.BaseViewID = 'Callout';

socialactionsOverridePostRenderCtx.ListTemplateType = id;

socialactionsOverridePostRenderCtx.Templates = {};

socialactionsOverridePostRenderCtx.Templates.Footer = function(renderCtx) {

var  renderECB;

if (typeof(isSharedWithMeView) === 'undefined' || isSharedWithMeView === null) {

renderECB = true;

} else {

var viewCtx = getViewCtxFromCalloutCtx(renderCtx);

renderECB = !isSharedWithMeView(viewCtx);

}

// By setting a null value as 2nd parameter, we do not specify additional callout actions.

return CalloutRenderCustomFooterTemplate(renderCtx, null, renderECB);

};

SPClientTemplates.TemplateManager.RegisterTemplateOverrides(socialactionsOverridePostRenderCtx);

}

// Hide actions for default Document Libraries

registerOverrideToHideSocialActions (101);

// Hide actions for the document library on your My Site

registerOverrideToHideSocialActions (700);

function CalloutRenderCustomFooterTemplate(renderCtx, calloutActionMenuPopulator, renderECB) {

if (typeof calloutActionMenuPopulator === 'undefined' || calloutActionMenuPopulator === null) {

calloutActionMenuPopulator = CalloutOnPostRenderCustomTemplate;

}

if (typeof renderECB === 'undefined' || renderECB === null) {

renderECB = true;

}

var calloutID = GetCalloutElementIDFromRenderCtx(renderCtx);

AddPostRenderCallback(renderCtx, function() {

var calloutActionMenu = new CalloutActionMenu(calloutID + '-actions');

calloutActionMenuPopulator(renderCtx, calloutActionMenu);

calloutActionMenu.render();

});

var ecbMarkup = [];

if (renderECB) {

ecbMarkup.push('<span id=' + StAttrQuote(calloutID + '-ecbMenu') + ' class="js-callout-actions js-callout-ecbActionDownArrow">');

ecbMarkup.push(RenderECBinline(renderCtx, renderCtx.CurrentItem, renderCtx.CurrentFieldSchema));

ecbMarkup.push('</span>');

}

return Callout.GenerateDefaultFooter(calloutID, ecbMarkup.join(''));

}

function CalloutOnPostRenderCustomTemplate(renderCtx, calloutActionMenu) {

var listItem = renderCtx.CurrentItem;

var openText = GetCallOutOpenText(listItem, renderCtx);

calloutActionMenu.addAction(new CalloutAction({

text: openText,

onClickCallback: function(calloutActionClickEvent, calloutAction) {

CalloutAction_Open_OnClick(calloutActionClickEvent, calloutAction, renderCtx);

}

}));

}

});

})();

</script>