PrimeFaces –通过下拉选择打开窗口

最新推荐文章于 2020-07-19 21:00:51 发布

cyan20115

最新推荐文章于 2020-07-19 21:00:51 发布

阅读量295

点赞数

文章标签： xhtml ui javascript ViewUI

技术： Primefaces是使用Java开发Web应用程序的基于Java的Web框架。
它是JSF的合规性框架之一，还有许多其他框架，例如omnifaces，richfaces。 Primefaces具有丰富的UI组件。

在本教程的主要内容中，使用了maven，java8，glasifish服务器。

用例：如果您想通过单击按钮，链接或直接的东西来打开新页面。即使页面URL是通过直接支持bean寻址的，我们也可以做到。但是，如果页面URL是动态的，则不是一件简单的事情，因为当您单击按钮时，页面已经呈现，因此您将拥有旧的价值。因此，在这种情况下，我将实现此用例。

有几个步骤可以实现这一点，

创建一个Primefaces maven项目，下载glassfish并将其添加到eclipse的服务器部分。
部署应用程序并进行测试。

1.项目结构

2.项目依赖

我刚刚添加了primefaces，jsf库。

pom.xml

<project xmlns="http://maven.apache.org/POM/4.0.0" 
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"  
    xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 
	http://maven.apache.org/xsd/maven-4.0.0.xsd">  
      <modelVersion>4.0.0</modelVersion>  
      <groupId>simple.primefaces.app</groupId>  
      <artifactId>simple.primefaces.app</artifactId>  
      <version>2017.09.01</version>  
      <packaging>war</packaging>  
      <name>primefaces-app</name>  
      <dependencies>  
           <!-- https://mvnrepository.com/artifact/org.primefaces/primefaces -->  
           <dependency>  
                <groupId>org.primefaces</groupId>  
                <artifactId>primefaces</artifactId>  
                <version>5.0</version>  
           </dependency>  
           <!-- https://mvnrepository.com/artifact/javax.faces/jsf-api -->  
           <dependency>  
                <groupId>javax.faces</groupId>  
                <artifactId>jsf-api</artifactId>  
                <version>2.0</version>  
                <scope>provided</scope>  
           </dependency>  
           <!-- https://mvnrepository.com/artifact/org.omnifaces/omnifaces -->  
           <dependency>  
                <groupId>org.omnifaces</groupId>  
                <artifactId>omnifaces</artifactId>  
                <version>2.6.4</version>  
           </dependency>  
      </dependencies>  
      <build>  
           <sourceDirectory>src</sourceDirectory>  
           <plugins>  
                <plugin>  
                     <artifactId>maven-compiler-plugin</artifactId>  
                     <version>3.5.1</version>  
                     <configuration>  
                          <source>1.8</source>  
                          <target>1.8</target>  
                     </configuration>  
                </plugin>  
                <plugin>  
                     <artifactId>maven-war-plugin</artifactId>  
                     <version>3.0.0</version>  
                     <configuration>  
                          <warSourceDirectory>WebContent</warSourceDirectory>  
                     </configuration>  
                </plugin>  
           </plugins>  
      </build>  
 </project>

3.代码

创建了一个Bean，Converter和Enum以及index.xhtml（facelet）

MyBean.java

package simple.primefaces.app;  
import java.util.Arrays;  
import java.util.List;  
import javax.faces.bean.ManagedBean; 
 
@ManagedBean  
public class MyBean {  
     private static final String GOOGLE = "https://www.google.co.in/";  
     private static final String YAHOO = "https://in.yahoo.com/";  
     private WebOptions selectedOption;  
     private String webOptionUrl;  
     public String getWebOptionUrl() {  
           return webOptionUrl;  
     }  
     public void setWebOptionUrl(String webOptionUrl) {  
          this.webOptionUrl = webOptionUrl;  
     }  
     public void prepareUrl(){  
          if(WebOptions.GOOGLE.equals(selectedOption)){  
               webOptionUrl = GOOGLE;  
          } else if(WebOptions.YAHOO.equals(selectedOption)) {  
               webOptionUrl = YAHOO;  
          } else {  
               webOptionUrl = "";  
          }  
     }  
     public List<WebOptions> getAllWebOptions() {  
          return Arrays.asList(WebOptions.values());  
     }  
     public WebOptions getSelectedOption() {  
          return selectedOption;  
     }  
     public void setSelectedOption(WebOptions selectedOption) {  
          this.selectedOption = selectedOption;  
     }  
}

WebOptionConverter.java

package simple.primefaces.app;  
import java.io.Serializable;  
import javax.faces.component.UIComponent;  
import javax.faces.context.FacesContext;  
import javax.faces.convert.Converter;  
import javax.faces.convert.FacesConverter;  
import org.omnifaces.cdi.ViewScoped;  

@FacesConverter(value = "simple.primefaces.app.WebOptionConverter", forClass = WebOptionConverter.class)  
@ViewScoped  
public class WebOptionConverter implements Converter, Serializable {  
     /** the serialVersionUID      **/  
     private static final long serialVersionUID = -218581226063576481L;  
     public WebOptionConverter(){  
          super();  
     }  
     @Override  
     public Object getAsObject(FacesContext context, UIComponent component, String value) {  
          return WebOptions.getOptionByOptoin(value);  
     }  
     @Override  
     public String getAsString(FacesContext context, UIComponent component, Object value) {  
          if(value instanceof WebOptions){  
               final WebOptions objectStatus = (WebOptions) value;  
               return objectStatus.getWebOption();  
          }  
          return "";  
     }  
}

WebOptions.java

package simple.primefaces.app;  

