Loading Icon symbol Shows when clicking a button

We can set loading symbol when we click on the button to show you have clicked and you should wait for the page to refresh.First of all download the loading icon gif from the web and add the file in the file cabinet image folder.Copy the url of the loading icon from the gif file in the file cabinet and paste it in the script.

Userevent

/**
 * @NApiVersion 2.1
 * @NScriptType UserEventScript
 */
define(['N/record', 'N/search', 'N/ui/serverWidget'],
    /**
     * @param{record} record
     * @param{search} search
     * @param{serverWidget} serverWidget
     */
    (record, search, serverWidget) => {
            /**
             * Defines the function definition that is executed before record is loaded.
             * @param {Object} scriptContext
             * @param {Record} scriptContext.newRecord - New record
             * @param {string} scriptContext.type - Trigger type; use values from the context.UserEventType enum
             * @param {Form} scriptContext.form - Current form
             * @param {ServletRequest} scriptContext.request - HTTP request information sent from the browser for a client action only.
             * @since 2015.2
             */
            const beforeLoad = (scriptContext) => {
                    const CLIENT_ID=38862;
                    try {
                            if (scriptContext.type == 'view') {
                                    var recObj = scriptContext.newRecord;
                                    log.debug("recobj", recObj);

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

                                    var loadingUrl = "https://4248794-sb1.app.netsuite.com/core/media/media.nl?id=38899&c=4248794_SB1&h=cDhK_u9ykO_G-O02l8EqihpM73oI3xai8ml3EoDAh4wqUnSt";
                                    var htmlCode = "<div><img id='custpage_load_img_new' style='height:100px;width:100px;top: 110px;left: 570px;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_flipaddr',
                                                    label: 'Flip Adr',
                                                    functionName: 'flipAddr'});
                                    form.clientScriptFileId=CLIENT_ID;

                            }

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


            return {beforeLoad}

    });

Client Script

#tdbody_custpage_flipaddr is the id we get by inspecting the button in the form

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

    function(url, https, currentRecord, search) {

        /**
         * Function to be executed after page is initialized.
         *
         * @param {Object} scriptContext
         * @param {Record} scriptContext.currentRecord - Current form record
         * @param {string} scriptContext.mode - The mode in which the record is being accessed (create, copy, or edit)
         *
         * @since 2015.2
         */
        function pageInit(scriptContext) {
            console.log('test');

        }

        function flipAddr(){
            console.log('flip address in SO');
            if (jQuery('#tdbody_custpage_flipaddr').length == 1) {
                jQuery('#tdbody_custpage_flipaddr').css('pointer-events', 'none');
                jQuery('#tdbody_custpage_flipaddr').css('opacity', '0.6');
                // jQuery('#tdbody_custpage_send_po').css('background-color', 'blue');
            }

            var recObj=currentRecord.get();
            console.log('recObj: ',recObj);
            console.log('recObj: ',recObj.id);
            jQuery("#custpage_load_img_new").css("display", "block");

            var suitletUrl=url.resolveScript({
                scriptId: 'customscript_jj_sl_flipaddr_ntrx_146',
                deploymentId: 'customdeploy_jj_sl_flipaddr_ntrx_146',
                params:{recid:recObj.id}
                // returnExternalUrl: true
            });
            https.get({ url: suitletUrl})
            location.reload();

        }



        return {
            pageInit: pageInit,
            flipAddr: flipAddr,
        };

    });