【问题标题】:Returning Multiple Images to JSF page将多个图像返回到 JSF 页面
【发布时间】:2011-04-02 07:29:02
【问题描述】:

使用此代码,我可以根据下拉选择返回一张图像。关于如何返回多个图像的任何想法(我试图用图像创建一个 ArrayList 并使用 UI:Repeat 标记将其呈现回我的视图,但我没有成功。这是我现在的当前代码,它有效但仅返回一张图片。关于采取什么方法来获取多张图片的任何想法?

Java 代码:

(Person类有属性:private String theImage;)

public String getTheImage(){

    if(this.theSchoolChoice.equals("University of Alabama")){
        theImage = "/resources/gfx/UofALogo.png";
    }

    if(this.theSchoolChoice.equals("Harvard University")){

    }
    return theImage;
}

JSF 代码:

    <h:selectOneMenu value="#{person.theSchoolChoice}" style="width : 179px; height : 21px;">
        <f:selectItems value="#{person.theOptions}"/>
    </h:selectOneMenu>
    <h:outputLabel value="  "/>

    <h:commandButton action="submit" value="Get templates" style="FONT-SIZE: medium; FONT-FAMILY: 'Rockwell';width : 128px; height : 25px;">
    <f:ajax event="change" render="image" />
    </h:commandButton>
    <br></br>
    <br></br>
    <h:graphicImage id="image" value="#{person.theImage}"/>

【问题讨论】:

    标签: java ajax jsf jsf-2


    【解决方案1】:

    尝试像使用 ui:repeat 一样使用循环,但改用 c:forEachui:repeat 只为 h:graphicImagec:forEach 创建一个 jsf 组件 - 与它拥有的项目一样多。详情请看这篇文章: https://rogerkeays.com/jsf-c-foreach-vs-ui-repeat

    附:您的 getTheImage 方法看起来不太好 - 您应该考虑使用图像 ID 而不是名称作为 theOptions 集合的值。

    【讨论】:

    • 感谢 denis_k 的回复。我会试试 c:forEach 的。
    • 当然不要使用c:forEach。您不能将它与 ajax 操作结合使用,因为它仅在构建视图期间执行,而不是在视图渲染期间执行。基本上,将不再有动态渲染的内容。另请参阅我在 this question 上的回答。
    • 很好,我真的很怀念 Calvin Han 需要用 ajax 渲染他的图像。
    【解决方案2】:

    正如您在first question 中所说的那样,我建议获取Map&lt;String, List&lt;String&gt;&gt; 中的所有图像,其中地图键是下拉值,地图值是图像集合。

    由于您似乎无法弄清楚,这里有一个 JSF 页面应该是什么样子的启动示例:

    <h:form>
        <h:selectOneMenu value="#{bean.groupName}">
            <f:selectItem itemValue="Please select one" />
            <f:selectItems value="#{bean.groupNames}" />
            <f:ajax event="change" render="images" />
        </h:selectOneMenu>
        <h:panelGroup id="images">
            <ui:repeat value="#{bean.images}" var="image">
                <h:graphicImage value="#{image}" /> 
            </ui:repeat>
        </h:panelGroup>
    </h:form>
    

    下面是关联的Bean 的样子:

    @ManagedBean
    @ViewScoped
    public class Bean {
    
        private Map<String, List<String>> allImages = new LinkedHashMap<String, List<String>>();
        private List<String> groupNames;
        private String groupName;
    
        public Bean() {
            allImages.put("group1", Arrays.asList("group1a.jpg", "group1b.jpg", "group1c.jpg"));
            allImages.put("group2", Arrays.asList("group2a.jpg", "group2b.jpg", "group2c.jpg"));
            allImages.put("group3", Arrays.asList("group3a.jpg", "group3b.jpg", "group3c.jpg"));
            groupNames = new ArrayList<String>(allImages.keySet());
        }
    
        public List<String> getImages() {
            return allImages.get(groupName);
        }
    
        public List<String> getGroupNames() {
            return groupNames;
        }
    
        public String getGroupName() {
            return groupName;
        }
    
        public void setGroupName(String groupName) {
            this.groupName = groupName;
        }
    
    }
    

    【讨论】:

    • 感谢 BalusC。如您所见,我没有您那么先进:) -C
    • 嗨 BalusC,我实现了另一种解决方案,用于从选择中返回多个图像。我不想复制你的代码。就像将来的参考一样,请不要为我提出的问题提供直接的代码解决方案......我只是要求一个思考过程的答案。如您所知,直接给出答案会剥夺我的学习过程。我这么说是因为从您的回答中,我感到有些沮丧。这不是我的意图。 -C
    • 这只是一个启动示例,可以为您指明正确的方向。没有难过的感觉,我几乎总是发布启动示例。
    • 感谢您的回复并感谢您的理解。 -C
    • 为了更好地了解 JSF 在幕后所做的一切,我建议通过 this article。虽然代码示例是针对 JSF 1.2 的,但本文的文本也完全适用于 JSF 2.0。
    猜你喜欢
    • 2011-04-01
    • 1970-01-01
    • 2010-10-28
    • 2018-04-10
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-03-29
    • 1970-01-01
    相关资源
    最近更新 更多