JSF 2 用 js 函数设置值答案

【问题标题】：JSF 2 set value with js functionJSF 2 用 js 函数设置值
【发布时间】：2016-11-28 09:34:30
【问题描述】：

我了解如何根据支持 bean 值更改给定 jsf 标记（例如按钮标签）的值。虽然我在想是否有可能根据 js 函数的返回值设置值。

我想像 onclick 这样的东西有：

值="calljsfunction()"

返回值将是按钮的值，虽然我找不到任何语法，但它会起作用。

这样的东西存在吗？

【问题讨论】：

我认为不可能。 JavaScript 函数可以在某些事件上执行，例如页面加载、onclick 等，并且 'value' 属性不是事件。如果你想实现这样的功能，设置页面加载按钮的值（onload事件）
非常感谢！这么形容真的很有道理！

标签： javascript jsf jsf-2

【解决方案1】：

从 Backing bean 变量中绑定按钮值并在事件 preRenderView 上初始化变量 buttonName

<ui:define name="metadata">
    <f:metadata>
        <f:event type="preRenderView"
            listener="#{myBean.initBean()}" />
    </f:metadata>
</ui:define>
<h:commandButton value="#{myBean.buttonName}" action="#{myBean.execute()}" /> 



 @ManagedBean
 @RequestScoped
 public class MyBean {
     private String buttonName;
     public String getButtonName() {
         return buttonName;
     }
     public void setButtonName(String buttonName) {
         this.buttonName= buttonName;
     }
  public void initBean(){
      setButtonName("Submit");
  }
 }

【讨论】：

嗨，Albin，您确定您回答了这个问题（是否可以将 value 参数设置为 js 函数的返回值，而不是支持 bean 值的返回值）。还是我理解错误？感谢您的回答！
“我了解如何根据支持 bean 值更改给定 jsf 标记（例如按钮标签）的值” - 这是您问题的一部分，我就是这样回答的。

【解决方案2】：

通过 JavaScript 设置按钮的值，可以使用 onload 事件设置按钮值 -

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html">

<h:head>
    <title>JSF 2</title>
    <script>
        window.onload = function() {
            // write your logic for finding value of the button
            document.getElementById("myForm:button").value = "Submit";
            // or 
            // document.getElementById("myForm:button").value = getValue();
            // function getValue() { return "submit"; } 

        }
    </script>
</h:head>
<h:body>
    <h2>JSF 2</h2>
    <h:form id="myForm">Type your name here :
           <h:inputText value="#{helloWorld.name}"></h:inputText>
        <br />
        <br />
        <h:commandButton id="button" style="margin-left:120px;" value=""
            action="welcome"></h:commandButton>
    </h:form>
</h:body>

</html>

您还可以将 JavaScript 代码放在单独的 .js 文件中

【讨论】：