專注於第一個組件<p:dialog>

Question

我有一個JSF頁面，當我點擊我顯示的元素<p:dialog>。

頁代碼：

<ui:composition xmlns="http://www.w3.org/1999/xhtml" 
xmlns:h="http://java.sun.com/jsf/html" 
xmlns:f="http://java.sun.com/jsf/core" 
xmlns:ui="http://java.sun.com/jsf/facelets" 
xmlns:p="http://primefaces.org/ui" 
xmlns:c="http://java.sun.com/jsp/jstl/core"> 

<h:form id="userCV" styleClass="bodyStyle"> 
    ....button here to show the dialog 
    </h:form> 
<p:dialog header="ESPERIENZA PROFESSIONALE" widgetVar="detailEspPro" 
    resizable="true" position="center" 
    showEffect="clip" closable="false"> 

    <ui:include src="/dialog/detailEspPro.xhtml" /> 
</p:dialog> 
</ui:composition> 

對話框detailEspPro.xhtml：

<ui:composition xmlns="http://www.w3.org/1999/xhtml" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:p="http://primefaces.org/ui"> 

    <h:form id="detailEspProForm"> 

     <p:blockUI block="detailEspProForm" widgetVar="blockDetailEspProForm" /> 

     <h:panelGrid columns="2" styleClass="detailInfoPersoStyle" border="0"> 

      <p:column> 
       <h:outputText value="Da: " /> 
       <p:calendar value="#{userPage.candidato.datanascita}" lang="it" navigator="true" mask="true" pattern="dd/MM/yyyy" placeholder="dd/MM/yyyy"/> 
      </p:column> 

      <p:column> 
       <h:outputText value="A: " /> 
       <p:calendar value="#{userPage.candidato.datanascita}" lang="it" navigator="true" mask="true" pattern="dd/MM/yyyy" placeholder="dd/MM/yyyy"/> 
      </p:column> 
      <p:column> 
      </p:column> 
     </h:panelGrid> 

     <h:panelGrid columns="2"> 

      <p:commandButton value="Save" icon="ui-icon-check" onclick="PF('blockDetailEspProForm').show();" oncomplete="PF('blockDetailEspProForm').hide();PF('detailEspPro').hide(); PF('blockForm').hide();" actionListener="#{userPage.saveChange()}" update=":userCV"/> 


      <p:commandButton value="Annulla" icon="ui-icon-cancel" label="Annulla" 
       onclick="PF('detailEspPro').hide();" 
       oncomplete="PF('blockForm').hide();" update=":userCV @form" actionListener="#{userPage.annullaModifica()}"/> 
     </h:panelGrid> 

    </h:form> 


</ui:composition> 

問題：

當示出了用於第一次的對話框中，第一組分是像這樣聚焦：

但I'de想要撤消的焦點，像這樣：（當你用鼠標點擊了組件，你可以得到它）

我認爲這個問題是在<p:dialog>不在第一個組件中;在我的情況是<p:calendar>，我已經厭倦了把一個inputText的作爲第一要素，它的重點是這樣的：

<p:inputText value="ali sghaier" /> 

結果（鼠標在字符串「阿里sghaier」的第一個位置）：

我優選AUTOMATIQUE選擇的位置在串

的端部

我使用：

JSF 2.2.5

PrimeFaces 5

Answer 1

其實這是jQuery的用戶界面對話框，其中已被固定在一個jQuery UI 1.10.0mbug。

你有多種方式來解決這個問題，我個人更喜歡這一個， 只是包含這個形式的開頭：

<span class="ui-helper-hidden-accessible"> 
    <input type="text" aria-hidden="true" /> 
</span> 

或者

，你可以在文檔中執行此。就緒

$.ui.dialog.prototype._focusTabbable = function(){}; 

更多

• Prevent jQuery UI dialog from setting focus to first textbox