Добавление настраиваемых атрибутов к компонентам Autocomplete Primefaces в JSF

Я попросил передать атрибуты в другом вопросе и обнаружил, что могу создать собственный рендерер для компонента <p:autocomplete>, но проблема в том, что мой собственный рендеринг будет используется для каждого p: автозаполнения в моем проекте (на сайте). Поэтому я решил создать пользовательский компонент, который расширяет org.primefaces.component.autocomplete.AutoComplete и добавляет необходимые атрибуты в текстовое поле.

Моя первоначальная мысль заключалась в том, чтобы добавить конструктор, но он не работает, потому что в этот момент карта атрибута равна нулю:

@FacesComponent("com.mycomponents.SiteSearch")
public class SiteSearch extends AutoComplete {

    public SiteSearch() {
        Map<String,Object> attrs = getAttributes();
        attrs.put("x-webkit-speech", null); 
        attrs.put("x-webkit-grammer", "builtin:search");
        attrs.put("onwebkitspeechchange", "this.form.submit();");
        attrs.put("placeholder", "Enter a Search Term");
    }   
}

Моя другая мысль заключалась в том, чтобы оставить этот пользовательский компонент пустым (пустой класс), а затем указать собственный рендерер, который расширяет org.primefaces.component.autocomplete.AutoCompleteRenderer и изменяет там атрибуты.

После того, как все сказано и сделано, мне просто нужен способ сохранить эти атрибуты отдельно от этого текстового поля, поэтому просто поместить собственный рендеринг в p: autoComplete не будет работать (если, возможно, я не могу использовать renderType = attribute для этого p: autoComplete?).

Ответы

Ответ 1

Если вам нужен конкретный компонент, который использует другой рендер, чем <p:autoComplete>, то вы действительно не можете обойти создание настраиваемого компонента со своим семейством и типом компонента. Вы можете еще просто расширить PrimeFaces AutoComplete (и его рендерер), чтобы сохранить какой-то шаблонный код.

В пользовательском компоненте вам необходимо предоставить getters для этих атрибутов. Вы могли бы также хорошо указать сеттеры, таким образом, вы всегда можете переопределить значения по умолчанию со стороны представления. Эти получатели/сеттеры должны, в свою очередь, делегировать StateHelper.

Есть только небольшая проблема с атрибутами x-webkit-*. - является незаконным символом в Java-идентификаторах. Поэтому вам нужно переименовать getters/seters и немного изменить рендеринг, поскольку стандартный рендерер полагается на имя свойства компонента, точно такое же, как имя атрибута тега. Обновить. Я понимаю, что x-webkit-speech следует просто отображать как есть (так что не нужен геттер/сеттер) и что x-webkit-grammer на самом деле опечатка должна быть x-webkit-grammar.

Вот как выглядит компонент SiteSearch:

@FacesComponent(SiteSearch.COMPONENT_TYPE)
public class SiteSearch extends AutoComplete {

    public static final String COMPONENT_FAMILY = "com.example";
    public static final String COMPONENT_TYPE = "com.example.SiteSearch";

    private enum PropertyKeys {
        grammar, onspeechchange, placeholder
    }

    @Override
    public String getFamily() {
        return COMPONENT_FAMILY;
    }

    @Override
    public String getRendererType() {
        return SiteSearchRenderer.RENDERER_TYPE;
    }

    public String getGrammar() {
        return (String) getStateHelper().eval(PropertyKeys.grammar, "builtin:search");
    }

    public void setGrammar(String grammar) {
        getStateHelper().put(PropertyKeys.grammar, grammar);
    }

    public String getOnspeechchange() {
        return (String) getStateHelper().eval(PropertyKeys.onspeechchange, "submit()");
    }

    public void setOnspeechchange(String onspeechchange) {
        getStateHelper().put(PropertyKeys.onspeechchange, onspeechchange);
    }

    public String getPlaceholder() {
        return (String) getStateHelper().eval(PropertyKeys.placeholder, "Enter a Search Term");
    }

    public void setPlaceholder(String placeholder) {
        getStateHelper().put(PropertyKeys.placeholder, placeholder);
    }

}

Обратите внимание, что у получателей заданы все значения по умолчанию. Если eval() возвращает null, вместо этого будет возвращено значение по умолчанию. Я также немного нейтрализовал имена атрибутов, чтобы их можно было повторно использовать для любых будущих браузеров без веб-сайтов, просто изменив рендеринг соответственно.

И вот как выглядит рендерер SiteSearchRenderer для вышеуказанного компонента:

@FacesRenderer(
    componentFamily=SiteSearch.COMPONENT_FAMILY,
    rendererType=SiteSearchRenderer.RENDERER_TYPE
)
public class SiteSearchRenderer extends AutoCompleteRenderer {

    public static final String RENDERER_TYPE = "com.example.SiteSearchRenderer";

    @Override
    protected void renderPassThruAttributes(FacesContext facesContext, UIComponent component, String[] attrs) throws IOException {
        ResponseWriter writer = facesContext.getResponseWriter();
        writer.writeAttribute("x-webkit-speech", "x-webkit-speech", null);
        writer.writeAttribute("x-webkit-grammar", component.getAttributes().get("grammar"), "grammar");
        writer.writeAttribute("onwebkitspeechchange", component.getAttributes().get("onspeechchange"), "onspeechchange");
        writer.writeAttribute("placeholder", component.getAttributes().get("placeholder"), "placeholder");
        super.renderPassThruAttributes(facesContext, component, attrs);
    }

}

Чтобы использовать его в представлении, мы, конечно, должны зарегистрировать его как тег. Создайте файл /WEB-INF/my.taglib.xml:

<?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://example.com/ui</namespace>

    <tag>
        <tag-name>siteSearch</tag-name>
        <component>
            <component-type>com.example.SiteSearch</component-type>
            <renderer-type>com.example.SiteSearchRenderer</renderer-type>
        </component>
    </tag>
</facelet-taglib>

Обратите внимание, что вам больше не нужен <renderer> в faces-config.xml. Аннотация @FacesRenderer может просто выполнять свою работу на реальных пользовательских компонентах. Поэтому удалите запись <renderer> в faces-config.xml, созданную вами по предыдущему вопросу.

Теперь скажите JSF, что у вас есть пользовательский taglib по следующему параметру контекста в web.xml:

<context-param>
    <param-name>javax.faces.FACELETS_LIBRARIES</param-name>
    <param-value>/WEB-INF/my.taglib.xml</param-value>
</context-param>

Наконец, вы можете использовать его следующим образом:

<html ... xmlns:my="http://example.com/ui">
...
<my:siteSearch />

Вы даже можете указать дополнительные атрибуты, которые будут переопределять значения по умолчанию, установленные в компоненте:

<my:siteSearch grammar="builtin:language" onspeechchange="alert('peek-a-boo')" placeholder="Search" />

Для автозаполнения IDE для атрибутов вам нужно указать каждый из них как отдельный <attribute> в объявлении <tag> в my.taglib.xml.