Skip to main content

Notifications

Announcements

Welcome to the Power Platform Communities
Announcing Category Subscriptions!
News and Announcements icon
Power Platform Community / Forums / Power Pages - Customize & Extend / Hide row in List on Po...
Power Pages - Customize & Extend
Suggested answer

Hide row in List on Portals with Javascript

(1) ShareShare
ReportReport
Posted on by robertsapps 4

Trying to hide all rows in this service list where the application id (Lookup field) for service does not match the application id for that application.

 

I'm pretty sure this can be done in JavaScript, but I am not sure how to go about that.

robertsapps_0-1683237503257.png

robertsapps_1-1683237612585.png

 

So basically I would want to check if the Application column for each row matches the 

{{ request.params.id }}

 

Thanks in advance!

Categories:
Portals
  • Suggested answer
    oliver.rodrigues Profile Picture
    oliver.rodrigues 8,962 on at
    Hide row in List on Portals with Javascript
    I can help with the JS code, not a problem, but my first question here is:
    • is this a list or a subgrid?
    • is the other Applications for the same Contact/User or is it displaying Services for applications from all users? 
  • Suggested answer
    SaiRT14 Profile Picture
    SaiRT14 1,549 on at
    Hide row in List on Portals with Javascript
    pls try the following:
    document.addEventListener("DOMContentLoaded", function() {
        // Define the target Application ID you want to match
        const targetApplicationId = "12345"; // Replace with the specific Application ID you want to match
        // Get all rows in the service list table
        const serviceListTable = document.getElementById("serviceListTable"); // Replace with actual table ID or selector
        const rows = serviceListTable.getElementsByTagName("tr");
        // Iterate over each row, starting from index 1 to skip the header
        for (let i = 1; i < rows.length; i++) {
            const applicationIdCell = rows[i].querySelector(".applicationIdCell"); // Replace with the actual class or selector for the Application ID cell
            if (applicationIdCell) {
                const applicationId = applicationIdCell.textContent || applicationIdCell.innerText;
                
                // Hide the row if the Application ID does not match the target ID
                if (applicationId.trim() !== targetApplicationId) {
                    rows[i].style.display = "none";
                }
            }
        }
    });
     
  • CU11111813-1 Profile Picture
    CU11111813-1 10 on at
    Hide row in List on Portals with Javascript
    Something like this should work:  
    $("#my-table td.field/cell:not(:equals('{{ request.params.id }}'))").parent().hide();
    You will have to figure out what the selector is for your markup.
    A better way is to filter the table before so you don't have to write this jquery. This may already work without additional filtering if you configured the view/grid properly in crm
     
  • ZackS Profile Picture
    ZackS 74 on at
    Hide row in List on Portals with Javascript
    Same question here, any answers from microsoft yet?

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
Announcing Category Subscriptions!

Quick Links

November 2024 Newsletter…

November 2024 Community Newsletter…

Community Update Oct 28…

Power Platform Community Update…

Tuesday Tip #9 Get Recognized…

Welcome to a brand new series, Tuesday Tips…

more Community News

Leaderboard

#1
WarrenBelz Profile Picture

WarrenBelz 144,215

#2
RandyHayes Profile Picture

RandyHayes 76,308

#3
Pstork1 Profile Picture

Pstork1 64,290

Leaderboard

Featured topics

Product updates

Microsoft Power Platform Community release plans