How do I pass JSF managed bean properties to a JavaScript function?

by

This is not exactly “passing” of JSF variables. This is just printing JSF variables as if they are JavaScript variables/values. You know, JSF and JS do not run in sync at all. JSF runs in webserver and produces HTML/CSS/JS code which in turn runs in webbrowser once arrived over there.

Your concrete problem is most likely caused because you wrote JSF code in such way that it generates invalid JS syntax. An easy way to verify that is by just checking the JSF-generated HTML output which you can find by rightclick, View Source in browser, and by checking if you don’t see any syntax error reports in the JS console in browser which you can find by pressing F12 in Chrome/IE9+/Firefox23+.

Imagine that #{entity.key} here

<a onclick="actualizaMenu(#{entity.key})">#{entity.nombre}</a>

prints a Java string variable like "foo", then the generated HTML would look like

<a onclick="actualizaMenu(foo)">some name</a>

But hey, look, that represents a JavaScript variable named foo, not a JS string value! So if you actually want to ultimately end up as

<a onclick="actualizaMenu('foo')">some name</a>

then you should instruct JSF to generate exactly that HTML:

<a onclick="actualizaMenu('#{entity.key}')">#{entity.nombre}</a>

Beware of special characters in the JSF variable though. You can use OmniFaces of:escapeJS() function for that.

Unrelated to the concrete problem, the concrete implementation of actualizaMenu() makes no sense. You seem to be attempting to set a bean property. You should not use JS for that, but a <h:commandLink> instead.

<h:commandLink value="#{entity.nombre}" action="#{linkedMenu.setKey(entity.key)}" />

Nest if necessary a <f:ajax> to make it asynchronous.

More Related Contents:

  1. How to pass JavaScript variables as parameters to JSF action method?
  2. How to invoke animation when redirection in jsf?
  3. Access Java / Servlet / JSP / JSTL / EL variables in JavaScript
  4. How to invoke a JSF managed bean on a HTML DOM event using native JavaScript?
  5. How can I know the id of a JSF component so I can use in Javascript
  6. JavaScript: Passing parameters to a callback function
  7. Call Servlet and invoke Java code from JavaScript along with parameters
  8. jQuery’s .click – pass parameters to user function
  9. Pass parameter to p:remoteCommand from JavaScript
  10. Passing parameters to JavaScript files
  11. Error parsing XHTML: The content of elements must consist of well-formed character data or markup
  12. Calling a JavaScript function from managed bean
  13. The entity name must immediately follow the ‘&’ in the entity reference
  14. In Javascript/jQuery what does (e) mean?
  15. Mixing JSF EL in a JavaScript file
  16. How to pass event as argument to an inline event handler in JavaScript?
  17. How to use jQuery and jQuery plugins with PrimeFaces
  18. Escape JavaScript in Expression Language
  19. Integrate JavaScript in JSF composite component, the clean way
  20. IF Statement Always True
  21. Javascript multiple dynamic addEventListener created in for loop – passing parameters not working
  22. Getting backing bean value with Javascript
  23. Execute JavaScript after every JSF ajax postback
  24. What is the alternative for the chart extender attribute in PrimeFaces 5.2 and newer
  25. Defer loading and parsing of PrimeFaces JavaScript files
  26. How to re-execute javascript function after form reRender?
  27. How to implement something like this GIF that using mouse drag and select items
  28. Async Await map not awaiting async function to complete inside map function before mapping next item
  29. Google Script HTML form from Library throws error Uncaught
  30. Pass element ID to Javascript function

Leave a Comment