Can't execute Javascript in jsf page

问题

I'm new to jsf. I have been trying to do a simple Javascript function with commandbutton. I tried many times but wasn't even able to do an alert message. This is part of my code. Please can anyone guide me, and tell what is wrong, and what I should do to make it run?

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:ui="http://java.sun.com/jsf/facelets"
  xmlns:f="http://java.sun.com/jsf/core">
<h:head>
  <script type="text/javascript">
  function test(){
    alert('test');
    alert(document.getElementById('frmDashBoard:testbt').value);
  }
  </script>
</h:head>
<h:body>
  <ui:composition template="../../template/commonLayout.xhtml"> 
    <ui:define name="content">
      <div>
        <h:form id="frmdashboard">
          <div name="form_panel" style="width: 984px">
               <h:commandButton id="testbt" value="#{message.btn_dashboard_search}" action="#{searchBLAction.doAction}" onclick="test()" />
          </div>
        </h:form>
      </div>
    </ui:define>
  </ui:composition>     
</h:body> 
</html>

回答1:

Apart from this lowercase/uppercase typo (which wouldn't cause the function not being called at all, by the way), your concrete problem is caused because this page is been designed as a template client using <ui:composition>. Any content outside the <ui:composition> tag is ignored during runtime by Facelets. This content is only useful for visual web designers, but once it's compiled and executed during runtime, it's ignored altogether. Instead the composition's content will be inserted in the master template, the commonLayout in your case.

You need to put the <script> element inside an <ui:define> instead, this way it will be taken into the final Facelets composition.

<ui:define name="...">
    <script>
        ...
    </script>
    ...
</ui:define>

Or, better, put the JS function in its own JS file in the /resources folder and reference it as follows:

<ui:define name="...">
    <h:outputScript name="some.js" target="head" />
    ...
</ui:define>

Thanks to the target="head", it'll automatically be relocated into the HTML <head> during building the view.

回答2:

Any thing defined outside ui:composition is ignored.So place your content inside this tag and it will work: Something like this:

<ui:composition template="/WEB-INF/tags/layout.xhtml"> 
<ui:include src="/tags/common.xhtml"></ui:include>  
<ui:define name="content">
<h:outputScript name="validation.js" library="javascript"></h:outputScript>

来源：https://stackoverflow.com/questions/11279383/cant-execute-javascript-in-jsf-page

标签

javascript

jsf

facelets

Can't execute Javascript in jsf page

问题

回答1:

See also:

回答2: