Question

我有2个AutoUpdates。第一个是接收国名。然后它执行自动完成。

选择项目后，第二个自动完成设置为readonly =＆＃34; false＆＃34;通过EL内部的XHTML。

它工作正常，直到我回到第一个AutoComplete并清空当前值。所需的行为是清除第二个自动完成并使其只读=＆＃34; true＆＃34;，但它没有发生。会发生的事情是第二次自动完成保留其值为readonly =＆＃34; false＆＃34;。

如何解决这个问题？

我的XHTML

<!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:p="http://primefaces.org/ui"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:a4j="http://richfaces.org/a4j"
    xmlns:rich="http://richfaces.org/rich"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets">

<h:head></h:head>
<ui:debug rendered="true" hotkey="X" />
<body>
    <h:form id="searchAddressForm" prependId="true">
        <p:growl id="msgs" showDetail="true" />

        <h:panelGrid columns="2" style="margin-bottom:10px" cellpadding="5">
            <p:outputLabel for="autoCompleteCountry" value="Country" />

            <p:autoComplete id="autoCompleteCountry"
                forceSelection="true"
                dropdown="true"
                var="selectedCountry" 
                itemValue="#{selectedCountry}"
                itemLabel="#{selectedCountry.nicename}"
                value="#{addressReadController.selectedCountry}" 
                minQueryLength="3" queryDelay="1000"
                completeMethod="#{addressReadController.completeCountry}"
                converter="#{countryConverter}">
                <p:ajax event="itemSelect" listener="#{addressReadController.handleCountrySelect}" update="msgs autoCompleteState"/>
            </p:autoComplete>

            <p:outputLabel for="autoCompleteState" value="State" />
            <p:autoComplete id="autoCompleteState" forceSelection="true" disabled="#{empty addressReadController.selectedCountry}"
                dropdown="true"
                var="selectedState" 
                itemValue="#{selectedState}"
                itemLabel="#{selectedState.name}"
                value="#{addressReadController.selectedState}" 
                minQueryLength="3" queryDelay="1000"
                completeMethod="#{addressReadController.completeState}"
                converter="#{stateConverter}">
                <p:ajax event="itemSelect"
                    listener="#{addressReadController.handleStateSelect}" update="msgs"/>
            </p:autoComplete>

        </h:panelGrid>
    </h:form>
</body>
</html>

我的控制器

import java.io.Serializable;
import java.util.List;

import javax.ejb.EJB;
import javax.faces.application.FacesMessage;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.faces.context.FacesContext;
import javax.faces.event.PhaseEvent;

import org.primefaces.event.SelectEvent;
import org.primefaces.event.UnselectEvent;

import my.package.ejb.AddressEJB;
import my.package.ejb.AddressTypeEJB;
import my.package.ejb.CityEJB;
import my.package.ejb.CountryEJB;
import my.package.ejb.SiteTypeEJB;
import my.package.ejb.StateEJB;
import my.package.entity.AddressType;
import my.package.entity.City;
import my.package.entity.Country;
import my.package.entity.SiteType;
import my.package.entity.State;

@ViewScoped
@ManagedBean
public class AddressReadController implements Serializable{
    /**
     * 
     */
    private static final long serialVersionUID = 2224053530553846981L;

    @EJB
    private CountryEJB countryEJB;

    @EJB
    private StateEJB stateEJB;

    @EJB
    private CityEJB cityEJB;

    @EJB
    private SiteTypeEJB siteTypeEJB;

    @EJB
    private AddressTypeEJB addressTypeEJB;

    @EJB
    private AddressEJB addressEJB;

    private Country selectedCountry = null;

    private State selectedState = null;

    private AddressType selectedAddressType = null;

    private City selectedCity = null;

    private SiteType selectedSiteType = null;

    private String selectedComplement = null;

    private Integer selectedNumber = null;

    private String selectedStreetName = null;

    private String selectedZipCode = null;

    /*
     * Begin of AJAX event handlers
     */

    public void handleCountrySelect(SelectEvent e) {
        selectedCountry = (Country) e.getObject();
        selectedState = null; 
        addMessage(selectedCountry.getNicename() + " selected");
    }

