SurveyMonkey/Form integrations

Integrating forms like SurveyMonkey or Microsoft Forms into Power Pages (or any web application) enables you to easily collect feedback, data, and survey responses. Both SurveyMonkey and Microsoft Forms offer APIs and embedding options, and this guide will walk you through each method step-by-step, showing you how to embed, send data, and display results on your portal.

Part 1: SurveyMonkey Integration

SurveyMonkey provides an API that allows you to access survey data, create surveys, and manage responses programmatically. Below are the steps to integrate SurveyMonkey into your web application or Power Pages portal.

Step 1: Create a SurveyMonkey Developer Account

Visit the SurveyMonkey Developer Portal at https://developer.surveymonkey.com/
Sign up for a developer account.
Create a new app to obtain your API Key. This key will allow your application to interact with SurveyMonkey’s API.

Step 2: Authenticate and Connect to the SurveyMonkey API

SurveyMonkey uses OAuth 2.0 for authentication. The process is as follows:

Obtain Access Token:
- You will need to get an OAuth access token using your client ID and secret. This can be done by sending a request to SurveyMonkey’s OAuth authorization endpoint.
Example using Postman:
- Endpoint: https://api.surveymonkey.com/oauth/authorize
- Method: GET
- Parameters:
  - client_id – Your client ID from the developer portal.
  - redirect_uri – Your application’s redirect URI.
  - response_type – Use code for authorization code flow.
Exchange Code for Access Token: After receiving the authorization code, you exchange it for an access token.

Step 3: Embed a SurveyMonkey Survey on Power Pages

Once you’ve created a survey on SurveyMonkey, go to the Collect Responses section.
Select the Embed option to get the iframe code. Example Embed Code:
<iframe src="https://www.surveymonkey.com/r/YOUR_SURVEY_ID" width="100%" height="600px" frameborder="0"></iframe>
Paste this iframe code into a HTML component on your Power Pages portal, or in your app’s page where you want the survey to appear.

Step 4: Use SurveyMonkey API to Fetch Survey Responses

To programmatically retrieve responses, you can use the SurveyMonkey API. Example API request to get survey responses:

GET https://api.surveymonkey.com/v3/surveys/YOUR_SURVEY_ID/responses
Authorization: Bearer YOUR_ACCESS_TOKEN

This API will return the responses to the survey. You can then display this data on your Power Pages by parsing and showing it as needed.

Step 5: Post Responses to SurveyMonkey via API

To send data to SurveyMonkey, you can create a custom form within your web application, collect responses, and post them using the API.

Example of posting data:

POST https://api.surveymonkey.com/v3/surveys/YOUR_SURVEY_ID/responses
Authorization: Bearer YOUR_ACCESS_TOKEN
Content-Type: application/json

{
  "pages": [
    {
      "questions": [
        {
          "id": 12345678,
          "answers": [
            {
              "text": "Yes"
            }
          ]
        }
      ]
    }
  ]
}

This will send form responses to your survey on SurveyMonkey.

Part 2: Microsoft Forms Integration

Microsoft Forms provides a simpler way to create and embed surveys directly into your Power Pages portal. It also integrates well with other Microsoft 365 tools, making it ideal for users already within that ecosystem.

Step 1: Create a Microsoft Form

Go to Microsoft Forms.
Create a new form or survey.
After creating your form, go to the Send button in the top right corner.
Choose the Embed option to get the iframe code. Example Embed Code:
<iframe src="https://forms.office.com/Pages/ResponsePage.aspx?id=YOUR_FORM_ID" width="100%" height="600px" frameborder="0"></iframe>
Paste the iframe code into your Power Pages or app to display the survey.

Step 2: Collect Responses and Display Them on Power Pages

Unlike SurveyMonkey, Microsoft Forms doesn’t have an API directly for pulling form responses to the web. However, you can use Microsoft Power Automate or Microsoft Graph API to integrate with Forms and retrieve data.

Option 1: Using Microsoft Power Automate

Create a new flow in Power Automate.
Select Microsoft Forms as the trigger.
Choose When a new response is submitted.
Add actions to collect data and send it to your Power Pages portal (e.g., store responses in SharePoint, Dataverse, or an email).

Example flow:

Trigger: When a new response is submitted
Action: Get response details from the Microsoft Form
Action: Send an email or store in SharePoint or Dataverse for later retrieval on Power Pages.

Option 2: Using Microsoft Graph API

You can use Microsoft Graph API to retrieve responses from Microsoft Forms, but it requires a few more steps. Here’s a general process:

Get the Form ID and Response ID: Use the Graph API to fetch the Form ID and Response ID.
Query Responses: Example API call to fetch the form responses:
GET https://graph.microsoft.com/v1.0/me/education/forms/{formId}/responses Authorization: Bearer YOUR_ACCESS_TOKEN
Parse and Display Data: Once you retrieve the responses, you can parse the data and display it as needed on your Power Pages or web application.

Step 3: Use Power Pages or Power Apps to Display Responses

If you use Power Automate to store form responses in Dataverse or SharePoint, you can easily create a Power Pages portal to display these responses. Power Pages allows you to use Liquid templates or fetch XML to pull and display this data dynamically.

Here’s an example using Liquid to display form responses stored in Dataverse:

{% fetchxml responses %}
<fetch top="10">
  <entity name="form_response">
    <attribute name="question" />
    <attribute name="answer" />
    <order attribute="createdon" descending="true" />
  </entity>
</fetch>
{% endfetchxml %}

<ul>
  {% for response in responses.results.entities %}
    <li>{{ response.question }}: {{ response.answer }}</li>
  {% endfor %}
</ul>

This will list the latest responses from the form in your portal.

Step 4: Collect and Analyze Data

Once you have responses stored in Dataverse, SharePoint, or another backend system, you can:

Analyze the data in Power BI for detailed insights.
Set up automated workflows in Power Automate to trigger alerts or notifications based on certain answers.
Display aggregated data and trends on your Power Pages portal.

Security and Best Practices

API Keys: Always keep your API keys and OAuth tokens secure. Never expose them in client-side code.
Rate Limits: Be mindful of API rate limits (especially with SurveyMonkey).
Data Privacy: Make sure you handle user data securely, especially if collecting sensitive information.
CORS: If using APIs directly from the client, ensure proper handling of CORS issues.

Part 1: SurveyMonkey Integration

Part 2: Microsoft Forms Integration

Leave a Reply Cancel reply