Show/Hide Form Sections in Power Pages

(0) Share

Report

Posted on by jordanbbardwell

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&colon;

$(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:

General topics

I have the same question (0)

All responses (7)

Answers (0)

ragavanrajan 7,044 Most Valuable Professional on at

Like (0)

Report
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.

Was this reply helpful? Yes No
jordanbbardwell 6 on at

Like (0)

Report

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

Was this reply helpful? Yes No
jordanbbardwell 6 on at

Like (0)

Report

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

Was this reply helpful? Yes No
ragavanrajan 7,044 Most Valuable Professional on at

Like (1)

Report

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.

Was this reply helpful? Yes No
Community Power Pla... on at

Like (0)

Report

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

Was this reply helpful? Yes No
shakirullah12 10 on at

Like (0)

Report

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.

Was this reply helpful? Yes No
GWham1 on at

Like (1)

Report
/*********************************** ** 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();

Was this reply helpful? Yes No