template.xhtml
Agregamos al template funciones java script que actualizaran los componentes.
En este caso colocamos el ultimo mensaje
Actualizamos las etiquetas e invocamos el <:remotecommand>
<script type="text/javascript">
function socketListener(message, channel, event) {
document.getElementById("websocketidTopText").innerHTML = message;
document.getElementById("websocketidTopText2").innerHTML = message;
myFormRC();
waitForLoad();
}
</script>
<script name="jquery/jquery.js" library="primefaces" target="head" ></script>Agregamos un <h:form> con el componente Websocket
<h:form>
<f:websocket channel="clock" onmessage="socketListener" />
</h:form>Código completo
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html>
<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:b="http://bootsfaces.net/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:jmoordbjsf="http://jmoordbjsf.com/taglib">
<h:head>
<f:facet name="first">
<f:view locale="#{jmoordbLanguajes.locale !=null?jmoordbLanguajes.locale:'es'}"></f:view>
<f:loadBundle basename="com.properties.messages" var="msg" />
<f:loadBundle basename="com.jmoordbutils.properties.application" var="app" />
</f:facet>
<title>#{msg['application.shorttitle']}</title>
<meta name="author" content="Aristides Villarreal" />
<meta name="description" content="BootsFaces, a powerful JSF framework that takes the best from Bootstrap and jQuery UI to let develop well-designed state-of-the-art next-gen Front-end Enterprise Applications fast and easy supporting HTML5." />
<meta name="KEYWORDS" content="jsf, bootstrap, framework, java, enterprise, server, faces, jquery, usability, next-gen, web, html5, easy, modern, well-designed, website, state-of-the-art" />
<meta name="robots" content="index, follow" />
<jmoordbjsf:metatemplate/>
<jmoordbjsf:csstemplate/>
<style>.tooltip-inner {
max-width: 350px;
/* If max-width does not work, try using width instead */
width: 350px;
}</style>
<script type="text/javascript">
function socketListener(message, channel, event) {
document.getElementById("websocketid_topText").innerHTML = message;
document.getElementById("websocketid_topText2").innerHTML = message;
}
</script>
</h:head>
<h:body style="padding-top: 85px;padding-bottom: 85px;" >
<jmoordbjsf:jstemplate/>
<h:form>
<f:websocket channel="clock" onmessage="socketListener" />
</h:form>
<ui:insert name="nbtop">
<ui:include src="/layout/top.xhtml"/>
</ui:insert>
<b:container >
<ui:insert name="content"/>
</b:container>
<ui:insert name="nbtop">
<ui:include src="/layout/footer.xhtml"/>
</ui:insert>
</h:body>
</html>
Last updated