1

I seem to be far outside my element here with this HTML/VF balance I'm trying to strike. I am having multiple problems and at this point, and am really banging my head against a wall.

I have subsections of an several html table rows that I would like to conditionally render. Allow me to walk you through the difficulties I've had as context for my current code.

I had originally wrapped up some td elements inside an outputpanel with conditional rendering. Problem is, the output is super wacky when the panel is rendered. I then learned that layout="none" is the ticket to not imposing additional tags that can cause this issue. However, I quickly learned that the render conditions were no longer being honored after making this change, come to find a blog that says layout="none" and conditional rendering do not play nicely. Okay, well darn.

So ... I decided to add conditional rendering to each child element instead as a workaround (inside each td is an apex:* component where this could be applied). This worked for both of the inputField components, but for some reason the outputText component would not rerender unless I gave it an id (not that I had to reference it anywhere, strange...), so I did, and all seemed to rerender properly.

However, now my inputs in the inputFields are not being passed to the controller for some reason, and when I go to save I receive some validation errors that stem from the fields being null (which they shouldn't be...). At this phase I feel I just need help. Here is a snippet from my current build:

<tr styleClass="standardLook">
    <td style="text-align:right"><apex:outputLabel value="Sunday" styleClass="standardLook"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>
        <apex:actionRegion >
            <apex:selectList value="{!ds.Sun__c}" size="1">
                <apex:selectOptions value="{!dayOptions}"/>
                <apex:actionSupport event="onchange" rerender="sunRow"/>
            </apex:selectList>
        </apex:actionRegion>
    </td>
    <apex:outputPanel id="sunRow" layout="none">
        <td style="text-align:center"><apex:inputField rendered="{!ds.Sun__c == 'Select Hours'}" value="{!ds.SunStart__c}" style="width:50px; text-align:center" html-placeholder=" - - : - - "/></td>
        <td style="text-align:center"><apex:outputText rendered="{!ds.Sun__c == 'Select Hours'}" id="text1" style="width:20px; font-size:13px; color:black; padding-right:4px" value="to"/></td>
        <td style="text-align:center"><apex:inputField rendered="{!ds.Sun__c == 'Select Hours'}" value="{!ds.SunEnd__c}" style="width:50px; text-align:center" html-placeholder=" - - : - - "/></td>
    </apex:outputPanel>
</tr>

I am not married to any of my methods - I've only been trying to get through, and some of this may be quick and dirty. Any feedback you can provide for how to clean this up and follow any best practices is greatly appreciated. Here are my questions:

  1. Why can't I conditionally rerender an outputPanel with layout="none"?

  2. Why does my apex:outputText not rerender unless it has an id while inside an outputPanel with layout="none"?

  3. Why is my user input to the apex:inputFields not being passed to the controller when rerendering the outputPanel where layout="none"? (When I remove the layout attribute, or instead rerender the outputPanel that wraps the entire table, the inputs are successfully passed)

UPDATE: I'm taking Lance Shi's advice and re-working this using apex:variable to wrap these td components. Though this section will not rerender on selectlist change as expected. It will rerender when I rerender the outputpanel surrounding the tr tags, but this is not desired.

<tr styleClass="standardLook">
    <td style="text-align:right"><apex:outputLabel value="Sunday" styleClass="standardLook"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>
        <apex:actionRegion >
            <apex:selectList value="{!ds.Sun__c}" size="1">
                <apex:selectOptions value="{!dayOptions}"/>
                <apex:actionSupport event="onchange" rerender="sunRow"/>
            </apex:selectList>
        </apex:actionRegion >
    </td>
    <apex:variable id="sunRow" var="s" value="s" rendered="{!ds.Sun__c == 'Select Hours'}">
        <td style="text-align:center"><apex:inputField value="{!ds.SunStart__c}" style="width:50px; text-align:center" html-placeholder="- - : - -"/></td>
        <td style="text-align:center"><apex:outputText id="text1" style="width:20px; font-size:13px; color:black; padding-right:4px" value="to"/></td>
        <td style="text-align:center"><apex:inputField value="{!ds.SunEnd__c}" style="width:50px; text-align:center" html-placeholder="- - : - -"/></td>
    </apex:variable>
</tr>
1
  • it looks like you are falling afoul of this issue -- bobbuzzard.blogspot.com/2011/02/…. An outputPanel that doesn't initially render is invisible to VF for rerendering. You need to surround it with an outputPanel that is always rendered and rerender that; the inner outputPanel has the conditional rendering
    – cropredy
    Dec 17, 2016 at 1:29

1 Answer 1

0

If I understand correctly, you are using <apex:outputPanel> only for rendering.

If that is the case...

Use the following code:

<apex:variable var="foo" value="foo" rendered="{!(YOUR_ATTRIBUTE)}">
    <td></td>
</apex:variable>

Works far better than outputPanel.

8
  • I tried replacing the outputPanel with a variable as you described, but the components won't render at all now :-/ (also I gave the variable the same Id "sunRow") Dec 16, 2016 at 22:06
  • @BrentThomas It shouldn't. We have used it for many pages now. Are you sure the variable you passed is correct?
    – Lance Shi
    Dec 16, 2016 at 22:07
  • perhaps I'm doing something wrong. Here's what I have now: <apex:variable id="sunRow" var="foo" value="foo" > <td> (removed for space purposes, same as above) </td> </apex:variable> You mentioned the variable I passed. What exactly do you mean? Does it have something to do with the two foo values? I'm not sure I grasp their significance... Dec 16, 2016 at 23:40
  • could you provide some sample code for this use case? Dec 17, 2016 at 0:03
  • @BrentThomas You don't have a rendered= attribute in the code you have provided in your question's code. So I am not exactly sure what you mean here. It has nothing to do with those two foo variables though
    – Lance Shi
    Dec 17, 2016 at 0:36

You must log in to answer this question.

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