如何在p:对话框中将焦点设置为inputttext

Question

我想把重点放在第二个inputText上，只有当第一个inputText不是空的时候p:dialog显示，我试过这个，但我试过这个，但不工作…

        <p:dialog   showEffect="fade" appendToBody="true" onShow="cambioFoco();"  modal="false"  header="Change Password" width="450" height="300" widgetVar="dlgC">
            <h:form id="formCambio" >
                <p:panel id="panelMessages1" style="width:95%; height: 50px; margin: 0 auto;" widgetVar="aaa">
                    <p:messages for="messages1" id="messages1" severity="warn,error" showDetail="true" autoUpdate="true" showSummary="false"  closable="true" /> 
                    <p:growl for="messages2" severity="info" globalOnly="true" id="msgCorrecto" showDetail="true" sticky="false" life="2500" />
                </p:panel>

                <h:panelGrid  id="panelCambio" columns="3"  style="margin-top: 30px;margin-left: 40px; text-align: right; position: relative">
                    <p:outputLabel value="CCT:"/>
                    <p:inputText  id="txtcCct" value="#{login.cct}" required="true" validatorMessage="*CCT: 10 Caracteres" requiredMessage="*CCT: Valor requerido" maxlength="10" binding="#{cambioCController.cctfield}" style="text-transform: uppercase;">       
                        <f:validateLength minimum="10"/>
                    </p:inputText>    
                    <h:outputText value=""/>  
                    <p:outputLabel value="Password"  />
                    <p:password id="txtCPass"  required="true"  requiredMessage="*PASSWORD: Valor requerido"  maxlength="13" binding="#{cambioCController.passfield}" />
                    <h:outputText value=""/>                    
                    <p:outputLabel value="Nuevo Password" style="font-weight: bold" />
                    <p:password id="txtNPass" required="true"  requiredMessage="*NUEVO PASSWORD: Valor requerido" validatorMessage="*PASSWORD Solo letras y numeros, minimo 6 caracteres" maxlength="13" binding="#{cambioCController.newpassfield}" widgetVar="hola">
                        <f:validateRegex pattern="^([0-9A-Za-z]{5,13})$" />
                    </p:password>
                    <h:outputText value=""/>
                    <p:outputLabel value="Confirmar Password" style="font-weight: bold" />
                    <p:password id="txtCNPass" required="true"  requiredMessage="*CONFIRMACIÓN: Valor requerido" maxlength="13" binding="#{cambioCController.confirmpassfield}">
                        <f:validator validatorId="custom.cmpNewPassConfPass" /> 
                    </p:password>
                    <h:outputText value=""/>
                    <p:outputLabel/>
                    <p:commandButton value="Aceptar" validateClient="true" actionListener="#{cambioCController.cambio()}" onclick="resetPass();" update="panelMessages1" icon="ui-icon-check" style="text-align: right"/>
                </h:panelGrid>
            </h:form>
        </p:dialog>

        <h:form id="formLogin" >
            <p:panel id="panelMessages2"  style="width:100%; height: 50px; margin-bottom: 57px !important; " widgetVar="error">     
                <p:messages id="messages3" severity="error" showDetail="true" showSummary="false" autoUpdate="true" closable="true" globalOnly="false" /> 
            </p:panel>
            <p:panelGrid columns="1" style="margin: auto auto">
                <p:outputLabel value="Acceso" style="margin-left: 45%"/>
                <p:inputText id="txtCct" required="true" maxlength="10" validatorMessage="*CCT No valido" requiredMessage="*CCT Requerido" value="#{login.cct}"   binding="#{loginController.cctfield}" placeholder="CCT" style="width: 70%; float: right;text-transform: uppercase;" >
                    <f:validateRegex pattern="21[a-zA-Z]{3}[0-9]{4}[a-zA-Z]$" />  
                </p:inputText>
                <p:password id="txtPass" required="true" requiredMessage="*PASSWORD Requerido" maxlength="13"  binding="#{loginController.passfield}"  placeholder="PASSWORD" style="width: 70%;margin: 0 auto; float: right" />
                <p:commandButton  value="Entrar" validateClient="true" action="#{loginController.login}"  onclick="resetear();"  update="panelMessages2, @form :formCambio" style="float: right; font-size: 15px" icon="ui-icon-key"/>
            </p:panelGrid>
        </h:form>

这是我的java代码，这里我显示p:dialog:

    public String login() {
        FacesContext facesContext = FacesContext.getCurrentInstance();
        RequestContext rContext = RequestContext.getCurrentInstance();
        if (p.equals(lb.getLogin(c))) {
                 //Do something 
            if (c.equals(p)) {
                rContext.execute("PF(dlgC.show());");
                facesContext.addMessage("messages1", new FacesMessage(FacesMessage.SEVERITY_WARN, "", "Change your password"));
                return null;
            } else {
                return "success";
            }
        } else {
            facesContext.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_ERROR, "ERROR ", "CCT or Password incorrect"));
            return null;
        }
    }

这是我的javascript

function cambioFoco(){
    var cct = document.getElementById("formCambio:txtcCct").value;
    if(cct.length > 0){
        document.getElementById("formCambio:txtCPass").focus();
    }
}

Answer 1

您需要将代码放在setTimeout调用中(延迟为1)，这将强制您的代码在下一次中断时执行。

所以你的onshow将被修改为

onShow="setTimeout('cambioFoco()',1);"

你也可以改进你的javascript函数，如下所示

function cambioFoco(){    
    if($("#formCambio\:txtcCct").val().trim()!=''){
         $("#formCambio\:txtCPass").focus();
    }    
}