返回 JSF 页面上的图像列表

Question

我有一个用户可以从中选择的项目的下拉列表（视图是 JSF）。在用户从下拉列表中选择一个项目后，我希望图像出现在同一个 JSF 页面上（即用户从下拉列表中选择单词“Cat”，并出现一组不同的猫图像）

如何在 JSF 中编写代码？

注意*我使用的是带有 facelets 的 JSF 2.0，而不是 JSP。

Answer 1

BalusC 的回答（一如既往:) 是正确的，但正如您所注意到的，在 selectOneMenu 中会有一个 URL 列表。这正是我问你如何存储图像的原因。我通常这样做的方式：（据我所知，这是标准的做法，如果我错了，希望有人会纠正我）你将图像存储在服务器上的某个地方，并在你的数据库中存储它的位置。这就是为什么我建议创建一个 MyImage 类（将映射到数据库表），您将在其中存储图像的名称以及在服务器上获取其位置的方法（例如，您可以使用像猫这样的命名空间来完成它将有一个String namespace = "cats" 和一个String imageName 以及一个返回像String getImageLocation() {return "@987654321@"+namespace+"/"+imageName;} 这样的url 的方法，记住让它看起来像一个getter 是很重要的，这样JSF 才能使用它）。然后，您所要做的就是从您的数据库中获取给定命名空间的 MyImages 列表，并在 dataTable 中呈现图像，如下所示：

<h:dataTable value="#{myBeanWithAListOfImages.images}" var="img">
    <h:column>
        <h:graphicImage value="img.imageLocation"/>
    </h:column>
</h:dataTable>

其中 images 是 List<MyImage>。这应该可以工作并将图像打印在一个列中。

Answer 2

在下拉列表中提供包含图片 URL 的列表，并使用 h:graphicImage 在所选 URL 上显示图片。然后，使用f:ajax 在更改下拉菜单时重新渲染图像。

这是一个启动示例：

<h:form>
    <h:selectOneMenu value="#{bean.imageURL}">
        <f:selectItems value="#{bean.imageURLs}" />
        <f:ajax event="change" render="image" />
    </h:selectOneMenu>
    <h:graphicImage id="image" value="#{bean.imageURL}" /> 
</h:form>

豆子：

private List<String> imageURLs; // +getter
private String imageURL; // +getter +setter