    public void handleCountryUnSelect(UnselectEvent e) {
        selectedCountry = (Country) e.getObject();
        addMessage(selectedCountry.getNicename() + " selected");
    }

    public void handleStateSelect(SelectEvent e) {
        selectedState = (State) e.getObject();
        addMessage(selectedState.getName() + " selected");
    }

    public void handleStateUnSelect(UnselectEvent e) {
        selectedState = (State) e.getObject();
        addMessage(selectedState.getName() + " selected");
    }

    public void phaseListener(PhaseEvent e) {
        List<FacesMessage> messages = e.getFacesContext().getMessageList();
        System.out.println(messages.size());
    }

    public List<Country> completeCountry(String query) {
        return countryEJB.findByStartingChars(query);
    }

    public List<State> completeState(String query) {
        return stateEJB.findByStartingChars(query, selectedCountry);
    }

    public void addMessage(String summary) {
        FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO,
                summary, null);
        FacesContext.getCurrentInstance().addMessage(null, message);
    }   
    /*
     * End of AJAX event handlers
     */

    public State getSelectedState() {
        return selectedState;
    }

    public void setSelectedState(State selectedState) {
        this.selectedState = selectedState;
    }

    public void onCountryChange() {
        this.selectedState = new State();
        this.selectedCity = new City();
    }

    public String getSelectedComplement() {
        return selectedComplement;
    }

    public void setSelectedComplement(String selectedComplement) {
        this.selectedComplement = selectedComplement;
    }

    public Integer getSelectedNumber() {
        return selectedNumber;
    }

    public void setSelectedNumber(Integer selectedNumber) {
        this.selectedNumber = selectedNumber;
    }

    public Country getSelectedCountry() {
        return selectedCountry;
    }

    public void setSelectedCountry(Country selectedCountry) {
        this.selectedCountry = selectedCountry;
    }

    public City getSelectedCity() {
        return selectedCity;
    }

    public void setSelectedCity(City selectedCity) {
        this.selectedCity = selectedCity;
    }

    public AddressType getSelectedAddressType() {
        return selectedAddressType;
    }

    public void setSelectedAddressType(AddressType selectedAddressType) {
        this.selectedAddressType = selectedAddressType;
    }

    public SiteType getSelectedSiteType() {
        return selectedSiteType;
    }

    public void setSelectedSiteType(SiteType selectedSiteType) {
        this.selectedSiteType = selectedSiteType;
    }

    public String getSelectedStreetName() {
        return selectedStreetName;
    }

    public void setSelectedStreetName(String selectedStreetName) {
        this.selectedStreetName = selectedStreetName;
    }

    public String getSelectedZipCode() {
        return selectedZipCode;
    }

    public void setSelectedZipCode(String selectedZipCode) {
        this.selectedZipCode = selectedZipCode;
    }

}

Answer 1

第二个p:autoComplete的更新是<p:ajax event="itemSelect" .../>，但此操作涉及项目选择。当您返回并清除输入时，您没有选择任何项目，因此该操作将不会调用，也不会更新第二个p:autoComplete。

这个小脚本对我有用。它的作用是 - 它在输入失去焦点后触发itemSelect事件，但仅在它为空时触发：

<script>
$(document).on("blur", "#searchAddressForm\\:autoCompleteCountry_input", function () {
    if ($(this).val().length == 0) {
        $(this).trigger("itemSelect");
    }
});
</script>

在ID之后注意_input，这是从PrimeFaces生成的输入，作为span组件生成的p:autoComplete的子项。

编辑：

或者将onblur属性添加到自动填充和调用功能。

<p:autoComplete id="autoCompleteCountry" onblur="itemSelectionOnClear(this)" />

<script>
    function itemSelectionOnClear(autoComplete) {
        if($(autoComplete).val().length == 0) {
            $(autoComplete).trigger("itemSelect");
        }
    }
</script>

在PrimeFaces 5.2中测试

如何在另一个autoupdate输入值设置为null后进行自动更新和自动更新？

1 个答案: