Warning: count(): Parameter must be an array or an object that implements Countable in /var/www/idnet.dk/public_html/wp-includes/post-template.php on line 284

SharePoint 2013 – Add client-side People Picker to plain HTML page

After spending many hours (more than I’m willing to admit) getting the SharePoint 2013 client-side People Picker working in a plain HTML page, I’m going to document the solution here. Hoping that it will help others trying to accomplish the same.

The code example Using the client-side People Picker in a SharePoint-hosted add-in in this MSDN article (which many reference) will not work in a plain HTML page due to a couple of reasons.

  1. It’s ASP.NET code which will not be run in a plain HTML page.
  2. Some JavaScript dependencies are added automatically by ASP.NET and is therefore not shown in the example.

I found the missing JavaScript dependencies by running the example in an .aspx page and checking which scripts were being included.

To get it working, first strip the ASP.NET parts and then include all the scripts. Below I’ve also included the corev15.css file which included the needed CSS for the People Picker.

Happy coding 🙂

 

You may also like...

2 Responses

  1. Ravi says:

    Including this CSS removes scroll from page!! Any solution?

    • dcgj says:

      Hi Ravi. I have not experienced this issue when including corev15.css. I suggest to check which rules affects the body and html tags by using the developer tools in Internet Explorer, Chrome or Firefox. Hope you find a solution and if so, please do share it 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *