Oracle Applications E-Learning Lab

  CSS -- INLINE  .email-red-box {   background-color: #ffcdd2;   color: #b71c1c;   font-weight: bold;   padding: 6px 10px;   border-radius: 4px;   text-align: center; } .email-green-box {   background-color: #c8e6c9;   color: #1b5e20;   font-weight: bold;   padding: 6px 10px;   border-radius: 4px;   text-align: center; } SELECT     hou.name,     cust_mail.party_name,      cust_mail.account_number,          cust_mail.invoice_number,      cust_mail.invoice_date,      cust_mail.amount,       cust_mail.creation_Date,         cust_mail.email_address,       CASE   WHEN cust_mail.EMAIL_STATUS = 'EMAIL DELIVERED'     THEN '<div class="email-green-box">EMAIL DELIVERED</div>'   ELSE '<div class="email-red-box">EMAIL NOT DELIVERED</div>'  END...

Whenever a UI application displays a large result set with many rows and columns, navigation can become cumbersome. Users often need to scroll vertically to view records and then scroll back to the top to access the horizontal scroll bar in order to view additional columns. This negatively impacts usability and overall user experience. We encountered a similar challenge with an Oracle APEX Interactive Grid report that contained a high number of columns. Navigating across columns while reviewing rows became difficult and inefficient for users. To address this issue and enhance the visual and navigation experience, we implemented a horizontal scroll bar at the top of the Interactive Grid . This allows users to navigate columns easily without scrolling back to the top of the report repeatedly. This article outlines the step-by-step approach to adding a top horizontal scroll bar to an Interactive Grid in Oracle APEX. Step 1: Add Custom CSS at the Page Level Navigate to the required ...