Saturday, February 24, 2018

JQuery Autocomplete in SharePoint using REST

JQuery Autocomplete in SharePoint using REST.
1. Create a SharePoint 'Employee' List
2. Create a script file and save in site assets
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "">
<html xmlns="">
<title>Auto Populate Demo</title>
<link rel="stylesheet" href=""/>
<script type="text/javascript" src=""></script>
<script type="text/javascript" src=""></script>
<style type="text/css">
* html .ui-autocomplete {
    height: 200px !important;
<script type="text/javascript">
$(document).ready(function () {
    console.log("on document ready");
function AutoPopulateEmployee() {
        source: function( request, response ) {
                url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/GetByTitle('Employees')/items?$filter=substringof('"+request.term+"',Title)&$top=100&$select=Title,Address"
                type: "GET",
                    Accept: "application/json;odata=verbose" 
                async: false,
                cache: false,
                beforeSend: function(){     
                success: function (data, status, xhr) {
                    arrayEmployee = [];
                    for(i =0; i<data.d.results.length; i++) {         
                        arrayEmployee.push(data.d.results[i]["Title"] + ", " + data.d.results[i]["Address"]);               
                error: function (xhr, status, error) {                      
                    console.log("error: "+ xhr.responseText); 
                complete: function(){
          minLength: 2
Select Employee: <input type="text" id="txtEmployee"></input>

 Save the above code in Site Assets.
3. Add content editor webpart in a page and refer above script url.
4. Test the code.


  1. hi we are getting autocomplete is not function erorr

  2. Took me time to read all the comments, but I really enjoyed the article. It proved to be Very helpful to me and I am sure to all the commenters here! It’s always nice when you can not only be informed, but also entertained!


Featured Post

Azure Scripts

 Azure Scripts: Azure > Storage account > File shares > SMB File share To connect to this Azure file share from Windows, run the Po...

Popular posts