Data-aware AI chat in Power Pages: Build an agent from a form (Preview)

This blog post shows how to add a data-aware AI chat in Power Pages by building an agent from a form and setting up the new Forms Agent experience with Power Pages.

What is new? We have had the ability to enable a Copilot Studio chat experience on Power Pages for a while. This has been the evolution of Power Virtual Agents, and can answer information about the content on your site.

So what is new?

You can now also add an agent to a form on your page that will automatically know the data model related to the form and allow the users to interact with this data. The example given by Microsoft is to create a case, for instance. When adding the Agent on the form, the chatbot on the page will be able to guide the user through creating a case using the chat experience, instead of using the form!

You find the documentation from Microsoft here:

https://learn.microsoft.com/en-us/power-pages/getting-started/build-agent-from-form

Why is this exciting?

When we add AI features to our user experiences, we need to make sure we are also keeping the “backwards capabilities” for the users who still don’t want to or cannot use these new AI features. We are still a good way away from it being so mainstream with AI chats for interacting with data that we can allow ourselves to abandon the “forms over data” approach. For the time being, we need to offer both experiences to our users, and this new feature does exactly that!

So – no more waiting! Enable agent experiences on all the forms on your site today!

How, you say? Let me show you how 👇

Turn on Copilot Features

An admin needs to turn on the agent features in Copilot Hub. Check the docks on Copilot Hub for Power Pages (preview) for how to: https://learn.microsoft.com/en-us/power-pages/admin/copilot-hub

Open PPAC (Power Platform Admin Center), open the Copilot Workspace and “Power Pages” in the left menu. Click the “Review” button for the Settings card.

Scroll down to the Power Pages settings at the bottom of the page.

For this particular feature, make sure you have the “AI form fill assistance in Power Pages” feature enabled for the environment and site you are working with.

This set you up to use Copilot and Agent features for your site in your environment, and you are ready to start configuring your site.

Add Agent to site

To access the Agent we are going to add to the form, you need to go through the normal Agent Chat experience. Our Form Agent will simply be a “Model” or “Mode” that is available in addition to the General Agent on your site.

So – before you can add an agent to a form we first need to add the General Agent to our site.

Navigate to Power Pages studio and edit your site. Open the “Setup Up” workspace and “Add agent” form the left menu.

Toggle the “Create agent” to enable the creation of the site agent in the background. This might take a few minutes.

You can customize the agent in Copilot Studio later, and to read more about the capabilities and setup, check out the documentation here;

https://learn.microsoft.com/en-us/power-pages/getting-started/enable-agent?WT.mc_id=powerportals_inproduct_portalstudio2

Once the agent is ready, you can test it and then enable the agent on your site by enabling the “Enable agent on site” option.

I highly recommend testing your agent, refining your data, and making sure you are familiar with agent analytics before you make it available. Also, make sure you understand the licensing implications this can have. (Diving into that is for another blogpost and another day).

Add an Agent to you Form

Finally to the grand finally: Adding an Agent to our form.

Back in the Design Studio, open the Pages workspace and open the page where you have your form. My site is an event site, and I chose to add the agent to the registration form.

I use the maker copilot to add my form, and make sure I add the necessary permissions to enable anonymous users to create the registration table record. This will make the studio kick and scream to the end of time – and no, there is no way to silence the whimpering that you have enabled anonymous access to your data ;D

When you have the page open with the form you will notice an “Agent” button. Click it to configure your agent experience.

Give the agent a descriptive purpose (instructions) and then provide an intuitive name for your agent. The name will be visible to your end users.

At this point it stopped working for me. I got an error in the modal when trying to configure the agent. I found both agents in Copilot Studio, but one of them was working at there was errors all over the place. I got some help from friends and did a few adjustments.

This is what I learned:

Use US Early Access Sandbox Environment
This meant that I had to set up a new environment 🙄

So – I used the Power Pages Copilot to create a new Event site, followed my own blog post, and set this site up to this point 😅

Your Power Pages site needs to be “Public” (not private)

