How to use EL with in id attribute of a JSF component

by

You can use EL in the id attribute of a JSF component, but the EL variable has to be available during view build time, while the JSF component tree is to be built. However, the <ui:repeat> runs during view render time, while the HTML output is to be generated based on JSF component tree. The <ui:repeat var> is not available during view build time and #{class2.name} evaluates to null which totally explains the error you got. That it works in <h:outputText> is because it runs during view render time.

If you replace <ui:repeat> by <c:forEach>, which runs during view build time, then it’ll work as you intented. The <c:forEach> will namely generate physically multiple <h:form> components in the JSF component tree which each generate individually their own HTML output (in contrary to <ui:repeat>, wherein the very same <h:form> component is been reused multiple times to generate HTML output).

<c:forEach var="class2" items="#{bean.list}" varStatus="status">
  <h:form id="#{class2.name}"> 
    <h:outputText value="#{class2.name}" />
  </h:form>
</c:forEach>

However, I really wonder why you need to do that. There’s usually no need to dynamically assign component IDs. JSF will already ensure the uniqueness of the ID. The below example,

<ui:repeat var="class2" value="#{bean.list}" varStatus="status">
  <h:form id="form"> 
    <h:outputText value="#{class2.name}" />
  </h:form>
</ui:repeat>

will end up in multiple forms with each an unique ID, suffixed with iteration index of the <ui:repeat>. If you actually need to use #{class2.name} for some JavaScript/jQuery purposes (you did nowhere state the concrete functional requirement in the question for which you thought that this would be the right solution, so it’s merely guessing), then just wrap it in a plain vanilla HTML element:

<ui:repeat var="class2" value="#{bean.list}" varStatus="status">
  <div id="#{class2.name}"> 
    <h:form id="form">
      <h:outputText value="#{class2.name}" />
    </h:form>
  </div>
</ui:repeat>

Or set it as style class of a JSF component, which is also just selectable via a CSS selector:

<ui:repeat var="class2" value="#{bean.list}" varStatus="status">
  <h:form id="form" styleClass="#{class2.name}">
    <h:outputText value="#{class2.name}" />
  </h:form>
</ui:repeat>

See also:

More Related Contents:

  1. How to use in JSF page? Single form? Multiple forms? Nested forms?
  2. Adding causes java.lang.IllegalStateException: Cannot create a session after the response has been committed
  3. Clear JSF form input values after submitting
  4. Is it a good practice to use an empty URL for a HTML form’s action attribute? (action=””)
  5. UIForm with prependId=”false” breaks
  6. Difference between JSP EL, JSF EL and Unified EL [closed]
  7. Is action really required on forms?
  8. Multiple forms in a single page using flask and WTForms
  9. Angular2 – Radio Button Binding
  10. Specify conditional rendering of element inside ? The does not seem to work
  11. Escape JavaScript in Expression Language
  12. Nodejs POST request multipart/form-data
  13. h:inputText which is bound to String property is submitting empty string instead of null
  14. Better Honeypot Implementation (Form Anti-Spam)
  15. How do you style the HTML5 form validation messages?
  16. Manually Set Value for FormBuilder Control
  17. Angular: composite ControlValueAccessor to implement nested form
  18. How does Java expression language resolve boolean attributes? (in JSF 1.2)
  19. How to make ‘submit’ button disabled?
  20. How to set -Dorg.apache.el.parser.COERCE_TO_ZERO=false programmatically
  21. HTML5: Slider with two inputs possible?
  22. How to concatenate Strings in EL expression?
  23. How can I conditionally require form inputs with AngularJS?
  24. Disable submit button when form invalid with AngularJS
  25. How to open a new window on form submit
  26. Firefox keeps form data on reload
  27. Symfony2 invalid form without errors
  28. Dynamic row height in a SwiftUI form
  29. How does Chrome detect Credit Card fields?
  30. What is copyWith and how can I use it in Flutter and what are it’s use cases?

Leave a Comment