使用带有 javascript 的托管 bean 创建元素答案

【问题标题】：Using managed beans with javascript to create elements使用带有 javascript 的托管 bean 创建元素
【发布时间】：2012-07-06 09:42:17
【问题描述】：

我的问题有点复杂，我有一个托管 bean，可能是一个会话范围的 bean，现在在这个 bean 中，我检索存储在数据库中的有关某些元素的信息（它们的宽度、高度、X、Y 坐标..等），但是这些元素的编号是动态存储的，这意味着它们没有一定的编号，另外它们还可能嵌套了另一个元素。

就像存储 div 的位置和坐标，以及其中的 p 元素以及它们的信息，那么现在我想使用托管 bean 来相应地创建元素。

1- 我应该使用什么？（现在我正在使用 JSF 2 Facelets 和 Javascript/jQuery）。

2- 使用您推荐的工具的正确方法是什么。

我在 JSF 页面中寻找类似的东西

这可以使用 jsf 和 javascript/jquery 完成吗？？

for(every i in elements.div)
{
     create a div element
    then
     for(every i in div.p )
     create a p element in that div
     width of p element = p.width
    .
    .
    .
    load all element info 
}

【问题讨论】：

标签： java javascript jquery jsf jsf-2

【解决方案1】：

您可以使用组件绑定。在您的 JSF 页面上，您引用了您的支持 bean，它提供了准备好的 JSF 树组件。

<p>Here comes a dynamic content</p>
<h:panelGroup binding="#{myBackingBean.generatedElements}"/>

在您的支持 bean 中，您可以根据需要创建和嵌套元素

...
public class MyBackingBean {
...

private HtmlPanelGroup generatedElements = new HtmlPanelGroup();

public void init() {
     for (Element e : myElements) {
         // Take any element type you want
          HtmlOutputText subElement = new HtmlOutputText();
          subElement.setValue(e.getText());
          generatedElements.getChildren().add(subElement);
     }
}

您还可以使用subElement.setValueExpression 方法来构建具有由JSF 表达式定义的动态属性的组件。例如国际化。

【讨论】：

所以我在托管 bean 中创建元素？还有其他方法可以在 facelet 中创建它吗？
@Developer106，如果您的结构不是太复杂，您可以尝试使用<ui:repeat> 之类的东西来完成它，并根据您的数据渲染元素。例如<h:outputLink rendered="{#row.type == 'a'}" ...>。另一种选择是将托管 bean 中的 HTML 源代码呈现为字符串并在不转义的情况下将其注入：<h:outputText value="{#myBean.generatedHtml}" escape="false"/>
所以没有for循环和if语句可用？
@Developer106，对于条件语句，您可以使用 JSTL 标记库 <c:choose>、<c:if> 等。但是始终建议使用元素的 rendered 属性来显示/隐藏它们并保留JSF 文档树稳定。

【解决方案2】：

您可能想看看https://vaadin.com/，这无疑是一种不同的方法，但也许可以满足您的实际需求，甚至更多。

编辑
既然不能改框架（这点很好理解），请看How to create dynamic JSF form fields。基本上所有必要的步骤都列在那里。您可以采用类似的方法来创建 <div> 和 <p> 标签而不是表单元素。

【讨论】：

是的，我担心你会这么说。
没错，但据我所知，给出的代码也适用于 JSF 2.0。