June 23, 2016

Just one Elastic applet?

Oracle introduced wonderful elastic list applets with IP16,  this feature shrinks list applet size if there are no or less records needs to be displayed. However this doesn't always looks nice, specially in MVG applets and pick applets.
Default Elastic Applets in IP16
This feature can be turned off by setting "Enable Elastic Grid" system preference, but it is turned off for entire application. That makes me think is there any way we can make only one applet as elastic applet?  Answer is yes :)

Neel on Siebel Unleashed published beautiful trick to back port elastic applets into IP15. Absolutely splendid! This trick can be extended to make only few applets Elastic. 

To make all list applets Elastic add following in custom CSS file:
.ui-jqgrid-bdiv{max-height:340px !important; height:auto !important;}
To make only one applet Elastic (After turning of the system preference) add following CSS :
div[title="Line Items List Applet"] div.ui-jqgrid-bdiv { height: auto !important}

By preceding another div selector to the CSS rule we can instruct browser to apply CSS style only if applet name is : "Line Items List Applet". One can use this trick to change other UI attributes for specific applets and apply different styling.

Happy Styling :)


  1. Glad you like it muddana, cheers!

  2. Hi,

    Thank you for this article.

    I have a query. In IP2014, the below code does not work:

    div[title="Order Entry - Order List Applet (Sales)"] div.ui-jqgrid-bdiv { height: auto !important}

    Do we need to do something different for IP2014?

    Thanks in advance.