Some NetSuite transaction types have a native state machine. For convenience, NetSuite display the state prominently at the top of the page. This is very handy.


Below is a code snippet to accomplish the desired result, It injects the status in the beforeLoad event of a user event script deployed to the target record type. Note that because NetSuite does not offer any API for this kind of operation, I resorted to using jQuery to inject the HTML element (more on that shortly).
/**
* @NApiVersion 2.1
* @NScriptType UserEventScript
*/
define([],
() => {
/**
* An enumeration of state colors per NetSuite house style
*/
const NsLabelColor = {
BLUE: '#d5e0ec',
YELLOW: '#fcf9cf',
GREEN: '#d7fccf',
RED: '#fccfcf'
}
const beforeLoad = (scriptContext) => {
try {
let stateTxt = 'TODO: Implement';
let errState = false;
// TODO: Implement logic to determine state text/color
let bgColor = NsLabelColor.YELLOW;
if (errState) {
bgColor = NsLabelColor.RED;
}
scriptContext.form.addField({
id: 'custpage_nsi_status',
label: 'Custom State',
type: 'inlinehtml'
}).defaultValue = `<script>jQuery(function($){
require([], function() {
/* $(".uir-page-title-secondline").find("div.uir-record-status").remove(); // Uncomment to remove native state */
$(".uir-page-title-secondline").append('<div class="uir-record-status" id="pri-amz-status" style="background-color: ${bgColor}">${stateTxt}</div>');
});
})</script>`;
} catch (e) {
// Deliberately suppress any errors as this non-critical function should not block the record from loading
log.error('Error', `Suppressing error encountered while attempting to set the custom state: ${e}`)
}
}
return {beforeLoad}
});