当我将 URL 添加到列表,然后使用 ajax 时,我尝试在某些 iframe 中显示列表的内容,页面会自行重新加载

2024-02-18

我正在构建一个仪表板,它的小工具是一些指向我想要在 iframe 内显示的不同页面的链接。我有一个按钮可以将新小工具添加到仪表板,添加新小工具后,我刷新仪表板。对于前 3 个小工具,应用程序没有任何问题,并且运行完美。但是,当我想添加第四个小工具时,ajax 调用不起作用并且页面开始再次重新加载。重新加载页面后,我可以再次添加一个新的小工具并且它可以工作,但下次它再次停止工作并刷新页面。我不明白问题是什么。顺便说一句,当我删除 iframe 并打印链接本身时,程序运行没有任何问题。这是我的代码:

<h:panelGrid columns="2" >
    <p:outputLabel value="${msg.dashboard_dashboard}" />
    <p:selectOneMenu value="#{dashboardDashletsManager.dashboard}" style="min-width: 200px" converter="#{dashboardConverter}" filter="true" filterMatchMode="contains" >
          <f:selectItems value="#{dashboardDashletsManager.dashboards}" var="item" itemLabel="#{item.description}" itemValue="#{item.value}" />
          <p:ajax update=":form" />
    </p:selectOneMenu>

    <p:outputLabel for="dashlet" value="${msg.dashboard_dashlet}" />
    <p:selectOneMenu id="dashlet"  value="#{dashboardDashletsManager.globalDashletToAdd}" style="min-width: 200px" converter="#{serviceProviderConverter}"  filter="true" filterMatchMode="contains">
          <f:selectItems value="#{dashletsController.globalDashlets}" var="provider" itemLabel="#{provider.description}" itemValue="#{provider}" />
    </p:selectOneMenu>

     <p:commandButton value="${msg.dashboard_add}" icon="ui-icon-plus" ajax="true" update=":form:dashboardPanel" process="dashlet @this"  actionListener="#{dashboardDashletsManager.addToDashboard}" />
</h:panelGrid>

 <p:outputPanel id="dashboardPanel">
        <ui:repeat value="#{dashboardDashletsManager.dashlets}" var="dashlet">
            <object width="400" height="400" type="text/html" data="#{dashlet.restUrl}"></object>
        </ui:repeat>
 </p:outputPanel>

可能是您想要嵌入到第四个小面板中的内容需要花费太多时间来加载的问题。除此之外,在您的示例中,您更新了整个表单(不知道您是否打算这样做),因此 JSF 再次呈现整个表单,并且浏览器还必须恢复前三个小面板加上第四个小面板的内容一。

不管怎样,这个小测试用例对我来说可以很好地使用 Mojarra JSF 2.2.7 和 Primefaces 5:

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:p="http://primefaces.org/ui"
    xmlns:ui="http://java.sun.com/jsf/facelets">

<h:head />
<h:body>

    <h:form>
        <p:commandButton value="Add dashlet"
            action="#{dashboardManager.addDashlet}" update=":dashboardPanel" />
    </h:form>

    <p:outputPanel id="dashboardPanel">
        <ui:repeat value="#{dashboardManager.dashlets}" var="dashlet">
            <object width="400" height="400" type="text/html"
                data="#{dashlet.restUrl}"></object>
        </ui:repeat>
    </p:outputPanel>
</h:body>
</html>
@ManagedBean
@ViewScoped
public class DashboardManager {

    private static final String url = "http://www.w3schools.com";

    public class Dashlet {
        private String restUrl;

        public Dashlet(String url) {
            restUrl = url;
        }

        public String getRestUrl() {
            return restUrl;
        }

    }

    public DashboardManager() {
        dashlets.add(new Dashlet(url));
        dashlets.add(new Dashlet(url));
    }

    public List<Dashlet> dashlets = new ArrayList<Dashlet>();

    public List<Dashlet> getDashlets() {
        return dashlets;
    }

    public void addDashlet() {
        dashlets.add(new Dashlet(url));
    }

}

这里可以看到渲染一组动态是没有问题的object标签到您的板上。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

当我将 URL 添加到列表,然后使用 ajax 时,我尝试在某些 iframe 中显示列表的内容,页面会自行重新加载 的相关文章

随机推荐