Posts

Showing posts with the label Power Apps

Part 3: Building Code Apps with SharePoint Online Integration

Image
 Step1 : Add the SharePoint Online list connection to your Code App using the following command: pac code add-data-source -a <connection name> -c <API ID> -d <SharePoint Site(encoded)> -t <list id> The process of retrieving the connection name and API ID has already been explained in Part 1 and Part 2 of the blog. Please refer to those sections if you are not familiar with how to obtain them. For the SharePoint site , you must provide the encoded URL . The required format is double URL encoding (also known as percent-encoding applied twice). How it works Normal characters in a URL are encoded once using percent-encoding (RFC 3986) : : → %3A / → %2F If you encode that result again , the % character itself becomes %25 : %3A → %253A %2F → %252F So: https: // → https% 3 A% 2 F%2F (once encoded) https% 3 A% 2 F%2F → https%253A%252F%252F In simple terms, you need to encode the SharePoint site URL twice. First, encode the Sha...

Part 2: Building Power Apps Code Apps – Adding Office 365 Users Connection

Image
Please refer to the following blog for a step-by-step guide on creating Code Apps :  https://mspowerplatformtips.blogspot.com/2025/08/creating-code-apps-in-power-apps-step.html Setting up connection to connector for code apps. Create and set up connections in Maker Portal  You will need to start by creating and configuring connections at https://make.powerapps.com and you’ll need to copy connection metadata from there for use in later steps. 1. Launch the Maker Portal Connections page Go to  https://make.powerapps.com  and navigate to the Connections page from the left-hand navigation. 2. Create an Office 365 Users connection Click “+ New connection” and select Office 365 Users. Click “Create”. Then open the connection in Url you can see connection ID Get connection metadata for all created connections  You can use the Power Apps CLI to list your available connections and retrieve their IDs: pac connection list This command will display a table of all your ...

Power Apps SharePoint Pagination: Load 500 Records at a Time Using Index_Id

When working with large SharePoint lists in Power Apps, you may hit the delegation limit if you try to load more than 2,000 records at once. To build an efficient app that scales beyond this, we can use a custom pagination technique — loading data 500 records at a time using a numeric Index_Id column. In this post, I’ll walk you through a fully working solution that loads SharePoint list items in chunks, supports “Next” and “Previous” buttons, and avoids delegation issues by leveraging indexed fields.

Steps to Embed a HTML Page in a Model-Driven App Form

Image
 Step 1: Upload the HTML file as a Web Resource Open your solution, then click on + New and select Web Resource. Add your HTML code. Set the File Type to 'Webpage (HTML)', provide a Name and Display Name, then click Save. HTML CODE: <!DOCTYPE html> <html> <head>     <title>Account Info</title>     <meta charset="utf-8" />     <script src="ClientGlobalContext.js.aspx" type="text/javascript"></script>     <style>         body {             font-family: "Segoe UI", sans-serif;             padding: 20px;         }     </style> </head> <body>     <h2>Account Information</h2>     <p> <strong>Record Id:</strong> <span id="id">Loading...</span><br/> <strong>Entity Name:</strong> <span...

Steps to Embed a Canvas App Page in a Model-Driven App Form

Image
Step 1: Go to your solution and create a Canvas App page . Refer to the image below for guidance. Step 2: The Canvas App page will open in Power Apps Studio. In the OnStart property of the app, add the following code: Set ( a , Param ( "recordId" )) ;       // Returns the record ID Set ( b , Param ( "entityName" )) ; Next, insert a Label control and set its Text property to: "a: " & a & "" & Char ( 10 ) & " b: " & b & "" & Char ( 10 ) This will display the values of the parameters passed from the model-driven app. Finally, give your custom page a name and publish it. Step 3: Add the custom page to your Model-Driven App by editing the app in the App Designer. Refer to the image below for detailed steps. Then, select the custom page you added and uncheck the "Show in navigation" option. This ensures the page doesn't appear in the app’s left-hand navigation but can still be open...

Supercharge Your Power Apps Look with SVG

Image
 What is SVG? SVG (Scalable Vector Graphics) is an XML-based vector image format for two-dimensional graphics. Unlike raster images (like PNG or JPG), SVGs don’t lose quality when scaled , making them perfect for responsive and sharp UI designs. Key Benefits of SVG: Scalable without losing quality. Lightweight compared to image files. Customizable using CSS or inline styles. Supports interactivity and animations. Ideal for icons, shapes, progress indicators, graphs, etc. How to Use SVG in Power Apps – Step by Step Step 1: Get Your SVG Code You can get SVG code from: https://www.svgrepo.com/ https://fonts.google.com/icons Or export from tools like Figma, Adobe Illustrator etc Or you can use Microsoft Copilot or ChatGPT to create the SVG's for example just give prompt as give SVG code for progress bar Step 2: Convert SVG to a Data URI (if needed) Power Apps doesn’t support raw <svg> tags directly. Convert it to data URI format...