Cleint script to Add the Button Near the Field
The client script needed to be deployed to the record in which this functionality is needed. Get the adjscent element by inspecting the page. Use this element to add the Button near this element.
/**
* @NApiVersion 2.1
* @NScriptType ClientScript
* @NModuleScope SameAccount
*/
/*************************************************************************************************************************
* BigRig Group
* Epic: BRGC-187
*
* BRGC-188 Landed cost: Create Bills
*
*********************************************************************************************************************
*
* Author: Jobin & Jismi
*
* Date Created : 19-December-2023
*
* Description :This is a client script to add the ADD button near the field to add the Bills related to landed cost
*
* REVISION HISTORY
*
* @version 1.0 BRGC-188 : 19-December-2023 : Created the initial build by JJ0053
* @version 2.0 BRGC-198 : 27-December-2023 : Updated by JJ0053 -> Journal Creation when Vendor is not available
**************************************************************************************************************************/
define(['N/currentRecord'],
function (currentRecord) {
const FIELDS = ['custbody_jj_sea_freight', 'custbody_jj_transportation_fee', 'custbody_jj_miscellaneous_fee', 'custbody_jj_freight_charges'];
/**
* Function defined tocreate button element in the Purchase order page
* @returns {Object}
*/
function createButton() {
try {
// Create a button element
let button = document.createElement('input');
button.type = 'button';
button.className = 'bill_button';
// button.className = "uir-field-widget";
button.style.cssText = 'border: 1px solid transparent !important; border-radius: 4px !important; background-repeat: no-repeat !important;' +
'background-position: center !important;' +
'background-color: transparent;' +
'color: inherit !important;' +
'font-weight: normal !important;' +
'text-decoration: none !important;' +
'height: 25px!important;' +
'background-image: url(/uirefresh/img/field/add.png);' +
'position: static !important;' +
'width: 25px!important;' +
'display: inline-block !important;' +
'vertical-align: top;'
return button;
} catch (e) {
console.log('error@createButton', e);
}
}
/**
* Function defined to add button adjacent ti the field
* @param {Number} poId
* @param {Number} locId
* @param {Record Object} recObj
*/
function addButton(poId, locId, recObj) {
try {
for (let i = 0; i < FIELDS.length; i++) {
let bills = recObj.getValue({ fieldId: FIELDS[i] });
let button = createButton()
// Get the field element by its ID
let fieldElement = document.getElementById(`labels_${FIELDS[i]}_fs`);//${FIELDS[i]}_fs_tooltipMenu
button.onclick = function () {
window.open(`/app/site/hosting/scriptlet.nl?script=2529&deploy=1&field=${FIELDS[i]}&po=${poId ? poId : ''}&location=${locId}&bills=${bills}`, "Create Bill", "popup=yes,toolbar=no,menubar=no,scrollbars=yes,resizable=yes,top=500,left=500,width=800,height=600");
};
// Insert the button next to the field
fieldElement.parentNode.insertBefore(button, fieldElement.nextSibling);
}
} catch (e) {
console.log('error@addButton', e);
}
}
/**
* Function defined to set the created bill or journal in that field.
* @param {String} data
*/
function setField(data) {
try {
data = data.split(",");
let rec = currentRecord.get();
let bills = rec.getValue({ fieldId: data[1] });
console.log('bills', bills);
if (bills)
bills.push(data[0])
else
bills = [data[0]]
rec.setValue({ fieldId: data[1], value: bills });
} catch (e) {
console.log('error@setField', e);
}
}
/**
* 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) {
try {
let poId = scriptContext.currentRecord.id;
let locId = scriptContext.currentRecord.getValue({ fieldId: 'location' });
addButton(poId, locId, scriptContext.currentRecord)
} catch (e) {
console.log('error@pageInit', e);
}
}
/**
* Function to be executed when field is changed.
*
* @param {Object} scriptContext
* @param {Record} scriptContext.currentRecord - Current form record
* @param {string} scriptContext.sublistId - Sublist name
* @param {string} scriptContext.fieldId - Field name
* @param {number} scriptContext.lineNum - Line number. Will be undefined if not a sublist or matrix field
* @param {number} scriptContext.columnNum - Line number. Will be undefined if not a matrix field
*
* @since 2015.2
*/
function fieldChanged(scriptContext) {
try {
if (FIELDS.includes(scriptContext.fieldId)) {
let poId = scriptContext.currentRecord.id;
let locId = scriptContext.currentRecord.getValue({ fieldId: 'location' });
let elementsToRemove = document.getElementsByClassName('bill_button');
let elementsArray = Array.from(elementsToRemove);
// Loop through each element and remove it
elementsArray.forEach(function (element) {
element.remove();
});
addButton(poId, locId, scriptContext.currentRecord);
}
} catch (e) {
console.log('error@fieldChanged', e);
}
}
return {
pageInit: pageInit,
fieldChanged: fieldChanged,
setField: setField
};
});