Skip to main content

Notifications

Announcements

Welcome to the Power Platform Communities
Check out the New Agent Creator Community
News and Announcements icon
Community site session details

Community site session details

Session Id :
Power Platform Community / Forums / Power Pages - Customize & Extend / Button in power pages ...
Power Pages - Customize & Extend
Answered

Button in power pages dataverse list

(0) ShareShare
ReportReport
Posted on by ZackS 112
I am in the process of moving our internal ticket system to power pages and I want to add a button in each row that's essentially "open ticket". I just need help figuring out how to get a button added to the list then I can run with this.
Categories:
Portals
  • Verified answer
    ZackS Profile Picture
    ZackS 112 on at
    Button in power pages dataverse list
    I figured out how to do it in JavaScript, I adjusted it to work for everyone here
     
    document.addEventListener("DOMContentLoaded", function () {
        const listInterval = setInterval(() => {
            const tableBody = document.querySelector(".view-grid table tbody");
     
            if (tableBody) {
                clearInterval(listInterval);
     
                //find all the rows
                const rows = tableBody.querySelectorAll("tr");
     
                rows.forEach(row => {
                    //find the column to put the button
                    const pickUpTicketCell = row.querySelector('td[data-th="Pick up ticket"]');
     
                    if (pickUpTicketCell) {
                        //to prevent dupped buttons
                        if (!pickUpTicketCell.querySelector("button")) {
                            //create the button
                            const button = document.createElement("button");
                            button.innerText = "Pick Up Ticket";
                            button.style.margin = "5px"; //style
                           
                            //click event
                            button.addEventListener("click", function () {
                                const ticketId = row.dataset.id;
                                alert(`Pop up message, row ID: ${ticketId}`);
                           
                            });
     
                   
                            pickUpTicketCell.appendChild(button);
                        }
                    }
                });
     
                console.log("Buttons added successfully.");
            }
        }, 500);
    });
  • Suggested answer
    oliver.rodrigues Profile Picture
    oliver.rodrigues 9,331 Most Valuable Professional on at
    Button in power pages dataverse list
    Hi, you can achieve this by using the OOB List + Basic Forms from Power Pages.
     
    How far did you get with your list configuration? 
     
  • ZackS Profile Picture
    ZackS 112 on at
    Button in power pages dataverse list
    More context:
     
    I've tried to use javascript, css, and html but I can't seem to figure it out.

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

News and Announcements

Welcome to the Power Platform Communities
Check out the New Agent Creator Community

Quick Links

Paul Stork – Community Spotlight

We are honored to recognize Paul Stork as our July 2025 Community…

Congratulations to the June Top 10 Community Leaders!

These are the community rock stars!

Announcing the Engage with the Community forum!

This forum is your space to connect, share, and grow!

Leaderboard > Power Pages

#1
Lucas001 Profile Picture

Lucas001 60 Super User 2025 Season 1

#2
Fubar Profile Picture

Fubar 55 Super User 2025 Season 1

#3
surya narayanan Profile Picture

surya narayanan 35

Last month Overall leaderboard

Featured topics

Product updates

Microsoft Power Platform Community release plans