Posts

Showing posts from March, 2018

Customizing SharePoint list and implementing Quick search using jQuery

Image
How to Customize SharePoint list and implementing Quick search using jQuery 1. Create a SharePoint list and create a view for it. 2. Now choose the created view and go to modify view, under Style choose Shaded as shown below.  3. Edit the list and add script editor web part to it and paste the below code. Code:- <script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.0.min.js"></script> <style> .ms-addnew {   display: none; } input[type=button] {     background-color: #4CAF50;     border: none;     color: white;     padding: 16px 32px;     text-decoration: none;     margin: 4px 2px;     cursor: pointer; } </style> <script type="text/javascript"> $(document).ready(function(){   $("input.search").change(function() { debugger;      var txt = $("input.search").val();         if (txt)          {

3D Charts in SharePoint

Image
How to create 3D Pie Chart in SharePoint Create a Page and add Script Editor web part to it and paste the below code. Code: <style> #chartdiv {   width: 100%;   height: 500px; } </style> <script type="text/javascript" src="https://canvasjs.com/assets/script/jquery-1.11.1.min.js"></script>  <script src="https://www.amcharts.com/lib/3/amcharts.js"></script> <script src="https://www.amcharts.com/lib/3/pie.js"></script> <script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script> <link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" /> <script src="https://www.amcharts.com/lib/3/themes/light.js"></script> <script type="text/javascript"> $(document).ready(function () { GetListi

Pie Chart in SharePoint

Image
How to create Pie Chart in SharePoint Create a Page and add Script Editor web part to it and paste the below code. Code: <script type="text/javascript" src="https://canvasjs.com/assets/script/jquery-1.11.1.min.js"></script> <script type="text/javascript" src="https://canvasjs.com/assets/script/jquery.canvasjs.min.js"></script> <script type="text/javascript"> $(document).ready(function () { GetListitemsitems(); }); function GetListitemsitems() {         $.ajax({            url: _spPageContextInfo.siteAbsoluteUrl + "/_api/web/lists/GetByTitle('ProductSales')/items",             type: "GET",             headers: { "Accept": "application/json;odata=verbose" }, // return data format             success: function (data) {                console.log(data.d.results);                              var testdata=[];                          $.

SharePoint Shortcuts Url

Shortcut Urls in SharePoint 1.Add web parts to any page: /append ?PageView=Shared&ToolPaneView=2 2.Create New Site Content: /_layouts/create.aspx 3.Create New Site: /_layouts/NewsbWeb.aspx 4.List Template Gallery: /_catalogs/lt/Forms/AllItems.aspx 5.Master Page Gallery: /_catalogs/masterpage/Forms/AllItems.aspx 6.Manage your Alerts: /_layouts/SubEdit.aspx 7.Create New Alert: /_layouts/SubChoos.aspx 8.Manage Site Collection Administrators: /_layouts/mngsiteadmin.aspx 9.Manage Sites and Workspaces: /_layouts/mngsubwebs.aspx 10.Manage People: /_layouts/people.aspx 11.Manage User Permissions: /_layouts/user.aspx 12.Modify Navigation: /_layouts/AreaNavigationSettings.aspx 13.Modify Site Navigation: /_layouts/SiteNavigationSettings.aspx 14.Recycle Bin: /_layouts/AdminRecycleBin.aspx 15.Site Directory: _layouts/SiteDirectorySettings.aspx 16.Save Site as Template: /_layouts/savetmpl.aspx 17.Site Settings page: /_layouts/settings.aspx 18.Create New Web Part Page: /_layou

Start and End Date in SharePoint forms using jQuery

How to use Start and End Date in SharePoint forms using jQuery $(document).ready(function(){     $("#txtFromDate").datepicker({         numberOfMonths: 2,          dateFormat: 'dd/mm/yy',                     changeMonth: true,                     changeYear: true,         onSelect: function(selected) {           $("#txtToDate").datepicker("option","minDate", selected)         }     });     $("#txtToDate").datepicker({         numberOfMonths: 2,  dateFormat: 'dd/mm/yy',                     changeMonth: true,                     changeYear: true,         onSelect: function(selected) {            $("#txtFromDate").datepicker("option","maxDate", selected)         }     });  }); HTML:- From: <input type="text" id="txtFromDate" /> To: <input type="text" id="txtToDate" />

Generate anonymous access link to a file using REST API

How to Generate anonymous access link to a file using REST API <script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.4.min.js"></script> <script type="text/javascript">     $(document).ready(function () {         test();     }); function test() {   var ctx = SP.ClientContext.get_current();       var url = _spPageContextInfo.webAbsoluteUrl + "/_api/SP.Web.CreateAnonymousLink";                     $.ajax({               'url': url,               'method': 'POST',               'data': JSON.stringify({                  'url': _spPageContextInfo.webAbsoluteUrl + '/Migrated%20Lib/Software.docx',                  'isEditLink': true               }),               'headers': {               'accept': 'application/json;odata=verbose',               'content-type': 'application/json;

Confirm Message Pop up in SharePoint Forms

Create a Pop up before Submitting a form using jQuery <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script> <script type="text/javascript"> $(document).ready(function () {  $("#btn").click(function () {                          var bool = true;                 msg = "Are you sure want to Submit this Form?";                 bool = confirm(msg);                 if (bool == true) {                     alert("PR Canceled successfully");                 }                                      else {                     return false;                                         }                 return bool;             });  }); </script> <input type="button" id="btn" value="submit" />