How to import the Richfaces built in CSS to a jsf page.

[sandy4you]

Hi All,

I have defined a customer component called as dataScroller which works similar to the ExtendedDataTable data scroller and it uses the CSS for the build in data scroller.

So when this customer dataScroller is used on page which already has a Extended dataTable everything works fine.

But the same is used on the page where no dataTable is being used then I dont get the CSS for the dataScroller which I have defined.

How can I import the CSS explicitly.

Currently this is the code which I have written:

<h:head>

        <script type="text/javascript" src="/cc/javax.faces.resource/extendedDataTable.js.faces"> </script>

        <script type="text/javascript" src="/cc/javax.faces.resource/datascroller.js.faces"></script>

        <link type="text/css" href="/cc/rfRes/extendedDataTable.ecss.faces" rel="stylesheet"/>

        <link type="text/css" href="/cc/rfRes/datascroller.ecss.faces" rel="stylesheet"/>

        <link type="text/css" href="/cc/javax.faces.resource/superfish.css.faces" rel="stylesheet"/>

        <link type="text/css" href="/cc/javax.faces.resource/commonCSC.cssc450.css.faces" rel="stylesheet"/>

        <link type="text/css" href="/cc/javax.faces.resource/cc-gui.css.faces" rel="stylesheet"/>

</h:head>

But this is not working and Intellij Idea complains that "it cannot find the path".

Please help.

Thanks & Regards,

Sandy

[sandy4you]

HI All,

I also tried the following code:

     <h:head>

        <h:outputStylesheet library="org.richfaces" name="datascroller.ecss" />

        <h:outputStylesheet library="org.richfaces" name="datascroller.js" />

        <h:outputStylesheet library="org.richfaces" name="extendedDataTable.ecss" />

        <h:outputStylesheet library="org.richfaces" name="extendedDataTable.js" />

    </h:head>

But this also does not work.

Any help would be highly appreciated.

Thanks & Regards,

Sandy

[sandy4you]

Hi All,

I got the answer by trying the same code again and again at various places.

     <h:outputStylesheet library="org.richfaces" name="datascroller.ecss" />

    <h:outputStylesheet library="org.richfaces" name="datascroller.js" />

    <h:outputStylesheet library="org.richfaces" name="extendedDataTable.ecss" />

    <h:outputStylesheet library="org.richfaces" name="extendedDataTable.js" />

Please note that dont include in the <h:head> tag and just import it on the page after the xmlns definition.

Everything just works perfect.

Cheers,

Sandy