9

I'm working on the following problem; I have an <apex:repeat> element which contains a <tr>. In some cells of the row I have an <apex:outputPanel> element. If the page is rendered this results in a table with multiple rows. In each row some of the columns contain an outputPanel. Is there a way to rerender a single row's outputPanel? Or as an alternative; rerender a single row from the repeater? In my current solution every outputPanel is rerendered, but I get some quirky results.

My VF code looks like this:

<table>
    <tr>
        <th></th>
        <th>Name</th>
        <th>Added</th>
    </tr>
    <apex:repeat value={!people} var="person">
        <tr>
            <td><apex:inputCheckbox value="{!person.added}" onchange="addOrRemove('{!person.Id}'); /></td>
            <td>{!person.Name}</td>
            <td><apex:outputPanel id="personAddedPanel" rendered={!person.added}>Yes</apex:outputPanel></td>
        </tr>
    </apex:repeat>
</table>

<apex:actionFunction name="addOrRemove" action="{!addOrRemove}" rerender="personAddedPanel">
    <apex:param name="firstParam" assignTo="{!curPersonId}" value="" />
</apex:actionFunction>

the addOrRemove is an actionFunction that toggles the added boolean on the person and after that rerenders the outputPanel personAddedPanel.

4
  • Lex I see a lot of corrections in the VF tags in the inputcheckbox the <td> needs to have matching </td> also there are places "" have not been used for value. Leaving all that aside where is the addOrRemove Jscript for this page? Are you using a static resource and using it in the page/ have a script embedded in the page?
    – Rao
    Mar 29 '13 at 16:20
  • Thanks for your comment. The piece of code is a simplified version I typed up for this question, so there could be some mistakes, I have added the actionFunction
    – rael_kid
    Mar 29 '13 at 16:44
  • @PhilR Thanks. My actual page is a lot more complicated, outputText will not do for that unfortunately.
    – rael_kid
    Mar 29 '13 at 17:25
  • Isn't the main problem the fact you have an id (personAddedPanel) that is no longer unique because it's being repeated for each person? Have you tried making the id unique and therefore specifically rerendering the id you want?
    – Nick Cook
    Jul 2 '13 at 13:07
4

Visualforce generates unique DOM ids and, in your case, a different one for each row in the repeat. The ActionFunction (outside the repeat) does not know which row id to rerender.

Try using an apex:ActionSupport from within the apex:inputCheckbox. Called from here (within the loop), rerender will work correctly.

0

The primary issue appears to be with where you've located your repeat code. You also had an unclosed tag which I've noted in the code below. Try this, it should keep everything within the same table row:

<table>
<tr>
    <th></th>
    <th>Name</th>
    <th>Added</th>
</tr>

    <tr>
     <apex:repeat value={!people} var="person">
        <td><apex:inputCheckbox value="{!person.added}" onchange="addOrRemove('{!person.Id}'); /></td>// <-- This TD wasn't closed
        <td>{!person.Name}</td>
        <td><apex:outputPanel id="personAddedPanel" rendered={!person.added}>Yes</apex:outputPanel></td>
    </apex:repeat>
    </tr>

Your rerender problems may be related to not having specified a percentage of space or width in pixels for each column. If you know how wide the outputPanel is, then adding a width= "xxpx", plus some room for border space, might solve some of your problems. Right now, the browser is free to choose how to allocate how much real estate to give each column. If you tell it to give a certain percentage of space to each one (you can vary it as the checkbox will be small), that in itself will help a great deal.

2
  • Thanks for your reply, but I think I really want the <tr> tag within the repeat, I want a new row for each person. And the widht of the column really isn't that important, the problem is that every cell gets rerendered, I only want the cell in the same row as the checkbox to be rerendered
    – rael_kid
    Mar 29 '13 at 17:03
  • @Lex Keep an eye on the size of your view state when using apex:repeat and other VF components within. Worth taking a look through this for more info, salesforce.stackexchange.com/questions/4537/… Apr 1 '13 at 21:05
-2

Name Added

<tr>
 <apex:repeat value={!people} var="person">
    <td><apex:inputCheckbox value="{!person.added}" onchange="addOrRemove('{!person.Id}'); /></td>// <-- This TD wasn't closed
    <td>{!person.Name}</td>
    <td><apex:outputPanel id="personAddedPanel" rendered={!person.added}>Yes</apex:outputPanel></td>
</apex:repeat>
</tr>

Instead apex:outputPanel tag just used this code it will work..

<apex:outputText value="Yes" rendered="{!person.added}" /> in td tag

Thanks

1
  • As I also commented on the first answer, my page is actually a lot more complicated than this, an outputText will not suffice.
    – rael_kid
    Apr 4 '13 at 7:35

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.