jsf - Primefaces datatable header searchbox breaks table layout -


i have realy strange behavior if place components inside datatable header.

code table

<p:datatable id="grouptable" var="group" value="#{profile.user.groups}"                              widgetvar="grouptable" rows="10" paginator="true"                              paginatorposition="bottom"                              paginatortemplate="{currentpagereport} {firstpagelink} {previouspagelink} {pagelinks} {nextpagelink} {lastpagelink} {rowsperpagedropdown}"                              rowsperpagetemplate="5,10,20,40,80"                              emptymessage="keine einträge mit den gewünschten kriterien gefunden"                              filteredvalue="#{groupview.filteredgroups}" sortmode="multiple"                              resizablecolumns="true" liveresize="true">     <f:facet name="header">         <h:outputtext value="zugeordnete gruppen" />         <p:outputpanel style="float:left;">             <p:inputtext id="globalfilter" onkeyup="pf('grouptable').filter()" style="width:150px;" placeholder="suche"/>         </p:outputpanel>     </f:facet>      <p:column headertext="gruppenname" filterby="#{group.name}"                               sortby="#{group.name}" filtermatchmode="contains"                               filterstyle="display:none" style="width:150px">         <h:outputtext value="#{group.name}"/>     </p:column>      <p:column headertext="beschreibung" filterby="#{group.beschreibung}"                               sortby="#{group.beschreibung}" filtermatchmode="contains"                               filterstyle="display:none">          <h:outputtext value="#{group.beschreibung}"/>      </p:column> </p:datatable> 

you can find generated html here jsfiddle

on page looks this: page

so problem code? why serach box destroy table layout?

okay found it. maybe someday facing same problem.

the searchbox big in line text. if change inputtext size , set outputpanel inline looks intended.

<f:facet name="header">     <h:outputtext value="zugeordnete gruppen" />     <p:outputpanel style="display:inline">         <p:inputtext id="globalfilter" onkeyup="pf('grouptable').filter()" style="width:150px;height:10px;float:left" placeholder="suche"/>     </p:outputpanel> </f:facet> 

Comments

Popular posts from this blog

html - Outlook 2010 Anchor (url/address/link) -

javascript - Why does running this loop 9 times take 100x longer than running it 8 times? -

Getting gateway time-out Rails app with Nginx + Puma running on Digital Ocean -