Posts

Showing posts from September, 2016

Get Login Name and Display Name by User ID using SharePoint 2013 REST API

We can pass the user id to the below function & we can get the user name. function getUser(id){ var returnValue;   jQuery.ajax({    url: "http://YourSite/_api/Web/GetUserById(" + id + ")",    type: "GET",    headers: { "Accept": "application/json;odata=verbose" },    success: function(data) {            var dataResults = data.d;       //get login name       var loginName  = dataResults.LoginName.split('|')[1];       alert(loginName);         //get display name       alert(dataResults.Title);    }  }); } Please refer this link for more details  Link1

Auto Complete Textbox in Jquery

Image
HTML & Jquery code: <html> <head>                 <script src=" https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js "></script>                 <script src=" https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js "></script>                 <link href=" https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/smoothness/jquery-ui.min.css " rel="stylesheet"/>                 <script>                 $(document).ready(function(){                                 var carName = new Array();                                 carName.push("Volvo");                                 carName.push("Saab");                                 carName.push("Mercedes");                                 carName.push("Audi");                                 $('#txtName').autocomplete({source :carName});

Ajax Loader

Image
To display loading symbol while ajax call, you can use the below code. Content Editor Code: <link href=" https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css " rel="stylesheet"/> <script src=" https://code.jquery.com/jquery-1.10.2.js "></script> <script src=" https://code.jquery.com/ui/1.10.4/jquery-ui.js "></script> <link href="/sites/<sitename>/SiteAssets/CSS/Style.css" rel="stylesheet" type="text/css"/> <script src=" /sites/<sitename> /SiteAssets/Scripts/Test.js"></script>   <div class="modal" id="modalDiv">&#160;</div> Style.css Code: .modal {     display:    none;     position:   fixed;     z-index:    1000;     top:        0;     left:       0;     height:     100%;     width:      100%;     background: rgba( 255, 255, 255, .8 )         url(' /si

jquery popup window Example

Image
Save the below code as a html file & open with IE or any browser. HTML & Jquery Code: <html>                 <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>          <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script> <link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/smoothness/jquery-ui.min.css" rel="stylesheet"/>  <link rel="stylesheet" href="https://cdn.datatables.net/1.10.10/css/jquery.dataTables.min.css"/> <script type="text/javascript" src="https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js"></script> <script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <script&

jquery.dataTables Example

Image
Save the below code as a html file & open with IE or any browser. HTML & JS Code To use this Jquery datatable we need to use <thead> and <tbody> tags & number of <td> columns also should be same in thead and tbody tags. <html>      <head>        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>        <!--        <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>      <link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/smoothness/jquery-ui.min.css" rel="stylesheet"/> -->        <link rel="stylesheet" href="https://cdn.datatables.net/1.10.10/css/jquery.dataTables.min.css"/>          <script type="text/javascript" src="https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js"></script>  

PeoplePicker get & Update List item using Rest API in SharePoint 2013

Image
When you try to create/update list item just check the fields details of the list using the REST API. for an example I have created a List named  TestList . Following is the field details: Title:  Text TestColumn1:  Text Text Column 2:  Text Test Column 3:  People and Group Now to check the field details and check the details of the fields using the following REST API URL: http : //SITEURL/_vti_bin/client.svc/web/lists/getByTitle('TestList')/items Now you will get following data in IE Or Chrome:  Find your column name from the XML page. Now check the above picture carefully, the userid needs to be saved in the  TestColumn3Id  column not in the  TestColumn3 . Now check the following code: Go To  SiteAssets and add   RestPeoplePicke .js  Open any page & Insert content editor webpart. Include the below code in Content Editor. //Code for content editor: <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js&quo