Problem creating custom components in JSF

Question

Problem creating custom components in JSF

Navigation

#1 by (1 votes)

1

I'm having trouble creating custom components in JSF, it's actually the first time.

I found some guides on the internet but it did not work.

What I did was the following.

I created custom.taglib.xml inside the folder WEB-INF and its content is this.

<?xml version="1.0" encoding="UTF-8"?>

<facelet-taglib>
    <namespace>http://paradigma.ecred2/facelets</namespace>
    <tag>
        <tag-name>btnHelp</tag-name>
        <source>tags\btn-help.xhtml</source>    
    </tag>
</facelet-taglib>

Inside the resources folder, I created the file btn-help.xhtml with the following content.

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:cc="http://xmlns.jcp.org/jsf/composite"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://primefaces.org/ui">

    <cc:interface>
        <cc:attribute name="hint" />
    </cc:interface>

    <cc:implementation>
        <p>#{cc.attrs.hint}</p>
    </cc:implementation>

</html>

And finally inside the page where I want to use this component, it follows the heading.

<ui:composition template="/template/common/pagelayout.xhtml"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:c="http://xmlns.jcp.org/jsp/jstl/core"
    xmlns:p="http://primefaces.org/ui"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
    xmlns:ez="http://xmlns.jcp.org/jsf/composite"
    xmlns:sec="http://www.springframework.org/security/facelets/tags"
    xmlns:ecred="http://paradigma.ecred2/facelets/tags">

And the component call

<ecred:btnHelp hint="Teste"/>

The problem is that the component is not being rendered, and I do not know what might be happening. The idea is to make components that are simpler for example.

Make a help button that already loads a certain image and the developer only passes the text.

<p:graphicImage url="#{resource['images:help-icon.png']}" title="#{cc.attrs.hint}"/>

Thank you

jsf jsf-2.2

asked by anonymous 26.11.2014 / 14:32

1 answer

Visual Studio 2010 Outline Extension How to get the current date with angularJS with refresh on date?

score 1 · Accepted Answer

Custom Components

I made an implementation some time ago and I was able to do the following:

I put my components in the src/main/webapp/resources/component-base/ directory. Note that the project follows the Maven directory structure, so adapt to its structure if necessary.

I imported the components of that directory through the xmlns:mycomp="http://java.sun.com/jsf/composite/component-base"

Ready! Now just use the tags, their names being the same as the names of their respective files .xhtml .

The URL http://java.sun.com/jsf/composite/ is special and tells JSF to search the files in that directory.

Custom Functions

In this same project I also created some utilitarian functions.

First I created the file src/main/webapp/WEB-INF/commons.taglib.xml with the content something like this:

<?xml version="1.0" encoding="UTF-8"?>
<facelet-taglib 
    xmlns="http://java.sun.com/xml/ns/javaee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facelettaglibrary_2_0.xsd"
    version="2.0">
    <namespace>http://empresa.com.br/functions</namespace>

    <function>
        <function-name>acesso</function-name>
        <function-class>br.com.empresa.commons.Functions</function-class>
        <function-signature>boolean acesso(java.lang.String)</function-signature>
    </function>
    <function>
        <function-name>acessoItem</function-name>
        <function-class>br.com.empresa.commons.Functions</function-class>
        <function-signature>boolean acessoItem(java.lang.String, java.lang.String, java.lang.String)</function-signature>
    </function>
</facelet-taglib>

Implemented the function class with static methods, as in the following example:

package br.com.empresa.commons;

/**
 * Funções de taglib JSF para verificar a permissão individual de componentes das telas.
 */
public final class Functions {

    public static boolean acesso(String nome) {
        ...
    }

    public static boolean acessoItem(String prefixoSistema, String nome, String item) {
        ...
    }

}

Then I imported the functions with the declaration 'xmlns: fn="http://company.com.br/functions" and I used it in EL expressions like this:

<p:commandButton
                 id="botaoEditar"
                 styleClass="botao-editar"
                 icon="icon-edit" 
                 ajax="false"
                 immediate="true"
                 disabled="#{not fn:acessoItem('privilegio-alterar')}">