Create InfoPath form programmatically using REST API / JSOM in SharePoint Online

Introduction

In this article I want to talk about how you can create InfoPath forms programmatically in SharePoint Online with the client side technologies like REST API / JSOM. Microsoft pushing developers to use client side technologies on both on premise version of SharePoint and SharePoint online. Moreover, it is the only available way to develop SharePoint solutions targeted for SharePoint online. So learning these technologies and using them in your everyday SharePoint projects makes you perfect in developing solutions based on Microsoft SharePoint online guidelines.

In this article, I will provide you a scenario based approach in order to leveraging client side technologies to programmatically create Microsoft InfoPath form in Microsoft SharePoint online.

idea

Problem Statement

It is very easy to create a new document in a document library with the help of REST API/JSOM.

There are various ways to do that and you can find them googling online.

But if we want to create a new InfoPath document in a document library programmatically, there are some gotchas! An InfoPath form is essentially a document, but it is a little bit different than the ordinary documents, as an InfoPath form can have rich features like:

  • People Picker
  • Text boxes
  • Hyperlink(s)
  • Repeating tables

Most of the times we design InfoPath form in Microsoft InfoPath designer and publish them to the InfoPath library. In this article I will demonstrate you a way to create new InfoPath forms using REST API in SharePoint online form library programmatically.

Business case: Client wants to generate salary slip for employees based on employee ID. The salary slip will be a new InfoPath file in a SharePoint online library. Employee ID is stored in an employee list. Client wants to have InfoPath form created in Form library based on Employee ID of the Employee list when created. I have reduced the complexity of the form just to focus on the concept being explained in this post.

Evaluating different solutions

There are various approaches while brainstorming :

infopath sharepoint online - 1

Approach 1: We can do this with the help of server side coding and event receivers, but these technologies require SharePoint farm solution to be installed on the server, while the environment is Office 365. So, we cannot use farm solutions on SharePoint online and Office 365!

Approach 2: We can easily create document in document library form using workflow but InfoPath forms requires XSN templates, which are not available from workflow API, so that is also not going to work in our case.

Solution

Let’s see how I have achieved this:

Using REST API, we can create/ update/ delete an item in document library but to create InfoPath form programmatically is a little tricky approach. Below is the detailed explanation on this approach:

  • Checking an existing InfoPath form in the browser, looks like below:

infopath sharepoint online- 2

  • The form is generated with the help of XML/ XSLT in the form library, looking for the same from SharePoint designer.

infopath sharepoint online- 3

The XML structure looks like below:

 

  • So, using REST API the same data as above is supposed to be created in form library. Wrote the below function on PreSaveAction() method of form to generate InfoPath using REST API.
  • Code:

Create a JavaScript function like below, which will be called on click of the button from source list. Variables will be taken from the form values:

  • Clicking on the save button of the TestListInfoPath will call above function, and the form is created in the form library.

infopath sharepoint online- 4

  • It also gets open in browser and looks like below:

infopath sharepoint online- 5 

In this blog post, I introduced a method about creating InfoPath form programmatically to use in SharePoint online libraries.

 

About

MCSE, PMP, With more than 12 years experience in Microsoft technologies.

View all posts by

10 thoughts on “Create InfoPath form programmatically using REST API / JSOM in SharePoint Online

  1. Great post, Been looking for this code for some time.

    I do run in to a problem with info path form number/ID, is there anyway to get the next form ID which is auto generated when you create the form normally? Thanks

    1. It is not safe to do that. You should consider other approaches.
      Let’s say 3 people open your InfoPath form at the same time to submit the data, all three get the same ID for the next available ID and you will run into problem.

  2. I used your code to generate a new doc in a library on SP2016 in Azure. It worked fine and dandy. However, when I open the form and then save it, I get a second copy instead of an updated document. Is there some setting I need to set in the code to note do that or what do you suggest?

  3. Ok. Duh. I figured out the problem. The file naming convention in the form didn’t match the filename in the code. I updated the code to match the form filename and now all works. Very cool!

  4. Hello again. The CSOM code works, but seems to have an async issue when I attempt to use it in a loop. If I run in debug mode, stepping through or over it, the code works like a charm. But, if I attempt to run without the breakpoint, the browser (firefox developer edition) hangs.

    Could it be that my other calls are REST and that this one is CSOM? Is there a variation of the code that would be using REST?

    1. Browser should not hang! 😀
      You can check if your loop in going into infinite loop. try doing console log for number counter for each iteration of loop. I faced the same problem in past when I accidentally wrote logic for loop going into infinite loop. Your best bet is troubleshooting via console!

  5. When I run this code (in a Content Editor Web Part on a publishing page), it works correctly. When the site owner runs it, the XML file is created properly and stored in the Form Library, but SharePoint sees it as an XML file, not an InfoPath form, and promoted fields don’t show in the default library view. No errors anywhere I could see. I don’t know where else to look.

    1. I have since discovered that this happens because the XML data has stray characters in a date field using the toLocaleDateString method, but only in IE 11. This somehow invalidates the whole file as far as SharePoint is concerned. I am working around it.

Leave a Reply