Skip to main content

Notifications

Community site session details

Community site session details

Session Id : 7GVm4nKBKddKw/7UDkyeiO
Power Pages - General Discussions
Unanswered

Show/Hide Form Sections in Power Pages

Like (0) ShareShare
ReportReport
Posted on 9 Sep 2022 19:42:51 by 6

How do you properly show/hide form sections in Power Pages?

 

I tried using a business rule and that didn't work.

 

I tried using Javascript based on a yes/no field called remote. Here is my form:

 

Screen Shot 2022-09-09 at 11.25.17 AM.png

 

Here is my Javascript:

 

$(document).ready(function () {
 $("#cr92a_remote").change(function () { FieldChanged(); });
});

FieldChanged = function(){
 var selectedValue = $("#cr92a_remote").find("input[type='radio']:checked").val();
 if(selectedValue == true){
 $("table[data-name='sec_shipping']").parent().show(); /// and .hide();
 }
 else{
 $("table[data-name='sec_shipping']").parent().hide(); /// and .hide();
 }
};

 

 

My section name is sec_shipping on the form designer.

Categories:
  • GWham1 Profile Picture
    on 21 May 2024 at 13:50:49
    Re: Show/Hide Form Sections in Power Pages

     

    /***********************************
    ** HIDE FIELDSET BY NAME
    ***********************************/
    
    // via js
    $("body").find("fieldset[aria-label='General']").hide();
    
    // via css
    fieldset[aria-label="Hidden"]{ display:none; }
    
    /***********************************
    ** HIDE SECTION BY NAME
    ***********************************/
    
    // via js
    $("body").find(".section[data-name='General']").hide();
    
    // via css
    .section[data-name="General"]{ display:none; }
    
    /***********************************
    ** HIDE ROW BY FIELD-ID
    ***********************************/
    
    // via js
    $("#fieldid").closest("tr").hide();

     

  • shakirullah12 Profile Picture
    10 on 20 May 2024 at 08:27:56
    Re: Show/Hide Form Sections in Power Pages

    Hi @ragavanrajan, If we want to hide the complete form with out any condition, Actually  i want to hide out of the box form and add a custom HTML and than stored the data from the HTML form to the actual form?

    If you could help me i will be very thankful.  

  • Community Power Platform Member Profile Picture
    on 30 Mar 2023 at 22:12:19
    Re: Show/Hide Form Sections in Power Pages

    $("table[data-name='<section name>']").parent().hide(); // show();

  • ragavanrajan Profile Picture
    7,036 Most Valuable Professional on 13 Sep 2022 at 21:26:12
    Re: Show/Hide Form Sections in Power Pages

    Hi @jordanbbardwell 

     

    Sections are part of the form. You have to get the form id and then the child section id to trigger your jquery properly. 

     


    Hope it helps. 
    ------------

    If you like this post, give it a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users to find it.

     

     

     

  • jordanbbardwell Profile Picture
    6 on 12 Sep 2022 at 14:15:15
    Re: Show/Hide Form Sections in Power Pages

    I'm not sure I follow. What does finding the form ID have to do with the section?

  • jordanbbardwell Profile Picture
    6 on 12 Sep 2022 at 14:15:12
    Re: Show/Hide Form Sections in Power Pages

    I'm not sure I follow. What does finding the form ID have to do with the section?

  • ragavanrajan Profile Picture
    7,036 Most Valuable Professional on 11 Sep 2022 at 20:30:59
    Re: Show/Hide Form Sections in Power Pages

    Hi @jordanbbardwell 

    You can use vanilla JS / Jquery to hide your sections. In addition to "document. ready", try adding the trigger for the form by finding the form id. Adding sample below.  

     

     

    $(document).ready(function () {
     $("#EntityFormControl_enityformcontrolid").on("loaded", function () {
     // your logic
     });
    });
    

     

    Please give it a try and let us know. 

     

     

    Hope it helps. 
    ------------

    If you like this post, give it a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users to find it.

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

Quick Links

Understanding Microsoft Agents - Introductory Session

Confused about how agents work across the Microsoft ecosystem? Register today!

Warren Belz – Community Spotlight

We are honored to recognize Warren Belz as our May 2025 Community…

Congratulations to the April Top 10 Community Stars!

Thanks for all your good work in the Community!

Leaderboard > Power Pages - General Discussions

#1
WarrenBelz Profile Picture

WarrenBelz 9 Most Valuable Professional

#2
Rondel Profile Picture

Rondel 6

#3
oliver.rodrigues Profile Picture

oliver.rodrigues 4 Most Valuable Professional

Overall leaderboard