Primefaces 6和materialprime - 小部件不可用:selectOne

时间:2016-12-01 15:32:02

标签: javascript jsf primefaces material-design

我试图将materialprime移植到primefaces 6.我已经更新了小部件以使用core.js和components.js,但是我在渲染materialprime时遇到了问题。 selectOne也没有渲染,jsf selectOneMenu也不会只渲染priemfaces SelectOneMenu,控制台说:

  

小部件不可用:selectOne

有什么想法吗?

这是与selectOne相关的4个文件的代码:

MaterialWidgetBuilder.java:

public class MaterialWidgetBuilder extends WidgetBuilder {

    private static final String KEY = MaterialWidgetBuilder.class.getName();

    public static MaterialWidgetBuilder getInstance(final FacesContext context) {

        MaterialWidgetBuilder wb = (MaterialWidgetBuilder) context.getExternalContext().getRequestMap().get(KEY);

        if (wb == null) {
            wb = new MaterialWidgetBuilder(context);

            context.getExternalContext().getRequestMap().put(KEY, wb);
        }

        return wb;
    }


    public MaterialWidgetBuilder(FacesContext context) {
        super(context);
    }

    protected WidgetBuilder init(String widgetClass, String widgetVar, String id, String resourcePath, boolean endFunction) throws IOException {
        this.endFunction = endFunction;

        context.getResponseWriter().write("MaterialPrime.cw(\"");
        context.getResponseWriter().write(widgetClass);
        context.getResponseWriter().write("\",\"");
        context.getResponseWriter().write(widgetVar);
        context.getResponseWriter().write("\",{");
        context.getResponseWriter().write("id:\"");
        context.getResponseWriter().write(id);
        if (widgetVar == null) {
            context.getResponseWriter().write("\"");
        } else {
            context.getResponseWriter().write("\",widgetVar:\"");
            context.getResponseWriter().write(widgetVar);
            context.getResponseWriter().write("\"");
        }

        return this;
    }



}

SelectOne.java:

@ResourceDependencies({
    @ResourceDependency(library = "primefaces", name = "jquery/jquery.js"),
        @ResourceDependency(library = "primefaces", name="core.js"),
    @ResourceDependency(library = "primefaces", name="components.js"),
    @ResourceDependency(library = "material-prime", name = "libs/materialize.css"),
    @ResourceDependency(library = "material-prime", name = "libs/materialize.js"),
    @ResourceDependency(library = "material-prime", name = "core/material-prime.js"),
    @ResourceDependency(library = "material-prime", name = "core/material-prime.css"),
    @ResourceDependency(library = "material-prime", name = "selectone/selectOne.js")
})

public class SelectOne extends SelectOneMenu{
    public static final String COMPONENT_TYPE = "org.primefaces.material.component.SelectOne";

    protected enum PropertyKeys {
        nativeMode
    }

    public SelectOne() {
        setRendererType(SelectOneRenderer.RENDERER_TYPE);
    }

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

    public boolean isNativeMode(){
        return (Boolean) getStateHelper().eval(PropertyKeys.nativeMode,false);
    }

    public void setNativeMode(boolean nativeMode){
        getStateHelper().put(PropertyKeys.nativeMode, nativeMode);
    }

}

SelectOneRenderer.java:

public class SelectOneRenderer extends InputRenderer {
public static final String RENDERER_TYPE = "org.primefaces.material.component.SelectOneRenderer";

@Override
public void decode(FacesContext context, UIComponent component) {
    SelectOne selectOne = (SelectOne) component;

    if(selectOne.isDisabled()) {
        return;
    }

    decodeBehaviors(context, selectOne);

    String clientId = selectOne.getClientId(context);
    String submittedValue = (String) context.getExternalContext().getRequestParameterMap().get(clientId + "_input");

    if(submittedValue!=null){
        selectOne.setSubmittedValue(submittedValue);    
    }       
}

@Override
public void encodeEnd(FacesContext context, UIComponent component) throws IOException {
    SelectOne selectOne = (SelectOne) component;

    encodeMarkup(context, selectOne);
    encodeScript(context, selectOne);
}

private void encodeMarkup(FacesContext context, SelectOne selectOne) throws IOException {
    ResponseWriter writer = context.getResponseWriter();

    String inputId = selectOne.getClientId() + "_input";

    List<SelectItem> selectItems = getSelectItems(context, selectOne);

    writer.startElement("div", selectOne);
        writer.writeAttribute("class", "input-field", null);                

        writer.startElement("select", selectOne);
            writer.writeAttribute("class", getSelectClass(selectOne), null);    
            writer.writeAttribute("id", inputId, null); 
            writer.writeAttribute("name", inputId, null);   

            for (SelectItem selectItem : selectItems) {
                writer.startElement("option", null);
                    if(selectItem.getValue().equals(selectOne.getValue())){
                        writer.writeAttribute("selected", "selected", null);
                    }
                    writer.writeAttribute("value", selectItem.getValue(),null);
                    writer.write(selectItem.getLabel());
                writer.endElement("option");    
            }
        writer.endElement("select");                

    writer.endElement("div");               

}

private String getSelectClass(SelectOne selectOne) {
    String toReturn = "";
    if(selectOne.isNativeMode()){
        toReturn += " browser-default ";
    }

    return toReturn;
}

private void encodeScript(FacesContext context, SelectOne selectOne) throws IOException {
    String clientId = selectOne.getClientId();
    String widgetVar = selectOne.resolveWidgetVar();

    WidgetBuilder wb = MaterialWidgetBuilder.getInstance(context);

    wb.initWithDomReady("SelectOne", widgetVar, clientId);
    wb.attr("widgetName", widgetVar);
    encodeClientBehaviors(context, selectOne);

    wb.finish();

}

}

SelectOne.js

MaterialPrime.widget.SelectOne = PrimeFaces.widget.BaseWidget.extend({
    init : function(cfg) {
        this._super(cfg);
        this.input = jQuery(this.jqId+"_input");
        var that = this;

        this.input.material_select();

        this.input.on("change",function(){
            if(that.cfg.behaviors && that.cfg.behaviors.valueChange) {
                that.cfg.behaviors.valueChange.call(that.input);
            }
        });
    }
});

0 个答案:

没有答案