Custom ways to use data in Power Portals (now Microsoft Power Pages)

Sometimes in Power Portals (now Microsoft Power Pages), we need to work with data differently than what is catered by its solutions or components. There are a few ways to do this, which can give us a lot of flexibility in how we work with data.

Liquid Template Language

Liquid is a template language that is used in Power Pages to generate dynamic content. It can be used to perform various operations on data, such as iterations, variables, and conditional statements.

One way to use Liquid to work with data is to use FetchXML queries to retrieve data from Dataverse. FetchXML is a query language that is used to retrieve data from Dataverse tables. Once you have retrieved the data, you can use Liquid to perform various operations on it, such as:

• Displaying the data in a list or table
• Filtering the data based on certain criteria
• Performing calculations on the data
• Creating conditional statements to display different content based on the data

JavaScript

Power Pages also provides full access to JavaScript, which can be used to work with data in a variety of ways. For example, you can use JavaScript to:

• Fetch data from Dataverse or other external sources
• Perform complex operations on data
• Create interactive user interfaces

One way to use JavaScript to work with data is to use the Power Pages FetchXML API to retrieve data from Dataverse. You can then use JavaScript to perform various operations on the data, such as:

• Storing the data in variables, arrays, or objects
• Filtering the data based on certain criteria
• Performing calculations on the data
• Creating and displaying charts and graphs

Example

Here is an example of how to use Liquid and JavaScript to work with data in Power Pages:

Code snippet

{% assign data = fetchxml.query('account', 'name, address1_city') %}

{% for record in data %}

<h1>{{ record.name }}</h1>

<p>{{ record.address1_city }}</p>

{% endfor %}

This Liquid code will retrieve all accounts from Dataverse and display their names and cities in a list.

Here is an example of how to use JavaScript to work with the same data:

JavaScript

var data = fetchxml.query('account', 'name, address1_city');

// Store the data in an array

var accounts = [];

for (var i = 0; i < data.length; i++) {

accounts.push(data[i]);

}

// Filter the data to only include accounts from the United States

var usAccounts = accounts.filter(function(account) {

return account.address1_country === 'United States';

});

// Create a table to display the data

var table = document.createElement('table');

table.border = 1;

// Create a header row

var headerRow = document.createElement('tr');

headerRow.appendChild(document.createElement('th')).innerHTML = 'Name';

headerRow.appendChild(document.createElement('th')).innerHTML = 'City';

table.appendChild(headerRow);

// Add a row for each account

for (var i = 0; i < usAccounts.length; i++) {

var row = document.createElement('tr');

var nameCell = document.createElement('td');

nameCell.innerHTML = usAccounts[i].name;

row.appendChild(nameCell);

var cityCell = document.createElement('td');

cityCell.innerHTML = usAccounts[i].address1_city;

row.appendChild(cityCell);

table.appendChild(row);

}

// Add the table to the document body

document.body.appendChild(table);

This JavaScript code will retrieve the same data as the Liquid code, but it will then filter the data to only include accounts from the United States. It will then create a table to display the data in a more user-friendly format.

Conclusion

Liquid and JavaScript are powerful tools that can be used to work with data in Power Pages in a variety of ways. By using these tools, you can create more dynamic and interactive websites and applications.

Imperium Dynamics offers a comprehensive range of consultancy services for Microsoft Power Pages. We can help you with all aspects of Power Pages implementation and customization, including data integration, data manipulation, and data visualization.

If you need help working with data in Power Pages, Imperium Dynamics can help. Contact us today to learn more about our services.

Join us next time, as we continue our journey of learning canvas apps.Click here to learn more about Imperium's Power Apps Services. We hope this information was useful, and we look forward to sharing more insights into the Power Platform world.

---