JSF 2 OutputScript-Beispiel

JavaServer-Gesichter (JSF 2) stellt eine Reihe von Benutzeroberflächenkomponenten bereit, die die häufigsten Anforderungen abdecken. Eine der wichtigsten Komponenten ist eine -Komponente. Mithilfe des Typicals können Sie ein JavaScript-Codefragment in Ihre Ansichten einbinden Verknüpfung Etikett. JavaServer Faces 2 bietet Ihnen eine Ressourcen neues Konzept, das jemals zuvor bereitgestellt wurde; Es ist jetzt möglich, Ihr JavaScript mithilfe des -Tags einzubinden. Sie können Skriptdateien in einem Ressourcenverzeichnis im ablegen Wurzel Ihrer Webanwendung. Unterverzeichnisse dieses Verzeichnisses werden aufgerufen Bibliothekenkönnen Sie beliebige Bibliotheken erstellen.

Lesen Sie auch:

  • JSF 2-Tutorials
  • JSF-Tutorials
  • Einführung in JSF

1. JSF-Ansicht

OutputScript.xhtml

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">
<h:head>
	<h:outputScript library="js" name="javascript.js"></h:outputScript>
</h:head>
<f:view>
	<h:form>
		<h1>
			<h:outputText value="JavaBeat JSF 2.2 Examples" />
		</h1>
		<h2>
			<h:outputText value="OutputScript Example" />
		</h2>
		<h:commandLink value="Say Hello" onclick="sayHello();"/>
	</h:form>
</f:view>
</html>

2. Java-Script-Code

javascript.js

function sayHello(){
alert("Hello JavaBeat !");
}

3. Die Verzeichnisstruktur

Für eine ordnungsgemäße Verwendung von müssen Sie Ihre Verzeichnisse so strukturieren, wie Sie im folgenden Schnappschuss sehen würden.

JSF 2-Ausgabeskriptbeispiel 2

4. Der Bereitstellungsdeskriptor (web.xml)

web.xml

<?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" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
	http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
	id="WebApp_ID" version="2.5" metadata-complete="true">
	<context-param>
		<description>State saving method: 'client' or 'server' (=default). See JSF Specification 2.5.2</description>
		<param-name>javax.faces.STATE_SAVING_METHOD</param-name>
		<param-value>client</param-value>
	</context-param>
	<context-param>
		<param-name>javax.faces.application.CONFIG_FILES</param-name>
		<param-value>/WEB-INF/faces-config.xml</param-value>
	</context-param>
	<servlet>
		<servlet-name>Faces Servlet</servlet-name>
		<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
		<load-on-startup>1</load-on-startup>
	</servlet>
	<servlet-mapping>
		<servlet-name>Faces Servlet</servlet-name>
		<url-pattern>/faces/*</url-pattern>
	</servlet-mapping>
	<servlet-mapping>
		<servlet-name>Faces Servlet</servlet-name>
		<url-pattern>*.xhtml</url-pattern>
	</servlet-mapping>
	<listener>
		<listener-class>com.sun.faces.config.ConfigureListener</listener-class>
	</listener>
</web-app>

5. JSF 2-Ausgabeskript-Demo

Der folgende Schnappschuss zeigt Ihnen ein laufendes Beispiel für die Verwendung der OutputScript-Komponente.

JSF 2-Ausgabeskriptbeispiel 2

(wpdm_file id=2)

Kommentar verfassen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Nach oben scrollen