public enum WebOptions {  
     GOOGLE("google"),  
     YAHOO("yahoo");  
     private String webOption;  
     WebOptions(String webOption){  
          this.webOption = webOption;  
     }  
     public static WebOptions getOptionByOptoin(String value){  
          if(WebOptions.GOOGLE.webOption.equals(value)){  
               return WebOptions.GOOGLE;  
          }  
          return WebOptions.YAHOO;  
     }  
     public String getWebOption() {  
          return webOption;  
     }  
}

Index.xhtml

<?xml version="1.0" encoding="UTF-8"?>  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml"  
     xmlns:h="http://java.sun.com/jsf/html"  
     xmlns:f="http://java.sun.com/jsf/core"  
     xmlns:ui="http://java.sun.com/jsf/facelets"  
     xmlns:p="http://primefaces.org/ui">  
<h:head>  
     <script type="text/javascript">  
    function openUrl(){  
       var webOptionUrl = document.getElementById("websiteForm:webOptionHidden").value;  
       if(webOptionUrl.length === 0){  
            var message = 'Please select website';  
            alert(message);  
       } else {  
            window.open(webOptionUrl, '', 'width=1024, height=720, status=no, scrollbars=1 menubar=no, toolbar=no');  
       }  
  }  
  </script>  
</h:head>  
<h:body>  
     <h:form id="websiteForm">  
          <p:panelGrid id="selectOption" style="margin-left:500px;">  
               <p:row>  
                    <p:column>  
                         <p:outputLabel value="Please select website: "></p:outputLabel>  
                         <p:selectOneMenu id="option" value="#{myBean.selectedOption}">  
                              <f:selectItem itemLabel="--" itemValue="" />  
                              <f:selectItems value="#{myBean.allWebOptions}" var="o" itemLabel="#{o.webOption}" itemValue="#{o}"/>  
                                   <p:ajax update="@form" process="@this" listener="#{myBean.prepareUrl}"></p:ajax>  
                              <f:converter converterId="simple.primefaces.app.WebOptionConverter" />  
                         </p:selectOneMenu>  
                    </p:column>  
               </p:row>  
               <p:row>  
               <p:column>  
                    <p:commandButton id="submitButton" value="Submit" oncomplete="openUrl();" update="webOptionHidden"/>  
                    <p:inputText id="webOptionHidden" value="#{myBean.webOptionUrl}" style="display:none;"/>  
               </p:column>  
               </p:row>  
          </p:panelGrid>  
     </h:form>  
</h:body>  
</html>

Web.xhtml

<?xml version="1.0" encoding="UTF-8"?>  
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
	xmlns="http://java.sun.com/xml/ns/javaee" 
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" 
	id="WebApp_ID" version="3.0">  
	
 <display-name>simple.primefaces.app</display-name>  
 <welcome-file-list>  
  <welcome-file>index.html</welcome-file>  
  <welcome-file>index.xhtm</welcome-file>  
  <welcome-file>index.jsp</welcome-file>  
  <welcome-file>default.html</welcome-file>  
  <welcome-file>default.htm</welcome-file>  
  <welcome-file>default.jsp</welcome-file>  
 </welcome-file-list>  
 <context-param>  
  <param-name>com.sun.faces.enableRestoreView11Compatibility</param-name>  
  <param-value>true</param-value>  
 </context-param>  

</web-app>

4，演示

生成应用程序并将其添加到服务器并运行该应用程序。

4.1如果您运行该应用程序，则屏幕将如下所示：

4.2如果您没有选择任何选项，它将提示您选择一个选项。

4.3现在，我已经添加了两个页面google和yahoo，如果您选择其中任何一个，则相应的网站将在另一个窗口中打开。

4.4现在，我将解释这个窍门，希望您熟悉primefaces小部件，omnifaces转换程序，backing bean……如果不是，我建议您阅读primefaces教程。

假设没有选择任何选项，然后单击“提交”，那么将在我检查是否选择了任何选项的地方检查javascript方法，如果没有选择任何内容，只是简单地要求用户选择任何选项。
假设您选择了任何选项，现在我们调用了一个Ajax调用，导致所选的选项将设置为支持bean，并准备其各自的页面URL。之后，（如果您观察facelet，index.xhtml，我添加了一个文本字段，该文本字段将不会显示在网页上）
在ajax调用完成之后，此文本字段将被更新，这意味着该文本字段将具有选定的Web选项。
如果您现在单击提交，则再次调用javascript方法，我们从此文本字段获取值，因此其中包含选项的URL。因此，URL将在新窗口中打开。

Java开发程序员团队已共享有关Java技术及其在Java项目中的用法的最佳知识。如果需要更多信息，可以询问已经在其项目中应用了该技术的开发人员。

阅读更多相关内容：
Java开发中的JPA乐观锁异常
这篇文章解释了JPA技术及其在Java开发中的用法。 Java开发印度的专家在解释技术的用例-JPA和Hibernate，MySql数据库，Maven。阅读这篇文章，知道他们想说什么。

参考文献

PrimeFaces – Java EE的终极UI框架

标签：下拉 jsf primefaces

翻译自: https://mkyong.com/jsf2/primefaces/primefaces-open-window-by-dropdown-selection/

cyan20115

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
PrimeFaces –通过下拉选择打开窗口

技术： Primefaces是使用Java开发Web应用程序的基于Java的Web框架。它是JSF的合规性框架之一，还有许多其他框架，例如omnifaces，richfaces。 Primefaces具有丰富的UI组件。在本教程的主要内容中，使用了maven，java8，glasifish服务器。用例：如果您想通过单击按钮，链接或直接的东西来打开新页面。即使页面URL是通过直接...
复制链接

扫一扫