Java Tutorial Blog

PrimeFaces Clock Example

//  by 

Primefaces provides a time component for taking the time from the user by using the Clock component. Clock displays server or client date time live. When it comes for displaying the server time, the Clock component provides AutoSync feature in server mode that can sync the clock with the server periodically.

1. Clock Tag Info

Primefaces Clock General Info

2. Clock Tag Attributes

Primefaces Clock Attributes

3. The View

index.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"
	xmlns:p="http://primefaces.org/ui">
	<h:head>
		<script name="jquery/jquery.js" library="primefaces"></script>
	</h:head>
	<f:view>
		<h:form prependId="false">
			<h1>JavaBeat Primefaces Example</h1>
			<h2>Primefaces - Clock</h2>
			<p:clock mode="server" pattern="HH:mm:ss dd-MM-yyyy"></p:clock>
		</h:form>
	</f:view>
</html>

4. PrimeFaces Clock Demo

The below snapshot shows you the clock component, and how it’s rendered.

Primefaces Clock Example

[wpdm_file id=74]

About Amr Mohammed