2

我有以下问题：

在我的数据模型中，我有一个名为Type的类。类型由标题和描述组成。

现在我有一个下拉框，用户可以在其中选择Type的实例：

<h:selectOneMenu id="typeDropdown" onchange="displayDescription();">
      <f:selectItems value="#{operationCreator.types.title}" />
</h:selectOneMenu>

下拉框下方是一个 div 区域，我希望在其中显示所选类型的描述。

我的问题如下：

如何将Type实例的描述存储在 javascript 中？一个简单的遍历列表的 JSF 标记就可以完成这项工作，但不幸的是我不知道。它们都打印额外的 HTML 标记（如数据表），或仅使用周围的 JSF 标记（如 selectItems）。

我知道我可以使用 AJAX 推送来解决我的问题，但我不想这样做。我想在 javascript 中访问我的页面加载数据。

我希望你能帮帮我！谢谢，迈克尔

4

1 回答 1

7

以 JSON 格式准备数据，让 JSF 将其打印为 JS 变量。您可以直接在 backing bean 中执行此操作

public String getTypesAsJson() {
    return typesAsJson;
}

和

<script>
    var types = #{bean.typesAsJson};
</script>

或者在视图中通过迭代 Java 集合List<Type>，如果保证值不包含 JS 中的任何特殊字符（例如引号和换行符），并相应地打印 JavaScript 代码：

<script>
    var types = {
        <ui:repeat value="#{bean.types}" var="type" varStatus="loop">
            "#{type.title}": "#{type.description}"#{!loop.last ? "," : ""}
        </ui:repeat>
    };
</script>

第一种方法更可取，因为当类型标题或描述包含 JS 特殊字符时，它消除了生成的 JS 代码中出现语法错误的风险。您可以使用Google Gson将 Java bean 集合转换为有效 JSON 格式的字符串。

typesAsJson = new Gson().toJson(types);

现在，如果你确定下拉列表的项目值是类型标题，那么你可以得到相关的描述如下

<h:selectOneMenu ... onchange="displayDescription(this)">

和

function displayDescription(dropdown) {
    var title = dropdown.options[dropdown.selectedIndex].value;
    var description = types[title];
    // ...
}
于 2012-05-15T16:48:50.470 回答