+ Start a Discussion
abhinavgupta19abhinavgupta19 

Create HTML Elements/Sections with dynamic ids for rerender

Hi Guys,

 

I want to create sections in page with dynamic ids. These ids might be coming from a List/Set in apex controller.

The goal is to get a partial page refresh for the section represented by dynamic ids.

 

for ex.

 

 

<table>

    <tr id='r1' > <select onchange="rerender(r1)"> <option /> .... </select> </tr>

    <tr id='r2' > <select onchange="rerender(r2)"> <option /> .... </select> </tr>

     ............................

     ............................

     ............................

    <tr id='rN' > <select onchange="rerender(rN)"> <option /> .... </select> </tr>

 </table>

 

I was checking documentation for "Id"  attribute in visualforce tags, we can't put a merge field expression or a value in iteration in the ID. Although rerender attribute supports merge field expressions, so it seems I can have current iteration/loop variables like r1, r2 into the render attribute.

 

We commonly use to do this in HTML with any other language like JSP/ASP to have elements with dynamic ids and perform some operations on them. I was curious to know if this is possible in visual force also.

 

 

 

 

sfdcfoxsfdcfox

You can use a dataTable, and have a reRender attribute on the dataTable. Add an actionSupport to the selectList, and you're good to go. Also, you need a "wrapper" class so you can identify which dynamic list you're working with.

 

Page:

 

<apex: page controller="theController">

 <apex:form>

  <apex: dataTable value="{!dataRows}" var="dataRow" id="theTable">

   <apex: column>

    <apex: selectList value="{!dataRow.selectedItem}">

     <apex: selectOptions value="{!dataRow.availableItems}" />

     <apex: actionSupport event="onchange" reRender="theTable" />

    </apex: selectList>

   </apex: column>

  </apex: dataTable>

 </apex:form>

</apex: page>

 

Controller:

 

public class theController {

 public class itemWrapper {

  public string selectedItem { get; set; }

  public List<SelectOption> getAvailableItems() {

  //TODO: You can modify available options here.

   List<SelectOption> options = new List<SelectOption>();

   options.add(new SelectOption('1','Value 1'));

   options.add(new SelectOption('2','Value 2'));

   return options;

  }

 }

 private List<itemWrapper> items;

 public theController() {

  items = new List<itemWrapper>();

  //TODO: Add items here.

 }

 public List<itemWrapper> getDataRows() {

  return items;

 }

}

 

If you add an item to the itemWrapper list, it will appear on the next rerender. If you'd like, you could also include a boolean value to selectively render a picklist, which would allow you to keep it in memory but not display on the screen. This is probably the best way to handle a dynamic list of any sort of input field (except for sets of records, which you can use the StandardSetController for).

TehNrdTehNrd
That is an options but I really wish you could create dynamic Ids and actionSupports that rerender these Ids. In large dataTables I have have to rerender the whole thing or several columns with all I need to do is rerender one row.
sfdcfoxsfdcfox

After some testing, I came up with the following conclusion...

 

It's not yet supported (but it appears that it is intended to be in the future, based on my testing).

 

Currently, dynamic ID values won't compile, but it returns the following: "Error: 0".