jsf - PrimeFaces does not render -

primefaces not render though renders example code (i borrowed code primefaces website).

<ui:fragment xmlns="http://www.w3.org/1999/xhtml"     xmlns:h="http://java.sun.com/jsf/html"     xmlns:f="http://java.sun.com/jsf/core"     xmlns:ui="http://java.sun.com/jsf/facelets"     xmlns:p="http://primefaces.org/ui"     xmlns:c="http://java.sun.com/jsp/jstl/core"     xmlns:pe="http://primefaces.org/ui/extensions">   <div style="height:500px">     <h:form>         <p:growl id="msgs" showdetail="true" />          <p:dashboard id="board" model="#{dashboardview.model}">             <p:ajax event="reorder" listener="#{dashboardview.handlereorder}" update="msgs" />              <p:panel id="sports" header="sports">                 <h:outputtext value="sports content" />             </p:panel>              <p:panel id="finance" header="finance">                 <h:outputtext value="finance content" />             </p:panel>              <p:panel id="lifestyle" header="lifestyle">                 <h:outputtext value="lifestyle content"  />             </p:panel>              <p:panel id="weather" header="weather">                 <h:outputtext value="weather content" />             </p:panel>              <p:panel id="politics" header="politics">                 <h:outputtext value="politics content" />             </p:panel>         </p:dashboard>          <div style="clear:both" />     </h:form> </div> </ui:fragment> 

here .java part of it: need use such drag drop dashboards, if cant figure out problem please recommend me js can examples.

package tr.com.solveka.plantmet.web.station;  import java.io.serializable; import javax.annotation.postconstruct; import javax.faces.application.facesmessage; import javax.faces.bean.managedbean; import javax.faces.bean.viewscoped; import javax.faces.context.facescontext;  import org.primefaces.event.closeevent; import org.primefaces.event.dashboardreorderevent; import org.primefaces.event.toggleevent; import org.primefaces.model.dashboardcolumn; import org.primefaces.model.dashboardmodel; import org.primefaces.model.defaultdashboardcolumn; import org.primefaces.model.defaultdashboardmodel; @managedbean(name="dashboardview") @viewscoped public class dashboardview implements serializable {      private static final long serialversionuid = 1l;     private dashboardmodel model;      @postconstruct     public void init() {         model = new defaultdashboardmodel();         dashboardcolumn column1 = new defaultdashboardcolumn();         dashboardcolumn column2 = new defaultdashboardcolumn();         dashboardcolumn column3 = new defaultdashboardcolumn();          column1.addwidget("sports");         column1.addwidget("finance");          column2.addwidget("lifestyle");         column2.addwidget("weather");          column3.addwidget("politics");          model.addcolumn(column1);         model.addcolumn(column2);         model.addcolumn(column3);     }      public void handlereorder(dashboardreorderevent event) {         facesmessage message = new facesmessage();         message.setseverity(facesmessage.severity_info);         message.setsummary("reordered: " + event.getwidgetid());         message.setdetail("item index: " + event.getitemindex() + ", column index: " + event.getcolumnindex() + ", sender index: " + event.getsendercolumnindex());          addmessage(message);     }      public void handleclose(closeevent event) {         facesmessage message = new facesmessage(facesmessage.severity_info, "panel closed", "closed panel id:'" + event.getcomponent().getid() + "'");          addmessage(message);     }      public void handletoggle(toggleevent event) {         facesmessage message = new facesmessage(facesmessage.severity_info, event.getcomponent().getid() + " toggled", "status:" + event.getvisibility().name());          addmessage(message);     }      private void addmessage(facesmessage message) {         facescontext.getcurrentinstance().addmessage(null, message);     }      public dashboardmodel getmodel() {         return model;     } } 

you can not run ui:fragment without using html frame or template.

<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:ui="http://java.sun.com/jsf/facelets"       xmlns:p="http://primefaces.org/ui">     <h:head>     </h:head>     <h:body>         <!--here code-->         <div style="height:500px">             <h:form>                 .....             </h:form>         </div>     </h:body> </html>    

how use jsf teampalte?