There are 3 ways of customization possible with the summary box.
- Create a new summary box
- Update the values in the existing standard summary box
- Append new lines in the standard summary box.
Create a new Summary Box
Function to create a summary box.
function createSummary(values) {
try {
log.debug('inside createsummary');
var html = '<style>' +
'table.newtotallingtable caption {\n' +
' display: table-caption !important;\n' +
' margin-bottom: 10px;\n' +
' font-weight: bold;\n' +
' color: white;\n' +
' font-size: 12px !important;\n' +
' padding: 4px 0px 4px 8px;\n' +
'}' +
'table.newtotallingtable caption {\n' +
' background-color: #607799;\n' +
'}' +
'caption, th {\n' +
' text-align: left;\n' +
'}' +
'</style>';
html += '<span class="bgmd totallingbg" style="display:inline-block; position:relative;left: 200px; padding: 10px 25px; margin-bottom:5px;">';
html += '<table class="newtotallingtable" cellspacing="2" cellpadding="0px" border="0px" style="padding: 5px;\n' +
' width: 217px;"><caption style="display: none;" >Summary</caption><tbody><td>';
html += '<div class="uir-field-wrapper" data-field-type="currency"><span id="subtotal_fs_lbl_uir_label" class="smalltextnolink uir-label "><span id="subtotal_fs_lbl" class="smalltextnolink" style="color: #262626 !important; font-size: 12px; padding-bottom:10px;">'
html += 'Total Amount</td>';
html += '<td style="color: #262626 !important; font-size: 13px; padding-bottom:10px;" align="right" id="subtotal">';
html += values.actualTotal + '</td><td></td></tr>';
html += '<tr><td style="color: #262626 !important; font-size: 12px;" align="left">UCREDIT</td><td align="right" style="font-size: 13px; color: #262626 !important;">';
html += values.ucredit + '</td></tr>';
html += '</table></div>';
return '<div id="custom_summary">' + html + '</div>';
} catch (e) {
log.error({
title: e.name,
details: e
});
}
}Set the return value from function, createSummary in inlinehtml filed created.
var summary = createSummary(values);
var set = new_record.setValue({
fieldId: 'custbody_jj_actual_summarybox',
value: summary
});Update the values in the existing standard summary box
Code snippet updates the line showing the Total and Subtotal in transactions.
jobField_1.defaultValue = `<script>jQuery(".totallingtable tr").eq(0).replaceWith("` + `<tr><td> <tr> <td> <div class='uir-field-wrapper' data-field-type='currency'> <span id='subtotal_fs_lbl_uir_label' class='smalltextnolink uir-label '> <span id='subtotal_fs_lbl' class='smalltextnolink' style=''> <a tabindex='-1' title='What's this?' href='javascript:void("help")' style='cursor:help' onclick='return nlFieldHelp('Field Help','subtotal', 'TRAN_SALESORD_subtotal_NA', this, 'EDIT_TRAN_SALESORD', '5701690_SB1', 'salesord', 100, 'salesorder', 'T', '', 'Sales%20Order', '', 'Subtotal')' class='smalltextnolink' onmouseover='this.className='smalltextul'; return true;' onmouseout='this.className='smalltextnolink'; '>Subtotal</a> </span></span><span class='uir-field inputreadonly'><span id='subtotal_fs' class='inputtotalling'> <span id='subtotal_val' class='inputtotalling' datatype='currency'>${imaginarySubTotal.toFixed(2)}</span></span><input name='subtotal' id='subtotal' type='hidden' value='0.00' datatype='currency'> </span></div></td> <td></td></tr> </td></tr>");</script>`;
jobField_2.defaultValue = `<script>jQuery(".totallingtable tr").eq(5).replaceWith("\` + \`<tr><td> <tr> <td> <div class='uir-field-wrapper' data-field-type='currency'> <span id='subtotal_fs_lbl_uir_label' class='smalltextnolink uir-label '> <span id='subtotal_fs_lbl' class='smalltextnolink' style=''> <a tabindex='-1' title='What's this?' href='javascript:void("help")' style='cursor:help' onclick='return nlFieldHelp('Field Help','subtotal', 'TRAN_SALESORD_subtotal_NA', this, 'EDIT_TRAN_SALESORD', '5701690_SB1', 'salesord', 100, 'salesorder', 'T', '', 'Sales%20Order', '', 'Subtotal')' class='smalltextnolink' onmouseover='this.className='smalltextul'; return true;' onmouseout='this.className='smalltextnolink'; '>Total</a> </span></span><span class='uir-field inputreadonly'><span id='subtotal_fs' class='inputtotalling'> <span id='subtotal_val' class='inputtotalling' datatype='currency'>${imaginaryTotal.toFixed(2)}</span></span><input name='subtotal' id='subtotal' type='hidden' value='0.00' datatype='currency'> </span></div></td> <td></td></tr> </td></tr>");</script>`;Append new lines in the standard summary box.
The code snippet appends a new line in the standard summary box n transactions.
jobField.defaultValue = `<script>jQuery(".totallingtable > tbody").append("` + `<tr><td> <tr> <td> <div class='uir-field-wrapper' data-field-type='currency'> <span id='subtotal_fs_lbl_uir_label' class='smalltextnolink uir-label '> <span id='subtotal_fs_lbl' class='smalltextnolink' style=''> <a tabindex='-1' title='What's this?' href='javascript:void("help")' style='cursor:help' onclick='return nlFieldHelp('Field Help','subtotal', 'TRAN_SALESORD_subtotal_NA', this, 'EDIT_TRAN_SALESORD', '5701690_SB1', 'salesord', 100, 'salesorder', 'T', '', 'Sales%20Order', '', 'Subtotal')' class='smalltextnolink' onmouseover='this.className='smalltextul'; return true;' onmouseout='this.className='smalltextnolink'; '>UCredit</a> </span></span><span class='uir-field inputreadonly'><span id='subtotal_fs' class='inputtotalling'> <span id='subtotal_val' class='inputtotalling' datatype='currency'>${credit.toFixed(2)}</span></span><input name='subtotal' id='subtotal' type='hidden' value='0.00' datatype='currency'> </span></div></td> <td></td></tr> </td></tr>");</script>`;