0

THE CONTEXT

In the community builder I intent to create a page where inside it is a visual force page. The visual force page needs to accept two inputs.

THE PROBLEM

It seems like in the community experience builder site, the component which serves as a 'container' for a VF page accepts only one input (exactly like in my picture). I need it two accept two!

enter image description here

A POSSIBLE SOLUTION

If the VF Container doesn't accept two inputs but only one, I was thinking of passing both of my parameters in that one input, and later in the VF page parsing that input in to two different variables. I want to avoid this solution because it doesn't feel really legit.

3
  • 1
    My recommendation would be, if possible, move away from the Visualforce page entirely and replace with appropriate LWC component(s). Obviously comes down to whether you can invest in doing that, but you're more likely to have a UX that is seamless and that adapts better to the device characteristics (e.g. desktop or mobile).
    – Phil W
    Commented Jun 6, 2022 at 9:40
  • @PhilW Thank you for the answer sir. I will inform my boss of this potential solution. Do you know if adding two inputs via the VF container component is possible? Commented Jun 6, 2022 at 9:46
  • 1
    I am not aware of any such abilities when using a standard component for the embedding. An alternative is to create your own iframe-based component to embed the VF page.
    – Phil W
    Commented Jun 6, 2022 at 12:56

1 Answer 1

0

Answering my own Question:

Instead of using the VF container, as shown in the picture of the question, I decided to use an aura wrapper. The reason for this is that through the .design file of the aura component, one can specify as many inputs as one wants. Basically I created an Aura component, and inside its markup I added the VF page in an iframe element.

.cmp file

<aura:component controller="el_exportResultsPDF_aura_CONTROLLER" implements="flexipage:availableForRecordHome,forceCommunity:availableForAllPageTypes" access="global" description="exportResultsPDF Aura Wrapper">
<aura:handler name="init" value="{!this}" action="{!c.getURLPrefix}"/>    

<aura:attribute name="jsonData" type="String" access="global" />
<aura:attribute name="userId" type="String"  access="global" />

<aura:attribute name="url" type="String" />


<iframe  src="{!v.url}"></iframe></aura:component>

In this aura wrapper, jsonData and userId are my inputs. To construct a proper URL for the iframe, I used the following code:

let url='/COMMUNITYURLPATHPREFIX/apex/APEXMETHOD?jsonData='+cmp.get('v.jsonData')+'&userId='+cmp.get('v.userId');

.design file

<design:component >
<design:attribute name="jsonData" label="JSON Data" description="Data to be displayed" />
<design:attribute name="userId" label="User Id" description="The user's Id requesting for the data export" /></design:component>

NOTE

this aura component was placed in a new page in the commmunity builder.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .