Home | Tutorials | Smart-Cloud | Smart-EIS | License | FAQ | Contact

Last Updated: March 25, 2021

Smart-Cloud Web project simplifies building Java database driven web applications based on JSF and PrimeFaces and JPA. This example will create CRUD (Create, Read, Update, Delete) operations of Person information.

All the following components could be generated with few clicks using Cloud-Wizard Low-Code No-Code platform.

Usage:

  1. Create Maven project with the following 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 https://maven.apache.org/xsd/maven-4.0.0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<groupId>com.jalalkiswani</groupId>
	<version>4.0.4</version>
	<artifactId>smart-cloud-web-jpa-example</artifactId>
	<packaging>war</packaging>
	<properties>
		<smart-cloud.version>4.0.8</smart-cloud.version>
	</properties>
	<dependencies>
		<dependency>
			<groupId>com.jalalkiswani</groupId>
			<artifactId>smart-cloud-webstack</artifactId>
			<version>${smart-cloud.version}</version>
		</dependency>
		<dependency>
			<groupId>com.jalalkiswani</groupId>
			<artifactId>smart-cloud-standalone</artifactId>
			<version>${smart-cloud.version}</version>
			<scope>provided</scope>
		</dependency>
	</dependencies>
	<build>
		<plugins>
			<plugin>
				<groupId>org.apache.maven.plugins</groupId>
				<artifactId>maven-compiler-plugin</artifactId>
				<version>3.8.1</version>
				<configuration>
					<source>1.8</source>
					<target>1.8</target>
				</configuration>
			</plugin>
			<plugin>
				<groupId>org.apache.maven.plugins</groupId>
				<artifactId>maven-war-plugin</artifactId>
				<version>3.2.3</version>
				<configuration>
					<failOnMissingWebXml>false</failOnMissingWebXml>
				</configuration>
			</plugin>
		</plugins>
	</build>
</project>

If you are using Eclipse, be sure to refresh your project (select your project→ right click→ Maven→ Update Project)

  1. [Optional] Create config file at src/main/resources/config.properties with the following contents:

hibernate.connection.driver_class = org.h2.Driver
hibernate.connection.url = jdbc:h2:file:./h2db.data
hibernate.dialect = org.hibernate.dialect.H2Dialect

hibernate.connection.username=sa
hibernate.connection.password=sa

hibernate.hbm2ddl.auto=update
db-entities-packages=com.app
  1. Create Model class in src/main/java/com/person/Model.java with the following contents:

package com.app.person;

import java.io.Serializable;
import javax.persistence.*;

@Entity
@Table(name="person")
public class Model implements Serializable {

	@Id
	@GeneratedValue(strategy = GenerationType.IDENTITY)
	@Column(name="id")
	private Integer id;

	@Column(name="national_id")
	private String nationalId;

	@Column(name="name")
	private String name;

	@Column(name="email")
	private String email;

	@Column(name="address")
	private String address;


	public void setId(Integer id){
	  this.id=id;
	}

	public Integer getId(){
	 return this.id;
	}

	public void setNationalId(String nationalId){
	  this.nationalId=nationalId;
	}

	public String getNationalId(){
	 return this.nationalId;
	}

	public void setName(String name){
	  this.name=name;
	}

	public String getName(){
	 return this.name;
	}

	public void setEmail(String email){
	  this.email=email;
	}

	public String getEmail(){
	 return this.email;
	}

	public void setAddress(String address){
	  this.address=address;
	}

	public String getAddress(){
	 return this.address;
	}


	@Override
	public boolean equals(Object obj) {
	  if (obj == null) {
		return false;
	  }
	  return this.getId().equals(((Model) obj).getId());
	}

	@Override
	public int hashCode() {
	  if(this.id==null) {
	    return toString().hashCode();
	   }
	  return this.id.hashCode();
	}

	@Override
	public String toString(){
	  StringBuffer buf=new StringBuffer();
	  buf.append(this.id).append(",");
	  buf.append(this.nationalId).append(",");
	  buf.append(this.name).append(",");
	  buf.append(this.email).append(",");
	  buf.append(this.address).append(",");
	  return buf.toString();
	}
}
  1. Create controller (JSF Managed Bean) at src/main/java/com/app/person/Controller.java with the following contents:

package com.app.person;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;

import com.jk.webstack.controllers.JKManagedBeanWithOrmSupport;

