Question

是否可以使用javascript添加JSF组件？在我的情况下，在更改选择选项时，我需要显示输入控件的不同组合（如文本框）。我以为我可以使用元素和innerHTML属性来显示动态控件。但它似乎不起作用!!!

<h:selectOneMenu id="browseType" class="TextBlackNormal"
                            value="#{adminBean.browseType}" onchange="showDynamicBox(this);"
                            valueChangeListener="#{adminBean.theValueChanged}">
                            <f:selectItems value="#{adminBean.browseTypeList}" />
                        </h:selectOneMenu> &#160;&#160;&#160;</td>
                        <td>
                        <div id="dynamicBox" style="display:block"><h:inputText
                            class="TextBlackNormal" size="32" name="browseValue"
                            id="browseValue" value="#{adminBean.browseValue}" /></div>
                        </td>

javascript代码： ~~~~~~~~~~~~~~~~

  function showDynamicBox(selectObjj)
{
    //alert('showDynamicBox ' +showDynamicBox);
    if(selectObjj.options[selectObjj.selectedIndex].value=='IBD/Office/IP'
        || selectObjj.options[selectObjj.selectedIndex].value=='APA#' )
    {
        alert('just about to change');
        document.getElementById("dynamicBox").innerHTML='<h:inputText class="TextBlackNormal" size="3" name="val1" id="val1" /> <h:inputText class="TextBlackNormal" size="3" name="val2" id="val2" /> <h:inputText class="TextBlackNormal" size="3" name="val3" id="val3" /> ';
        alert(' --> ' +document.getElementById("dynamicBox").innerHTML);
    }else{
        alert('back to pavillion');
        document.getElementById("dynamicBox").innerHTML='<h:inputText class="TextBlackNormal" size="32" name="browseValue" id="browseValue" value="#{adminBean.browseValue}" />';
    }

}

Answer 1

是否可以使用javascript添加JSF组件？

不 - 那将是一场安全噩梦。

JSF控件在服务器上运行（尽管可能会发出JavaScript以获得更丰富的客户端体验）。服务器的JSP编译器在将JSP转换为Java时会解释这些h:foo元素。

JavaScript在浏览器中运行。

我建议说明你想尝试和实现的目标，然后就如何使用JSF提出建议。

Answer 2

您无法使用javascript添加jsf组件。您可以简单地操纵现有组件的可见性（css display和visibility属性）。

（您可以将jQuery与richfaces一起使用。）

Answer 3

正如McDowell所说，你不能通过Javascript将组件添加到JSF树中，但听起来你要做的就是在一个大输入框或三个小输入框之间交换页面上的控件。

有几种方法可以做到这一点：

在页面上拥有所有控件用javascript显示/隐藏它们。你已经做了类似的事情，但是将3个小框绑定到后端值并切换显示无/块而不是处理innerHTML。
在页面上有一组控件，并使用ajax（例如richfaces）有选择地渲染它们。

如何在javascript中添加jsf组件？

3 个答案: