blob: 8dabd022bf8605d8729837cf5cdb4ef60c567b6e [file] [log] [blame]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Apache TomEE</title>
<meta name="description"
content="Apache TomEE is a lightweight, yet powerful, JavaEE Application server with feature rich tooling." />
<meta name="keywords" content="tomee,asf,apache,javaee,jee,shade,embedded,test,junit,applicationcomposer,maven,arquillian" />
<meta name="author" content="Luka Cvetinovic for Codrops" />
<link rel="icon" href="../../favicon.ico">
<link rel="icon" type="image/png" href="../../favicon.png">
<meta name="msapplication-TileColor" content="#80287a">
<meta name="theme-color" content="#80287a">
<link rel="stylesheet" type="text/css" href="../../css/normalize.css">
<link rel="stylesheet" type="text/css" href="../../css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="../../css/owl.css">
<link rel="stylesheet" type="text/css" href="../../css/animate.css">
<link rel="stylesheet" type="text/css" href="../../fonts/font-awesome-4.1.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="../../fonts/eleganticons/et-icons.css">
<link rel="stylesheet" type="text/css" href="../../css/jqtree.css">
<link rel="stylesheet" type="text/css" href="../../css/idea.css">
<link rel="stylesheet" type="text/css" href="../../css/cardio.css">
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-2717626-1']);
_gaq.push(['_setDomainName', 'apache.org']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body>
<div class="preloader">
<img src="../../img/loader.gif" alt="Preloader image">
</div>
<nav class="navbar">
<div class="container">
<div class="row"> <div class="col-md-12">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">
<span>
<img src="../../img/logo-active.png">
</span>
Apache TomEE
</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right main-nav">
<li><a href="../../docs.html">Documentation</a></li>
<li><a href="../../community/index.html">Community</a></li>
<li><a href="../../security/security.html">Security</a></li>
<li><a href="../../download-ng.html">Downloads</a></li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div></div>
</div>
<!-- /.container-fluid -->
</nav>
<div id="main-block" class="container main-block">
<div class="row title">
<div class="col-md-12">
<div class='page-header'>
<h1>JSF Application that uses managed-bean and ejb</h1>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<p>This is a simple web-app showing how to use dependency injection in JSF managed beans using TomEE.</p>
<p>It contains a Local Stateless session bean <code>CalculatorImpl</code> which adds two numbers and returns the result. The application also contains a JSF managed bean <code>CalculatorBean</code>, which uses the EJB to add two numbers and display the results to the user. The EJB is injected in the managed bean using <code>@EJB</code> annotation.</p>
<h2>A little note on the setup:</h2>
<p>You could run this in the latest Apache TomEE <a href="https://repository.apache.org/content/repositories/snapshots/org/apache/openejb/apache-tomee/">snapshot</a></p>
<p>As for the libraries, myfaces-api and myfaces-impl are provided in tomee/lib and hence they should not be a part of the war. In maven terms, they would be with scope 'provided'</p>
<p>Also note that we use servlet 2.5 declaration in web.xml</p>
<pre><code>&lt;web-app xmlns:xsi=&quot;http://www.w3.org/2001/XMLSchema-instance&quot;
xmlns=&quot;http://java.sun.com/xml/ns/javaee&quot;
xmlns:web=&quot;http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd&quot;
xsi:schemaLocation=&quot;http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd&quot;
version=&quot;2.5&quot;&gt;
</code></pre>
<p>And we use 2.0 version of faces-config</p>
<p>&lt;faces-config xmlns="http://java.sun.com/xml/ns/javaee"<br/> xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"<br/> xsi:schemaLocation="http://java.sun.com/xml/ns/javaee<br/> <a href="http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd">http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd</a>"<br/> version="2.0"&gt;</p>
<p>The complete source code is provided below but let's break down to look at some smaller snippets and see how it works.</p>
<p>We'll first declare the <code>FacesServlet</code> in the <code>web.xml</code></p>
<pre><code> &lt;servlet&gt;
&lt;servlet-name&gt;Faces Servlet&lt;/servlet-name&gt;
&lt;servlet-class&gt;javax.faces.webapp.FacesServlet&lt;/servlet-class&gt;
&lt;load-on-startup&gt;1&lt;/load-on-startup&gt;
&lt;/servlet&gt;
</code></pre>
<p><code>FacesServlet</code> acts as the master controller.</p>
<p>We'll then create the <code>calculator.xhtml</code> file.</p>
<pre><code> &lt;h:outputText value=&#39;Enter first number&#39;/&gt;
&lt;h:inputText value=&#39;#{calculatorBean.x}&#39;/&gt;
&lt;h:outputText value=&#39;Enter second number&#39;/&gt;
&lt;h:inputText value=&#39;#{calculatorBean.y}&#39;/&gt;
&lt;h:commandButton action=&quot;#{calculatorBean.add}&quot; value=&quot;Add&quot;/&gt;
</code></pre>
<p>Notice how we've use the bean here. By default it is the simple class name of the managed bean.</p>
<p>When a request comes in, the bean is instantiated and placed in the appropriate scope. By default, the bean is placed in the request scope.</p>
<pre><code> &lt;h:inputText value=&#39;#{calculatorBean.x}&#39;/&gt;
</code></pre>
<p>Here, getX() method of calculatorBean is invoked and the resulting value is displayed. x being a Double, we rightly should see 0.0 displayed.</p>
<p>When you change the value and submit the form, these entered values are bound using the setters in the bean and then the commandButton-action method is invoked.</p>
<p>In this case, <code>CalculatorBean#add()</code> is invoked.</p>
<p><code>Calculator#add()</code> delegates the work to the ejb, gets the result, stores it<br/>and then instructs what view is to be rendered.</p>
<p>You're right. The return value "success" is checked up in faces-config navigation-rules and the respective page is rendered.</p>
<p>In our case, <code>result.xhtml</code> page is rendered.</p>
<p>The request scoped <code>calculatorBean</code> is available here, and we use EL to display the values.</p>
<h2>Source</h2>
<h2>Calculator</h2>
<pre><code>package org.superbiz.jsf;
import javax.ejb.Local;
@Local
public interface Calculator {
public double add(double x, double y);
}
</code></pre>
<h2>CalculatorBean</h2>
<pre><code>package org.superbiz.jsf;
import javax.ejb.EJB;
import javax.faces.bean.ManagedBean;
@ManagedBean
public class CalculatorBean {
@EJB
Calculator calculator;
private double x;
private double y;
private double result;
public double getX() {
return x;
}
public void setX(double x) {
this.x = x;
}
public double getY() {
return y;
}
public void setY(double y) {
this.y = y;
}
public double getResult() {
return result;
}
public void setResult(double result) {
this.result = result;
}
public String add() {
result = calculator.add(x, y);
return &quot;success&quot;;
}
}
</code></pre>
<h2>CalculatorImpl</h2>
<pre><code>package org.superbiz.jsf;
import javax.ejb.Stateless;
@Stateless
public class CalculatorImpl implements Calculator {
public double add(double x, double y) {
return x + y;
}
}
</code></pre>
<h1>web.xml</h1>
<pre><code>&lt;?xml version=&quot;1.0&quot;?&gt;
&lt;web-app xmlns:xsi=&quot;http://www.w3.org/2001/XMLSchema-instance&quot;
xmlns=&quot;http://java.sun.com/xml/ns/javaee&quot;
xmlns:web=&quot;http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd&quot;
xsi:schemaLocation=&quot;http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd&quot;
version=&quot;2.5&quot;&gt;
&lt;description&gt;MyProject web.xml&lt;/description&gt;
&lt;!-- Faces Servlet --&gt;
&lt;servlet&gt;
&lt;servlet-name&gt;Faces Servlet&lt;/servlet-name&gt;
&lt;servlet-class&gt;javax.faces.webapp.FacesServlet&lt;/servlet-class&gt;
&lt;load-on-startup&gt;1&lt;/load-on-startup&gt;
&lt;/servlet&gt;
&lt;!-- Faces Servlet Mapping --&gt;
&lt;servlet-mapping&gt;
&lt;servlet-name&gt;Faces Servlet&lt;/servlet-name&gt;
&lt;url-pattern&gt;*.jsf&lt;/url-pattern&gt;
&lt;/servlet-mapping&gt;
&lt;!-- Welcome files --&gt;
&lt;welcome-file-list&gt;
&lt;welcome-file&gt;index.jsp&lt;/welcome-file&gt;
&lt;welcome-file&gt;index.html&lt;/welcome-file&gt;
&lt;/welcome-file-list&gt;
&lt;/web-app&gt;
</code></pre>
<h2>Calculator.xhtml</h2>
<pre><code>&lt;?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?&gt;
&lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot;
&quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;&gt;
&lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;
xmlns:f=&quot;http://java.sun.com/jsf/core&quot;
xmlns:h=&quot;http://java.sun.com/jsf/html&quot;&gt;
&lt;h:body bgcolor=&quot;white&quot;&gt;
&lt;f:view&gt;
&lt;h:form&gt;
&lt;h:panelGrid columns=&quot;2&quot;&gt;
&lt;h:outputText value=&#39;Enter first number&#39;/&gt;
&lt;h:inputText value=&#39;#{calculatorBean.x}&#39;/&gt;
&lt;h:outputText value=&#39;Enter second number&#39;/&gt;
&lt;h:inputText value=&#39;#{calculatorBean.y}&#39;/&gt;
&lt;h:commandButton action=&quot;#{calculatorBean.add}&quot; value=&quot;Add&quot;/&gt;
&lt;/h:panelGrid&gt;
&lt;/h:form&gt;
&lt;/f:view&gt;
&lt;/h:body&gt;
&lt;/html&gt;
</code></pre>
<h2>Result.xhtml</h2>
<pre><code>&lt;?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?&gt;
&lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot;
&quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;&gt;
&lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;
xmlns:f=&quot;http://java.sun.com/jsf/core&quot;
xmlns:h=&quot;http://java.sun.com/jsf/html&quot;&gt;
&lt;h:body&gt;
&lt;f:view&gt;
&lt;h:form id=&quot;mainForm&quot;&gt;
&lt;h2&gt;&lt;h:outputText value=&quot;Result of adding #{calculatorBean.x} and #{calculatorBean.y} is #{calculatorBean.result }&quot;/&gt;&lt;/h2&gt;
&lt;h:commandLink action=&quot;back&quot;&gt;
&lt;h:outputText value=&quot;Home&quot;/&gt;
&lt;/h:commandLink&gt;
&lt;/h:form&gt;
&lt;/f:view&gt;
&lt;/h:body&gt;
&lt;/html&gt;
</code></pre>
<h1>faces-config.xml</h1>
<pre><code>&lt;?xml version=&quot;1.0&quot;?&gt;
&lt;faces-config xmlns=&quot;http://java.sun.com/xml/ns/javaee&quot;
xmlns:xsi=&quot;http://www.w3.org/2001/XMLSchema-instance&quot;
xsi:schemaLocation=&quot;http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd&quot;
version=&quot;2.0&quot;&gt;
&lt;navigation-rule&gt;
&lt;from-view-id&gt;/calculator.xhtml&lt;/from-view-id&gt;
&lt;navigation-case&gt;
&lt;from-outcome&gt;success&lt;/from-outcome&gt;
&lt;to-view-id&gt;/result.xhtml&lt;/to-view-id&gt;
&lt;/navigation-case&gt;
&lt;/navigation-rule&gt;
&lt;navigation-rule&gt;
&lt;from-view-id&gt;/result.xhtml&lt;/from-view-id&gt;
&lt;navigation-case&gt;
&lt;from-outcome&gt;back&lt;/from-outcome&gt;
&lt;to-view-id&gt;/calculator.xhtml&lt;/to-view-id&gt;
&lt;/navigation-case&gt;
&lt;/navigation-rule&gt;
&lt;/faces-config&gt;
</code></pre>
</div>
</div>
</div>
<footer>
<div class="container">
<div class="row">
<div class="col-sm-6 text-center-mobile">
<h3 class="white">Be simple. Be certified. Be Tomcat.</h3>
<h5 class="light regular light-white">"A good application in a good server"</h5>
<ul class="social-footer">
<li><a href="https://www.facebook.com/ApacheTomEE/"><i class="fa fa-facebook"></i></a></li>
<li><a href="https://twitter.com/apachetomee"><i class="fa fa-twitter"></i></a></li>
<li><a href="https://plus.google.com/communities/105208241852045684449"><i class="fa fa-google-plus"></i></a></li>
</ul>
</div>
<div class="col-sm-6 text-center-mobile">
<div class="row opening-hours">
<div class="col-sm-3 text-center-mobile">
<h5><a href="../../latest/docs/" class="white">Documentation</a></h5>
<ul class="list-unstyled">
<li><a href="../../latest/docs/admin/configuration/index.html" class="regular light-white">How to configure</a></li>
<li><a href="../../latest/docs/admin/file-layout.html" class="regular light-white">Dir. Structure</a></li>
<li><a href="../../latest/docs/developer/testing/index.html" class="regular light-white">Testing</a></li>
<li><a href="../../latest/docs/admin/cluster/index.html" class="regular light-white">Clustering</a></li>
</ul>
</div>
<div class="col-sm-3 text-center-mobile">
<h5><a href="../../latest/examples/" class="white">Examples</a></h5>
<ul class="list-unstyled">
<li><a href="../../latest/examples/simple-cdi-interceptor.html" class="regular light-white">CDI Interceptor</a></li>
<li><a href="../../latest/examples/rest-cdi.html" class="regular light-white">REST with CDI</a></li>
<li><a href="../../latest/examples/ejb-examples.html" class="regular light-white">EJB</a></li>
<li><a href="../../latest/examples/jsf-managedBean-and-ejb.html" class="regular light-white">JSF</a></li>
</ul>
</div>
<div class="col-sm-3 text-center-mobile">
<h5><a href="../../community/index.html" class="white">Community</a></h5>
<ul class="list-unstyled">
<li><a href="../../community/contributors.html" class="regular light-white">Contributors</a></li>
<li><a href="../../community/social.html" class="regular light-white">Social</a></li>
<li><a href="../../community/sources.html" class="regular light-white">Sources</a></li>
</ul>
</div>
<div class="col-sm-3 text-center-mobile">
<h5><a href="../../security/index.html" class="white">Security</a></h5>
<ul class="list-unstyled">
<li><a href="http://apache.org/security" target="_blank" class="regular light-white">Apache Security</a></li>
<li><a href="http://apache.org/security/projects.html" target="_blank" class="regular light-white">Security Projects</a></li>
<li><a href="http://cve.mitre.org" target="_blank" class="regular light-white">CVE</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="row bottom-footer text-center-mobile">
<div class="col-sm-12 light-white">
<p>Copyright &copy; 1999-2016 The Apache Software Foundation, Licensed under the Apache License, Version 2.0. Apache TomEE, TomEE, Apache, the Apache feather logo, and the Apache TomEE project logo are trademarks of The Apache Software Foundation. All other marks mentioned may be trademarks or registered trademarks of their respective owners.</p>
</div>
</div>
</div>
</footer>
<!-- Holder for mobile navigation -->
<div class="mobile-nav">
<ul>
<li><a hef="../../latest/docs/admin/index.html">Administrators</a>
<li><a hef="../../latest/docs/developer/index.html">Developers</a>
<li><a hef="../../latest/docs/advanced/index.html">Advanced</a>
<li><a hef="../../community/index.html">Community</a>
</ul>
<a href="#" class="close-link"><i class="arrow_up"></i></a>
</div>
<!-- Scripts -->
<script src="../../js/jquery-1.11.1.min.js"></script>
<script src="../../js/owl.carousel.min.js"></script>
<script src="../../js/bootstrap.min.js"></script>
<script src="../../js/wow.min.js"></script>
<script src="../../js/typewriter.js"></script>
<script src="../../js/jquery.onepagenav.js"></script>
<script src="../../js/tree.jquery.js"></script>
<script src="../../js/highlight.pack.js"></script>
<script src="../../js/main.js"></script>
</body>
</html>