Search code examples
jqueryanimationprimefacesprimefaces-datatable

Can the PrimeFaces rowExpansion animation be controlled / disabled?

In PrimeFaces (I'm using 4.0) you are able to have a dataTable with expandable rows. Basically you have a p:rowToggler button which toggles the p:rowExpansion. This works fine, but I really hate the fade animation on the row expansion content, which makes the toggling feel sluggish (especially when closing a row expansion).

Is there any way to control / disable the fade animation? It doesn't seem there are attributes on p:rowToggler or p:rowExpansion to control this behavior.

Solution

  • Row expansion is handled by the Javascript code at:

    WEB-INF/classes/META-INF/resources/primefaces/primefaces.js

    at the line starting with:

    PrimeFaces.widget.DataTable

    If you reformat the code it will be readable.

    There is one usage of fadeIn and one of fadeOut. Both don't take an options object, so configuring it is out of the question.

    You could do a hack to disable the animation by:

    1. copying the file from primefaces-x.x.jar at META-INF/resources/primefaces/primefaces.js to your project and

    2. replacing

      1. fadeIn( with fadeIn(0, and
      2. fadeOut(function( with fadeOut(0,function(

      on the line starting with PrimeFaces.widget.DataTable and, most important,

    3. repeat this process each time you upgrade PrimeFaces :(

    I've created an issue for this at PrimeFaces.
    See https://code.google.com/p/primefaces/issues/detail?id=6775

    Update

    I just received a response on issue 6775:

    Due to issues like 7380, we had to disable animation.