Mixing JSF EL in a JavaScript file
Is there a way to have Expression Language (EL) expressions included JavaScript files be evaluated by JSF?
I was hoping that 开发者_Go百科Seam might have a way around this, but no luck so far. All I want is to be able to use localized messages in my JavaScript functions which are shared across pages.
Five ways:
Declare it as global variable in the parent JSF page.
<script type="text/javascript" src="script.js"></script> <script type="text/javascript"> var messages = []; <ui:repeat value="#{bean.messages}" var="message"> messages['#{message.key}'] = '#{message.value}'; </ui:repeat> </script>
Or, if it's in JSON format already.
<script type="text/javascript" src="script.js"></script> <script type="text/javascript">var messages = #{bean.messagesAsJson};</script>
Put the whole
<script>
in a XHTML file and useui:include
to include it.<script type="text/javascript" src="script.js"></script> <ui:include src="script-variables.xhtml" />
Pass
*.js
through theJspServlet
(only if it's enough to evaluate only the${}
expressions). E.g. inweb.xml
(the<servlet-name>
ofJspServlet
can be found inweb.xml
of the servletcontainer in question, it's usuallyjsp
).<servlet-mapping> <servlet-name>jsp</servlet-name> <url-pattern>*.js</url-pattern> </servlet-mapping>
Make use of "good old" JSP with a modified content type. Rename
script.js
toscript.jsp
and add the following line to top of JSP (only if it's enough to evaluate only the${}
expressions):<%@page contentType="text/javascript" %>
Let JS obtain the data ajaxically during load. Here's a jQuery targeted example.
$.getJSON('json/messages', function(messages) { $.each(messages, function(key, value) { $.messages[key] = value; }); });
Since I don't like techniques that won't let the browser cache the localized Strings, I used the following technique to localize JavaScript alerts, etc. It seems a good fit if the Strings that you need in your JavaScript code are different from the ones needed by the Web server:
<h:head>
<h:outputScript library="javascript" name="#{fw.JsFwStrings}" />
...
I then assign the resource string JsFwStrings to the filename of the JavaScript file defining the localized strings for the given language.
For example, the fw_en.properties file contains the entry JsFwStrings=JsFwStrings_en.js
And the JsFwStrings_en.js file contains
var TosFramework = TosFramework || {};
TosFramework.Strings = {
UnSavedChangesWarning : 'You have unsaved changes.',
CancelConfirmQuestion : 'Are you sure you want to cancel?'
}
精彩评论