根据自动完成值动态更新primefaces组件

时间:2015-02-03 02:31:18

标签: jsf primefaces autocomplete

有人可以解释如何使用自动完成组件更新视图中的某个组件(例如:dataScroller,dataList等)吗?我正在尝试使用ajax事件" itemSelect"但如果没有成功继续下去,任何例子,解释,光都将是一个很好的帮助。

一些代码(xhtml页面)

<h:form id="frmPesquisarModalidade">
    <p:autoComplete id="autoModalidade" multiple="true" value="#{matriculaBean.modalidadesSelecionadas}" completeMethod="#{matriculaBean.completeModalidade}"
        var="modalidade" itemLabel="#{modalidade.nome}" itemValue="#{modalidade}" forceSelection="true">
        <f:converter binding="#{modalidadeConverter}"/>
        <f:ajax listener="#{matriculaBean.onItemSelect}" event="itemSelect" render="test"/>
        <p:column style="width:10%">
            <h:outputText value="#{modalidade.nome}"/>
        </p:column>
    </p:autoComplete>
    <p:dataScroller id="dataScrollModalidadesSelecionadas" value="#{matriculaBean.modalidadesSelecionadas}" var="modalidade" chunkSize="6">
        <h:panelGrid columns="2" cellpadding="5" id="test">
            <h:outputText value="#{modalidade.nome}"/>
        </h:panelGrid>
    </p:dataScroller>
</h:form>

支持豆

@Named
@ViewScoped
public class MatriculaBean {

private List<Modalidade> modalidadesDisponiveis;
private List<Modalidade> modalidadesSelecionadas;

@Autowired
private ServicoModalidade servicoModalidade;

@PostConstruct
private void init(){
    modalidadesDisponiveis = servicoModalidade.listar();
}

public List<Modalidade> completeModalidade(String busca) {
    List<Modalidade> filtrados = new ArrayList<Modalidade>();
    for (Modalidade mod : modalidadesDisponiveis) {
        if (mod.getNome().contains(busca)) {filtrados.add(mod);}
    }
    return filtrados;
}

public void onItemSelect(SelectEvent event){
    //????????
}

2 个答案:

答案 0 :(得分:1)

您需要在onItemSelect方法中执行的操作是根据所选项目更新目标组件的值。

如果您想更新dataScrollModalidadesSelecionadas

public void onItemSelect(SelectEvent event){
     //Get the selected item value
     Modalidade m = new Modalidade();
     m = event.getObject();
     //Create/use a List method which can search the DB based on the selected item
     modalidadesDisponiveis = servicoModalidade.listarPorModalidade(m);
}

在JSF中,您只需更新目标组件:

<p:autoComplete ...... >
    <p:ajax listener="#{matriculaBean.onItemSelect}" event="itemSelect" update="dataScrollModalidadesSelecionadas"/>
</p:autoComplete>

我不确定您定义的那些选项和属性是否会按预期工作,但上面的示例是基于ItemSelect更新组件的基础知识。 另外,我更喜欢使用<p:ajax>而不是<f:ajax>

答案 1 :(得分:0)

        <h:form id="frmPesquisarModalidade">
                    <p:autoComplete id="autoModalidade" multiple="true" value="#{matriculaBean.modalidadesSelecionadas}" completeMethod="#{matriculaBean.completeModalidade}"
                    var="modalidade" itemLabel="#{modalidade.nome}" itemValue="#{modalidade}" forceSelection="true">
                        <f:converter binding="#{modalidadeConverter}"/>
                        <p:ajax event="itemSelect" update="dataScrollModalidadesSelecionadas"/>
                        <p:column style="width:10%">
                            <h:outputText value="#{modalidade.nome}"/>
                        </p:column>
                    </p:autoComplete>
                    <p:dataScroller id="dataScrollModalidadesSelecionadas" value="#{matriculaBean.modalidadesSelecionadas}" var="modalidade" chunkSize="6">
                        <h:panelGrid columns="2" cellpadding="5">
                            <h:outputText value="#{modalidade.nome}"/>
                        </h:panelGrid>
                    </p:dataScroller>
                </h:form>

解决!!!为了解决我的问题,我发现没有必要在itemSelect事件中应用支持bean逻辑...只需在xhtml页面中创建一个ajax事件,并使用具有相应id的update属性!谢谢你的帮助