java - p:datatable - loosing focus on p:selectOneMenu -


i have started primefaces , i'm struggling 1 problem: have datatable different components (like inputtexts , selectonemenus) , wanted able switch next cell whenever tab key pressed. works fine until cell selectonemenu, in situation focus disappears...

i created following dummy datatable different oneselectmenu scenarios, this:

<p:datatable id="newtable" value="#{benefdetails.beneficiaries.beneficiarylist}" var="beneficiary" editable="true" editmode="cell"                                  >                 <p:ajax event="celledit" listener="#{benefdetails.oncelledit}" update="@form:messages @form:benfrepresentative @form:donebutton" />          <p:column id="column1" headertext="with tag h instead of p on selectonemenu">                                                                <p:celleditor>                 <f:facet name="output">                     <h:outputtext value="#{beneficiary.lista.selectedvalue}" styleclass="required" />                  </f:facet>                  <f:facet name="input">                     <h:selectonemenu id="sel1"  onfocus="feelit(this.id)"                        value="#{beneficiary.lista.selectedkey}" filter="true"   filtermatchmode="contains" required="true" editable="true">                         <f:selectitem itemlabel=" " itemvalue=" " />                             <f:selectitems                                 value="#{beneficiary.lista.possiblevalues}"                                 var="selection" itemvalue="#{selection.key}"                                 itemlabel="#{selection.value}" />                             </h:selectonemenu>                 </f:facet>             </p:celleditor>         </p:column>          <p:column id="column2" headertext="without faces , cell editor">             <p:selectonemenu id="sel2" value="#{beneficiary.relatives.selectedkey}"  onfocus="feelit(this.id)"              filter="true" filtermatchmode="contains" editable="true">                 <f:selectitem itemlabel=" " itemvalue=" " />                     <f:selectitems                          value="#{beneficiary.relatives.possiblevalues}"                         var="selection" itemvalue="#{selection.key}"                         itemlabel="#{selection.value}" />             </p:selectonemenu>                                                                   </p:column>          <p:column id="column3" headertext="with faces , cell editor">             <p:celleditor>                 <f:facet name="output">                     <h:outputtext value="#{beneficiary.lista.selectedvalue}" styleclass="required" />                 </f:facet>                  <f:facet name="input">                     <p:selectonemenu id="sel3"  onfocus="feelit(this.id)"                         value="#{beneficiary.lista.selectedkey}" filter="true"                         filtermatchmode="contains"   required="true" editable="true">                             <f:selectitem itemlabel=" " itemvalue=" " />                                 <f:selectitems                                     value="#{beneficiary.lista.possiblevalues}"                                     var="selection" itemvalue="#{selection.key}"                                     itemlabel="#{selection.value}" />                     </p:selectonemenu>                 </f:facet>             </p:celleditor>         </p:column>      </p:datatable> 

on datatable i'm able tab without problem until reaches 3rd column (this implementation been used right now):

  • on 1 column copied , pasted had on 3rd , changed p:selectonemenu h:selectonemenu. worked in other hand i'm not able edit , search options;
  • on 2 column maintain h:selectonemenu removed p:celleditor , f:facet. worked in other hand needed validation on output lost.

note: added onfocus event on oneselectmenus, first called...

could guys me out this? need tab without problem 3rd scenario.

another question do: how can implement datatable cell navigation using keyboard arrows?

thanks in advance!

kind regards.


Comments

Popular posts from this blog

javascript - Create a stacked percentage column -

Optimising Firebase database by automatically overwriting data -

javascript - Angular UI-Grid customTemplate directive causing rows to load slowly/? -