Sticky Headers in NetSuite

You know how NetSuite’s headers disappear when you scroll down and then you’re left to wonder which field you are in?

You can make the headers sticky with the following procedure (Chrome/Firefox/Brave):

Install TamperMonkey (horrible name, great tool) from the add-on store.
Once you’ve installed TamperMonkey, click the TamperMonkey icon and select “New User Script”
Paste the following script into the new script window, and save the script.

// ==UserScript==
// @name NetSuite Floating Headers
// @version 0.2
// @description Float item sublist header on scroll
// @match https://*.netsuite.com/*
// grant none
// @require http://code.jquery.com/jquery-latest.js
// ==/UserScript==

(function ($, undefined) {
    $(function () {
    const windowHeight = $(window).height();

    $('.uir-machine-table-container')
        .filter((index, elem) => $(elem).height() > windowHeight)
        .css('height', '70vh')
        .bind('scroll', (event) => {
            const headerElem = $(event.target).find('.uir-machine-headerrow');
            headerElem.css('transform', `translate(0, ${event.target.scrollTop}px)`);
        })
        .bind('scroll', (event) => {
            const headerElem = $(event.target).find('.uir-list-headerrow');
            headerElem.css('transform', `translate(0, ${event.target.scrollTop}px)`);
        })

    });
})(window.jQuery.noConflict(true));

And that’s it! Now you have sticky headers in NetSuite!

Scrolling page with sticky NetSuite headers. — Voila! You now have sticky headers!

Hat tip to the folks at https://netsuitehub.com/ for posting the original suggested solution.

Let’s build something together.

Get in touch!

Let’s build something together.

Like this: