Search

SharePoint Components

Connect, Communicate, Collaborate

Open Search
Tag

content editor

Add Custom menu Item in ECB Menu using Javascript


SharePoint provides a build in JavaScript, which has two functions for ECB AddListMenuItems and AddDocLibMenuItems.These methods are executed by SharePoint to display context menu.

Below is an example for AddListMenuItems

function Custom_AddListMenuItems(m, ctx)

{
//Add your Menu Name which you want to display
var strDisplayText = “Copy Item”;
var itemId = GetAttributeFromItemTable(itemTable, “ItemId”, “Id”);
var listId = ctx.listName;
// you customize the action based on your needs
var strAction = “<<JavaScript Code>>”;
var strImagePath = “”;
// Add our new menu item

CAMOpt(m, strDisplayText, strAction, strImagePath);

// add a separator to the menu

CAMSep(m);

// false means that the standard menu items should also be rendered
// if you set true, it will show only the menu which you added( standard sharepoint menu items will not be available.
// you can control by setting the value of true or false
return false;

}

///Similary you can hide the “Delete Item” (particular) menu item in List Context Menu
// Add this below function

function CAMOpt(p,wzText,wzAct,wzISrc,wzIAlt,wzISeq,wzDesc)
{
var mo=CMOpt(wzText,wzAct,wzISrc,wzIAlt,wzISeq,wzDesc);
if(!mo)return null;
if(wzText != “Delete Item”) AChld(p,mo);
return mo;
}

ECB

Reference URL:

http://www.c-sharpcorner.com/blogs/how-to-customize-sharepoint-ecm-menu1

0

Follow a Video in SharePoint


Now in SharePoint, the videos are actually stored as Document Sets . And you cannot follow a Document Set. Which is why you do not get the option to follow a video.

The following content types can be followed :

  • User
  • Document
  • Site
  • Tag

Now we can follow a Document Set using JavaScript based on the reference link below

http://sharepoint.stackexchange.com/questions/97626/following-document-set

The code goes like this:

function startFollowing(webUrl,fileUrl){
var endpointUrl = webUrl + “/_api/social.following/follow”;
var actor = {
“actor”:{
“__metadata”:{“type”:”SP.Social.SocialActorInfo”},
“ActorType”:1,
“ContentUri”: fileUrl,
“Id”:null
}
};
return executeRequest(endpointUrl,’POST’,null,actor);
}
function getFiles(webUrl,folderUrl){
var endpointUrl = webUrl + “/_api/web/GetFolderByServerRelativeUrl(‘” + folderUrl + “‘)/files”;
return executeRequest(endpointUrl,’GET’);
}
function followFiles(webUrl,folderUrl)
{
return getFiles(webUrl,folderUrl).then(function(data){
var files = data.d.results;
if(files.length == 0) return;
var fileUrl = webUrl + ‘/’ + folderUrl + ‘/’ + files[0].Name; //server absolute file url
data = startFollowing(webUrl,fileUrl);
for (var i = 1; i < files.length; i++) {
(function (i) {
data = data.then(function() {
fileUrl = webUrl + ‘/’ + folderUrl + ‘/’ + files[i].Name;
return startFollowing(webUrl,fileUrl);
});
}(i));
}
});
}
where

function executeRequest(url,method,headers,payload)
{
if (typeof headers == ‘undefined’ || headers == null){
headers = {};
}
headers[“Accept”] = “application/json;odata=verbose”;
if(method == “POST”) {
headers[“X-RequestDigest”] = $(“#__REQUESTDIGEST”).val();
}

var ajaxOptions =
{
url: url,
type: method,
contentType: “application/json;odata=verbose”,
headers: headers
};
if(method == “POST”) {
ajaxOptions.data = JSON.stringify(payload);
}

return $.ajax(ajaxOptions);
}
Usage

Assume a Documents library contains Guides document set, then the following example demonstrates how to follow files in document set:

var webUrl = _spPageContextInfo.webAbsoluteUrl;
followFiles(webUrl,’Documents/Guides’);

0

Get All Sites and Sub Sites using REST API


In order to get the list of sub sites from a site we need to call the below URL:

/_api/site/rootWeb/webinfos

Now to get the entire site structure we will need to loop every site to see if there are any sub sites present.

Below is the code I have used.

//The First Ajax is to get the Root Site Title and the Relative URL
$.ajax({
url: _spPageContextInfo.siteAbsoluteUrl + “/_api/site/rootweb?$select=Title,ServerRelativeUrl”,
method: “GET”,
headers: {
“Accept”: “application/json; odata=verbose”
},
success: function(rootsite) {

},
error: function(rootsite) {},
async: false
});

// The Second AJAX is to get all the sub sites under the Root Site
$.ajax({
url: _spPageContextInfo.siteAbsoluteUrl + “/_api/web/webinfos?$select=ServerRelativeUrl,Title”,
method: “GET”,
headers: {
“Accept”: “application/json; odata=verbose”
},
success: function(subsites) {
$.each(subsites.d.results, function() {
getSubSites(this.ServerRelativeUrl, this.Title);
});

},
error: function(subsites) {},
async: false
});
// This is a Recursive Function to loop through the sub sites and check for more sub sites
function getSubSites(SubSiteUrl, SubSiteTitle) {
console.log(SubSiteUrl);
$.ajax({
url: _spPageContextInfo.siteAbsoluteUrl + SubSiteUrl + “/_api/web/webinfos?$select=ServerRelativeUrl,Title”,
method: “GET”,
headers: {
“Accept”: “application/json; odata=verbose”
},
success: function(subsites) {

$.each(subsites.d.results, function(index) {
getSubSites(this.ServerRelativeUrl, this.Title);
});
},
error: function(subsites) {},
async: false
});
}

Reference link :

http://sharepoint.stackexchange.com/questions/92467/retrieve-toplevel-sites-subsites-using-rest-api

2

Event Timeline for SharePoint


Events are taken from the Calendar List and displayed in a more intuitive manner.

I have used the timeline script from the below URL:

http://tympanus.net/codrops/2012/11/19/responsive-css-timeline-with-3d-effect/

I have added an extra column to store the image URL.

Code: timeline

List: 

list

Timeline:

timeline

 

 

0

SharePoint Security


The code I am attaching will do the following things

  1. Get all users from the site
  2. Check if User is Site Admin
  3. Get all groups the user belongs to
  4. Details page of user on click of user name
  5. Navigate to group on click of group name

I have used datatables.net to enable the following

  1. Default UI of datatable.net
  2. Search
  3. Sort
  4. Export to CSV, Excel, PDF

This is a working code for Office 365

Code : sharepoint security

In addition to the above code, the following JavaScript library files will be required:

Reference URL (you may really need to check these to know how it works):

https://www.datatables.net/download/packages

https://www.datatables.net/extensions/buttons/

https://datatables.net/extensions/buttons/examples/html5/pdfImage.html

https://datatables.net/reference/button/

sharepoint security

 

0

Convert SharePoint List to PDF,CSV,Excel using JavaScript


Just few days back I was surfing through the SharePoint Store and I found an app called “List2Pdf”. This actually is useful when it comes to users who store the data in SharePoint Lists and then export the view to a PDF document.

So I thought to myself, maybe I can try something like this using JavaScript. After surfing the internet I found a useful site: http://datatables.net/

Now this had cool stuffs you can use, but i was lazy to find out how i could use this for SharePoint, but then I found this blog

http://sharepoint.danishislam.com/Blog/Post/9/Use-jQuery-Datatables-for-SharePoint-List-Webpart-with-export-to-CSV,-EXCEL,-PDF-and-Print-features

This blog told me exactly what I needed to do.

Click to download : listtopdf

In addition to the above code, the following JavaScript library files will be required:

 

Reference URL (you may really need to check these to know how it works):

https://www.datatables.net/download/packages

https://www.datatables.net/extensions/buttons/

https://datatables.net/extensions/buttons/examples/html5/pdfImage.html

https://datatables.net/reference/button/

listtopdf

 

 

 

1

How to create a Document Set using SharePoint REST Interface


The following example demonstrates how to create a Document Set in SharePoint 2013:

function getListUrl(webUrl,listName) 
{
    return $.ajax({       
       url: webUrl + "/_api/lists/getbytitle('" + listName + "')/rootFolder?$select=ServerRelativeUrl",   
       type: "GET",   
       contentType: "application/json;odata=verbose",
       headers: { 
          "Accept": "application/json;odata=verbose"
       }
    });
}


function createFolder(webUrl,listName,folderUrl,folderContentTypeId) 
{                
     return $.ajax({
           url: webUrl + "/_vti_bin/listdata.svc/" + listName,
           type: "POST",
           contentType: "application/json;odata=verbose",
           headers: {
              "Accept": "application/json;odata=verbose",
              "Slug": folderUrl + "|" + folderContentTypeId
           }
     });
}


function createDocumentSet(webUrl,listName,docSetName)
{
    return getListUrl(webUrl,listName)
           .then(function(data){
               var folderUrl = data.d.ServerRelativeUrl + '/' + docSetName;
               return createFolder(webUrl,listName,folderUrl,'0x0120D520');
           }); 
}

Reference Link: http://sharepoint.stackexchange.com/questions/147149/creating-document-set-and-setting-values-with-rest-listdata-svc
0

Version History Trimmer


 

The code currently deletes all the versions from just one document.But this will give you an idea of how to make it work for multiple documents as well

here is the code below on how to  use it

VersionTrimmer (Click to download the code)

below is what you will see

  1. ARF.docx has 2 versions as shown below

vt3

2. Select ARF.docx and click on Trim

vt1

3. It will start trimming the versions

vt2

4. No check the version history again

vt4

Please Note:

In the code function AddTrimmerIcon() is used to add the icon in the list tool bar as you see in the images. You can add your own text and image in that section.

Currently it deletes all the version. So please feel free to modify based on your requirement.

Happy SharePointing!!!

0

Display multiple lists/libraries in an accordion view


Recently i was surfing through the SharePoint store and checking out all the apps that developers made. I found this Accordion app which shows data from multiple lists. And so i thought, why not i try the same thing for my projects. Below is a concept i implemented.
I have a Custom List called as AccordionAdmin which stores the List Name and a flag to check if its a library or a list.
If its a library, i am gonna get the 5 latest documents (Title & File Url) and if its a list i am gonna get the 5 latest records and display the view from for each record.
For the accordion, i have used JQuery UI Accordion
Here is my code : MultipleListAccordion
0

Blog at WordPress.com.

Up ↑