Behavior CSS selector in p:dataTable !

[neijunior]

Hello !

Consider the following example:

Code: Select all

<p:dataTable id="dtbCars"
             widgetVar="wgvDtbCar"
             value="#{mbTest.listCars}"
             var="car"
             selection="#{mbTest.car}"
             selectionMode="single">

    <f:facet name="header">
        <table>
            <tbody>
                <tr>
                    <td style="text-align: left;">
                        <h:outputText value="List Cars"/>
                    </td>
                    <td style="text-align: right;">
                        <h:panelGroup>
                            <h:outputText value="Filter"/>
                            <h:inputText id="globalFilter"
                                         onkeyup="wgvDtbCar.filter()"
                                         style="width:250px"/>
                        </h:panelGroup>
                    </td>
                </tr>
            </tbody>
        </table>
    </f:facet>

    <p:column headerText="Car"
                    filterBy="#{car}">
        <h:outputText value="#{car}"/>
    </p:column>

</p:dataTable>

Within the "f:facet name=header " i created a "table" to be able to put a text in left and the input filter on the right.
But when a "p:dataTable" with this option "selectionMode=single", the "table" of "facet" assumes the same of CSS of the "p:dataTable" PrimeFaces. It is as if it were possible to select the facet.

This would be a problem

[neijunior]

Is this a problem

[bumble.bee]

Sounds like the cascading part of cascading style sheets is at work.

You probably want to override the styles by adding more specific selectors and possibly using the !important thingy (it's a technical term ).

[neijunior]

Hello bumble.bee

Sorry, but I did not understand his answer.

Briefly I want that the "table" that I put in the "facet" not get the css "p:datatable". How do I do this
In my opinion the correct thing to "table" not inherit the css of the "p:datatable".

[cagatay.civici]

Any subtable placed in p:dataTable will inherit styles from p:dataTable, if you think this doesn't make sense, we can improve it, why not.

[cagatay.civici]

For 2.3, though, I don't want to change these before 2.2. release.

[neijunior]

Hello Optimus.prime.

Thanks for the reply.

Just to make an example of what happens, here's a screenshot of the table.




As for improvement, I must open the issue?

Thanks.

[cagatay.civici]

No, we haven't decided what to do so an issue is not needed at the moment. I think you need to play with css not to inherit stuff from p:dataTable to solve your issue. Firebug can help.

[neijunior]

Ok

Thanks.