June 16, 2017

How to escape a special character in filter parameter using REST API

Scenario: 
Recently working with REST API to get items from SharePoint list filtered by title field, I got stuck. it was working fine while having data without special character. But having special character - single quote/apostrophe (') in filter parameter was giving an error. I tried by passing value using EncodeURIComponent, but it didn't work either and getting the error as shown below:


Reason: 
EncodeURIComponent, Escape or EncodeURI functions can’t escape few special characters: - _ . ! ~ * ' ( )
 
Solution:
For such special characters as filter parameter, we should double the character (2 single quotes) and use it.

Example:
Non-working REST API:
https://{Site URL} /_api/web/lists/GetByTitle('listname')/items? select=ID&$filter=Title eq 'what's up'

Working REST API:
https://{Site URL} /_api/web/lists/GetByTitle('listname')/items? select=ID&$filter=Title eq 'what''s up'

If you have any questions you can reach out our SharePoint Consulting team here.

Create a subsite programmatically using Custom Site Template through SharePoint JavaScript Object Model and REST API

Here, I'll explain you in detail how to create SharePoint sub-site programmatically using custom Site Templates through JSOM and REST API.
 
Implementation Approach: First, we need to identify Web Template Id for our custom template. programmatically. And then, we will a create sub-site using the Web Template Id.

Let's go through the code snippet, now. We have two functions in code snippet:

1. CreateSubsiteByTemplateName(title, description, webUrl, templateTitle) 
- This function will create a sub-site by Template Name. First of all, it will find out the Template Id from Template Name, and then, will call another function to create the sub-site.
Parameters Information:
    1. title= name of sub-site which you want to create Ex: "subsite1"
    2. description = description for sub-site
    3. weburl = URL for sub-site Ex: "subsite1"
    4. templateTitle= Name of custom template Ex: "Physicians"

2. CreateSubsiteByTemplateId(title, description, webUrl, templateId)
- This function will create a sub-site by Template Id.
Parameters Information:
    1. title= name of sub-site which you want to create Ex: "subsite1"
    2. description = description for sub-site.
    3. weburl = URL for sub-site Ex: "subsite1"
    4. templateId= Id of custom template Ex: "{D5729655-B3D8-4DED-B5E9-3EE09934FC80}#Physicians"

Code Snippet 1:
 function CreateSubsiteByTemplateName(title, description, webUrl, templateTitle) {   
   var context = new SP.ClientContext.get_current();   
   var web = context.get_web();   
   context.load(web);   
   var webTemplates = web.getAvailableWebTemplates(1033, false);   
   context.load(webTemplates);   
   context.executeQueryAsync(function () {   
    var enumerator = webTemplates.getEnumerator();   
    var templateId = "STS#0";   
    while (enumerator.moveNext()) {   
     var webTemplate = enumerator.get_current();   
     var webTitle = webTemplate.get_title();   
     if (webTitle == templateTitle) {   
      templateId = webTemplate.get_name();  
      break;   
     }   
    }   
    CreateSubsiteByTemplateId(title, description, webUrl, templateId);   
   },   
    function (sender, args) {   
     alert(args.get_message())   
    }   
   );   
  }  

Code Snippet 2:
 function CreateSubsiteByTemplateId(title, description, webUrl, templateId) {    
   var restAPIURL = "/_api/web/webinfos/add";    
   var newSiteData = JSON.stringify(    
   {    
   'parameters': {    
    '__metadata': {    
    'type': 'SP.WebInfoCreationInformation'    
    },    
    'Url': webUrl,    
    'Description': 'Subsite created from REST API',    
    'Title': title,    
    'Language': 1033,    
    'WebTemplate': templateId,    
    'UseUniquePermissions': true    
   }    
   });    
   $.ajax    
   ({    
   url: restAPIURL,    
   type: "POST",    
   async: false,    
   data: newSiteData,    
   headers: {    
    "accept": "application/json;odata=verbose",    
    "content-type": "application/json;odata=verbose",    
    "X-RequestDigest": $('#__REQUESTDIGEST').val()    
   },    
   success: function (data) {    
    console.log('site created');    
   },    
   error: function (data) {    
    console.log('Error creating site');    
   }    
   });    
  }    

If you have any questions you can reach out our SharePoint Consulting team here.

April 18, 2017

Page-break-before doesn't work with IE.

I came across the requirement to print web page using JavaScript. Normally, If we need to add page break while printing the web page, we use "page-break-before" property in CSS. But "page-break-before" does not work with Internet Explorer (IE) browser. Here, I'll show you how we can achieve the desired behavior.

Resolution:

Below is the HTML snippet which is generated using JavaScript. Here, we want to add page break before each Div element. So, I've used "page-break-before:always" style property in each Div element. It will break the page while printing web page. It works fine with "Chrome" or "Mozilla" browsers but it doesn't work with Internet Explorer (IE) browser.

<h1>Page Title</h1>
<!-- content block -->
<!-- content block -->
<div style="page-break-before:always;"></div>
<!-- content block -->
<!-- content block -->
<div style="page-break-before:always;"></div>
<!-- content block -->
<!-- content block -->
<!-- content -->
To have "page-break-before:always" property working in all browsers including Internet Explorer, we need to add one extra Div tag (highlighted) with empty space ("&nbsp;") as shown in below code snippet.

<h1>Page Title</h1>
<!-- content block -->
<!-- content block -->
<div style="page-break-before:always;"></div>
<div>&nbsp;</div>
<!-- content block -->
<!-- content block -->
<div style="page-break-before:always;"></div>
<div>&nbsp;</div>
<!-- content block -->
<!-- content block -->
<!-- content -->
If you have any questions you can reach out our SharePoint Consulting team here.