Setting colour for custom button

User Event Script

The highlighted portion in the script will set the color for button. We use Jquery to set the button and “#custpage_send_po” is the id of the button and we can get the id by inspecting the button in the form

/**
 * @NApiVersion 2.1
 * @NScriptType UserEventScript
 */
define(['N/record', 'N/search', 'N/ui/serverWidget'],
   
    (record, search, serverWidget) => {
     
        const beforeLoad = (scriptContext) => {
            const CLIENT_ID=746977;

            try {
                if (scriptContext.type == 'view') {

                    var recObj = scriptContext.newRecord
                    var emailed = recObj.getValue({fieldId: 'custbody_jj_po_send_rsp_418'});
                    var form = scriptContext.form;
                    var progressBarField =form.addField({
                        id: 'custpage_progress_bar',
                        type: serverWidget.FieldType.INLINEHTML,
                        label: 'Progress bar'
                    });

                    var loadingUrl = "https://5432914.app.netsuite.com/core/media/media.nl?id=767312&c=5432914&h=v5uUIT2SVXDzmDVmS9Ue4mYtrXyIzXp9_mhA-LfjGbzYwkBc";
                    var htmlCode = "<div><img id='custpage_load_img_new' style='height:100px;width:100px;top: 120px;left: 650px;float: left;position: absolute;display: none;' src='" + loadingUrl + "'/></div>";
                    progressBarField.defaultValue = htmlCode;

                    log.debug("htmlcode",htmlCode);
                    log.debug("progressBarField",progressBarField);


                    // add new button to send email to vendor.
                    form.addButton({id: 'custpage_send_po', label: 'Send PO', functionName: 'sendPO'});
                    var inlineField = form.addField({
                        id: 'custpage_inline_field',
                        type: 'INLINEHTML',
                        label: 'Button'
                    });

                    var scr = "";
                    scr += 'jQuery("#custpage_send_po").removeClass("bntBgT");';
                    scr += 'jQuery("#custpage_send_po").removeClass("rndbuttoninpt");';
                    scr += 'jQuery("#custpage_send_po").css("background-color", "#3599e6");';
                    scr += 'jQuery("#custpage_send_po").css("color", "white");';
                    scr += 'jQuery("#custpage_send_po").css("border", "1px blue solid");';
                    scr += 'jQuery("#secondarycustpage_send_po").removeClass("bntBgT");';
                    scr += 'jQuery("#secondarycustpage_send_po").removeClass("rndbuttoninpt");';
                    scr += 'jQuery("#secondarycustpage_send_po").css("background-color", "#3599e6");';
                    scr += 'jQuery("#secondarycustpage_send_po").css("color", "white");';
                    scr += 'jQuery("#secondarycustpage_send_po").css("border", "1px blue solid");';
                   //push the script into the field so that it fires and does its handy work
                    inlineField.defaultValue = "<script>jQuery(function($){require([], function(){" + scr + ";})})</script>";




                    form.clientScriptFileId=CLIENT_ID;
               
                    if(emailed) {
                        var buttonObj = form.getButton({id: 'custpage_send_po'});
                        log.debug('buttonObj',buttonObj);
                        buttonObj.isDisabled = true;
                        scr += 'jQuery("#custpage_send_po").css("background-color", "#E8E8E8");';
                        scr += 'jQuery("#custpage_send_po").css("border", "#A0A0A0");';
                        scr += 'jQuery("#secondarycustpage_send_po").css("background-color", "#E8E8E8");';
                        scr += 'jQuery("#secondarycustpage_send_po").css("border", "#A0A0A0");';
                        inlineField.defaultValue = "<script>jQuery(function($){require([], function(){" + scr + ";})})</script>";

                    }

                }
            }catch (e) {
                log.debug('error@beforeLoad',e);
            }
        }



        return {beforeLoad}

    });

Client script

/**
 * @NApiVersion 2.x
 * @NScriptType ClientScript
 * @NModuleScope SameAccount
 */
define(['N/url', 'N/https', 'N/currentRecord', 'N/search'],

function(url, https, currentRecord, search) {
       
    function sendPO(){
         console.log('testsend');
        if (jQuery('#tdbody_custpage_send_po').length == 1) {
            jQuery('#tdbody_custpage_send_po').css('pointer-events', 'none');
            jQuery('#tdbody_custpage_send_po').css('opacity', '0.6');
         
       }

        var recObj=currentRecord.get()
        console.log('recObj: ',recObj);
        jQuery("#custpage_load_img_new").css("display", "block");
      
        var suitletUrl=url.resolveScript({
            scriptId: 'customscript_jj_sl_send_po_rsp_418',
            deploymentId: 'customdeploy_jj_sl_send_po_rsp_418',
            params:{recid:recObj.id}
            // returnExternalUrl: true
        });
        https.get({ url: suitletUrl})
        location.reload();
        

    }



    return {
        pageInit: pageInit,
        sendPO: sendPO,
    };
    
});