Right – Now let’s get back on track and try again..

Add Agent to Form again..

Form Description

Enable all users to register for the event



This worked a lot better!

Agent Details

Security

Clicking “Continue” moves us to the “Security” tab and allow us to set authentication and web role for this experience. For this scenario, we will enable anonymous access – but make sure to be mindful of how to set the security correctly.

Scroll down and enable Web API for these tables and columns:

Review and Confirm

We can click the link to test our agent in Copilot Studio while we wait for it to be ready on the form.

These two agents have been automatically created during this process.

  • EventHub bot is the “parent” agent that was created when we enabled the site copilot
  • Event Registration Agent is the form agent that specializes in event registration

Testing our agent

Close the modal when the agent is published, and then preview your site.

If your form doesn't show up the first time, go back and configure your form again. Don't ask me how I know 😜

When publishing this agent, it tells me explicitly that it’s not a fan of it being available for unauthenticated users:

I continue to Publish the agent, and then click the link to open the agent in Copilot Studio.

Let’s be honest – it didn’t work on the first attemt

Nope.

I had to start over a few times. Delete the agent, delete the form and start over.

I used AI to improve the instruction to make sure the agent only attempts to create records and to be more specific to the internal names for the table and columns to make sure it ends up in the right place.

This is the instruction I ended up with:

Create an agent that enables users to register for an event by creating a new record in the Dataverse table "Copilot Event Registration" (logical name: cr024_anonymouseventregistrationc479). The agent should only support the **Create** operation and must not offer Read, Update, or Delete functionality.

When triggered, the agent should prompt the user to provide the following information:
- Name (cr024_name)
- Email (cr024_email)
- Company (cr024_company)
- Allergies (cr024_allergies)
- Topics (cr024_topics)
- Interests (cr024_interests)

Use the topic mapping: **Copilot Anonymous Event Registration c479 → Enable all users to register for the event**.

Interaction rules:
- Prompt the user for each field one at a time in a natural and conversational tone.
- Do not validate inputs.
- Do not ask for raw JSON strings or filter queries.
- Once all fields are collected, create a new record in the Dataverse table using the provided values.Code language: JavaScript (javascript)

Then I decided to add a connection to Dataverse and the event registration table as a tool for the agent to use. A few trials and errors and tests later and it finally worked.

Check the Web API Site settings in the Power Pages Management App and open up only the columns that you are exploring in your form.

End result

When the agent is published you can preview your site and try the agent.

BUT – where is it?

I looked for an interaction item close to the form or an indication that there was an interactive element here, but there isn’t – YET!

You have to

  1. Click the “BOT”-icon at the bottom right corner (yes, the one you think is an old and not so intelligent Power Virtual Agent bot)
  2. Understand that clicking the waffle icon reveals more agents than the primary agent
  3. THEN choose the Agent you want to try. This is why the naming of the agent is super important!

This is not a good user experience, and I am # superDisappointed at this point! But – this is what the “Preview” tag means – it is not fully baked. I fully expect that by the time this functionality is ready for production use, this experience will be much more intuitive.

Hope this was helpful.

What scenarios do you see for this functionality?

Have fun building!

The feature image is created using Microsoft 365 Copilot using this prompt:

want to see a realistic photograph from a street corner somewhere in the nordics in summer time. There is a young man, a bit colorful and edgy (not corporate) who is stilling a young woman to ask her to sign up for something. He is holding a clip board and is filling our the form for her. This illustration is to be used as a feature image for a blog post that I am creating about AI Agent Form Filling in Power Pages

I know.. I’m as surprised as you are 😮

Get new blog posts right to your inbox

Ulrikke Akerbæk Written by:

User Experience through digital interfaces, interaction, branding and visual design has been her passion and focus since she created her first website at age 14. She is a solution architect for Power Platform, specializing in Power Apps Portals. She is a Business Applications MVP and was named one of the top 50 women in tech in Norway in 2022. Currently working as Low Code Practice Lead at Itera.

Be First to Comment

Leave a Reply

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