@ManagedBean(name = "controller")
@ViewScoped
public class Controller extends JKManagedBeanWithOrmSupport<Model> {
}
  1. Create JSF XHTML Page at src/main/webapp/index.xhtml class with the following contents:

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://xmlns.jcp.org/jsf/facelets" xmlns:h="http://xmlns.jcp.org/jsf/html"
	xmlns:f="http://xmlns.jcp.org/jsf/core" xmlns:p="http://primefaces.org/ui">
<h:head>
	<title>Smart-Cloud Demo</title>
</h:head>
<h:body>
	<h:form id="frmModel">
		<p:autoUpdate />
		<p:panelGrid columns="4" style="margin:auto;" styleClass="shaddow">
			<f:facet name="header">Person Form</f:facet>

			<p:outputLabel value="National Id" for="nationalId" />
			<p:inputText type="text" value="#{controller.model.nationalId}" id="nationalId" placeholder="NationalId" />

			<p:outputLabel value="Name" for="name" />
			<p:inputText type="text" value="#{controller.model.name}" id="name" placeholder="Name" />

			<p:outputLabel value="Email" for="email" />
			<p:inputText type="text" value="#{controller.model.email}" id="email" placeholder="Email" />

			<p:outputLabel value="Address" for="address" />
			<p:inputText type="text" value="#{controller.model.address}" id="address" placeholder="Address" />
			<f:facet name="footer">
				<div align="center">
					<p:commandButton value="Add" action="#{controller.add}" rendered="#{controller.allowAdd}" process="@form" />
					<p:commandButton value="Edit" action="#{controller.edit}" rendered="#{controller.allowEdit}" process="@this" />
					<ui:remove>
						<p:commandButton value="Duplicate" action="#{mbGenerator.duplicate()}" rendered="#{mbGenerator.allowEdit}" process="@this" />
					</ui:remove>
					<p:commandButton value="Save" action="#{controller.save}" rendered="#{controller.allowSave}" process="@form" />
					<p:commandButton value="Delete" action="#{controller.delete}" rendered="#{controller.allowDelete}" process="@this" />
					<p:commandButton value="Reset" action="#{controller.reset}" rendered="#{controller.allowReset}" process="@this" />
					<p:commandButton value="Fill" action="#{controller.fill}" rendered="#{controller.allowFill}" process="@this" />
					<p:commandButton value="Cancel Edit" action="#{controller.cancelEdit()}" rendered="#{controller.editMode}" process="@this" />
				</div>
			</f:facet>

		</p:panelGrid>
	</h:form>
	<hr />
	<h:form>
		<p:dataTable value="#{controller.modelList}" var="model" rowKey="#{model.id}" paginator="true" paginatorAlwaysVisible="false"
			paginatorPosition="bottom" selectionMode="single" filteredValue="#{controller.filterList}" selection="#{controller.model}" emptyMessage=""
			rowIndexVar="row" styleClass="shaddow">
			<p:ajax event="rowSelect" />
			<p:autoUpdate />
			<f:facet name="header">Person Data Table</f:facet>
			<p:column headerText="#">#{row+1}</p:column>
			<p:column headerText="national Id" sortBy="#{model.nationalId}" filterBy="#{model.nationalId}" filterMatchMode="contains">
				<h:outputText value="#{model.nationalId==null?'-':model.nationalId}" />
			</p:column>
			<p:column headerText="name" sortBy="#{model.name}" filterBy="#{model.name}" filterMatchMode="contains">
				<h:outputText value="#{model.name==null?'-':model.name}" />
			</p:column>
			<p:column headerText="email" sortBy="#{model.email}" filterBy="#{model.email}" filterMatchMode="contains">
				<h:outputText value="#{model.email==null?'-':model.email}" />
			</p:column>
			<p:column headerText="address" sortBy="#{model.address}" filterBy="#{model.address}" filterMatchMode="contains">
				<h:outputText value="#{model.address==null?'-':model.address}" />
			</p:column>
		</p:dataTable>
	</h:form>
</h:body>

</html>
  1. Create App class in src/main/java/com/app/App.java with the following contents:

package com.app;

import com.jk.web.embedded.JKWebApplication;

public class App {
	public static void main(String[] args) {
		JKWebApplication.run();
	}


}

Thats it, now run your App class, in few seconds your browser will open and you should see something like this:

Output

Full example source-code can be found at https://github.com/smartapi-com/smart-cloud-web-jpa


Home | Tutorials | Smart-Cloud | Smart-EIS | License | FAQ | Contact