Jira Code: APC-7
Test Report is a customized record made in the client account. The User Interface of this record seemed messy and client requested for a better UI. On click of a button ‘Create Test Report’ in Sales order, it should redirect to the new online HTML form.
APC 7 Create Test Report HTML
<NLFORM>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<title>Test Report</title>
<!-- <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css"> -->
</head>
<style>
.req {
color: #E24F3F;
margin-left: 4px;
}
.labels {
font-size: 15px;
font-family: 'Nunito Sans', sans-serif;
color: #2e2e2e;
}
.form-head {
font-size: 34px;
font-weight: bold;
font-family: 'Nunito Sans', sans-serif;
color: #0f3a6b;
}
.form-sub {
font-size: 22px;
font-family: 'Nunito Sans', sans-serif;
color: #2e2e2e;
}
.fullWidth {
width: 100%;
margin-bottom: 10px;
}
.halfWidth {
width: 49%;
display: inline-block;
}
.textAlign {
text-align: center;
}
.totalAlign {
padding: 5% 10%;
}
.textStyle {
color: #0f3a6b;
}
input[type=text],
input[type=number],
textarea,
select {
display: block;
width: 97% !important;
height: 34px;
!important;
padding: 6px 12px;
font-size: 14px !important;
line-height: 1.428571429;
color: #555555;
vertical-align: middle;
background-color: #ffffff;
background-image: none;
border: 1px solid #cccccc;
border-radius: 2px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
#comments {
display: block;
width: 97% !important;
height: 100px !important;
padding: 6px 12px;
font-size: 14px !important;
line-height: 1.428571429;
color: #555555;
vertical-align: middle;
background-color: #ffffff;
background-image: none;
border: 1px solid #cccccc;
border-radius: 2px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.button {
/*background-color: #144796;*/
background-color: white;
/*border: none;*/
border: 2px solid #4CAF50; /* Green */
/*color: white;*/
color: black;
padding: 10px 32px;
font-family: 'Nunito Sans', sans-serif;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
}
.buttonhover {
background-color: white;
color: black;
border: 2px solid #0f3a6b;
}
.buttonhover:hover {
background-color: #0f3a6b;
color: white;
}
table,
th,
td {
border: 1px solid black;
border-collapse: collapse;
}
th,
td {
padding: 15px;
}
</style>
<link href="https://fonts.googleapis.com/css?family=Nunito+Sans" rel="stylesheet">
<body>
<div class="totalAlign">
<h1 class="form-head">Test Report</h1>
<!-- <p class="form-sub"> Dear Friend, This is a test html for a custom record in Netsuite</p> -->
<form>
<div>
<h3 class="textStyle">Basic Information</h3>
<div class="fullWidth">
<div class="halfWidth">
<label class="labels">Date</label>
<nlcustrecord_date>
</div>
<div class="halfWidth">
<label class="labels">Tester</label>
<nlcustrecord_tester>
</div>
</div>
</div>
<div>
<h3 class="textStyle">Identification Information</h3>
<div class="fullWidth">
<div class="halfWidth">
<label class="labels">Customer</label>
<nlcustrecord_customer>
</div>
<div class="halfWidth">
<label class="labels">Purchase Order Number</label>
<nlcustrecord_purchase_order_no>
</div>
</div>
<div class="fullWidth">
<div class="halfWidth">
<label class="labels">Manufacturer</label>
<nlcustrecord_manufactuerer>
</div>
<div class="halfWidth">
<label class="labels">Model Part Number</label>
<nlcustrecord_model_part_number>
</div>
</div>
<div class="fullWidth">
<div class="halfWidth">
<label class="labels">Poles</label>
<nlcustrecord_poles>
</div>
<div class="halfWidth">
<label class="labels">Frame Size</label>
<nlcustrecord_frame>
</div>
</div>
<div class="fullWidth">
<div class="halfWidth">
<label class="labels">Voltage Max</label>
<nlcustrecord_voltage_max>
</div>
<div class="halfWidth">
<label class="labels">AIC Rating</label>
<nlcustrecord_aic_rating>
</div>
</div>
<div class="fullWidth">
<label class="labels">Trip Details</label>
<nlcustrecord_trip_details>
</div>
</div>
<div>
<h3 class="textStyle">Environment Information</h3>
<div class="fullWidth">
<div class="halfWidth">
<label class="labels">Local Temperature</label>
<nlcustrecord_local_temperature>
</div>
<div class="halfWidth">
<label class="labels">Local Humidity</label>
<nlcustrecord_local_humidity>
</div>
</div>
</div>
<div>
<h3 class="textStyle">Visual Inspection</h3>
<div class="fullWidth">
<div class="halfWidth">
<table style="width:100%">
<tr>
<th></th>
<th>Good</th>
<th>Poor</th>
<th>N/A</th>
</tr>
<tr>
<td class="labels">Frame</td>
<div hidden>
<nlcustrecord_frame_inspected>
</div>
<td align="center"><input class="radio-btn" type="radio" name="frame" id="frame1" value="1"></td>
<td align="center"><input class="radio-btn" type="radio" name="frame" id="frame2" value="2"></td>
<td align="center"><input class="radio-btn" type="radio" name="frame" id="frame3" value="3"></td>
</tr>
<tr>
<td class="labels">Lugs</td>
<div hidden>
<nlcustrecord_lugs>
</div>
<td align="center"><input class="radio-btn" type="radio" name="lugs" id="lugs1" value="1"></td>
<td align="center"><input class="radio-btn" type="radio" name="lugs" id="lugs2" value="2"></td>
<td align="center"><input class="radio-btn" type="radio" name="lugs" id="lugs3" value="3"></td>
</tr>
<tr>
<td class="labels">Arc Chute</td>
<div hidden>
<nlcustrecord_arc_chute>
</div>
<td align="center"><input class="radio-btn" type="radio" name="arcchute" id="arcchute1" value="1"></td>
<td align="center"><input class="radio-btn" type="radio" name="arcchute" id="arcchute2" value="2"></td>
<td align="center"><input class="radio-btn" type="radio" name="arcchute" id="arcchute3" value="3"></td>
</tr>
<tr>
<td class="labels">Phase Separators</td>
<div hidden>
<nlcustrecord_phase_seperators>
</div>
<td align="center"><input class="radio-btn" type="radio" name="phoneseparators" id="phoneseparators1" value="1"></td>
<td align="center"><input class="radio-btn" type="radio" name="phoneseparators" id="phoneseparators2" value="2"></td>
<td align="center"><input class="radio-btn" type="radio" name="phoneseparators" id="phoneseparators3" value="3"></td>
</tr>
<tr>
<td class="labels">Contacts</td>
<div hidden>
<nlcustrecord_contacts>
</div>
<td align="center"><input class="radio-btn" type="radio" name="contacts" id="contacts1" value="1"></td>
<td align="center"><input class="radio-btn" type="radio" name="contacts" id="contacts2" value="2"></td>
<td align="center"><input class="radio-btn" type="radio" name="contacts" id="contacts3" value="3"></td>
</tr>
<tr>
<td class="labels">Accessories</td>
<div hidden>
<nlcustrecord_accessories>
</div>
<td align="center"><input class="radio-btn" type="radio" name="accessories" id="accessories1" value="1"></td>
<td align="center"><input class="radio-btn" type="radio" name="accessories" id="accessories2" value="2"></td>
<td align="center"><input class="radio-btn" type="radio" name="accessories" id="accessories3" value="3"></td>
</tr>
</table>
</div>
</div>
</div>
<div>
<h3 class="textStyle">Accessories Test</h3>
<div class="fullWidth">
<div class="halfWidth">
<table style="width:100%">
<tr>
<th></th>
<th>Voltage</th>
<th>Test Voltage</th>
<th>Result</th>
</tr>
<tr>
<td>Shunt Trip</td>
<td>
<nlcustrecord_shunt_trip_voltage>
</td>
<td>
<nlcustrecord_shunt_trip_test_voltage>
</td>
<td>
<nlcustrecord_shunt_trip_result>
</td>
</tr>
</table>
</div>
<div class="halfWidth">
<table style="width:100%">
<tr>
<th></th>
<th>NO</th>
<th>NC</th>
<th>Result</th>
</tr>
<tr>
<td>Auxiliary</td>
<td>
<nlcustrecord_auxiliary_no>
</td>
<td>
<nlcustrecord_auxiliary_nc>
</td>
<td>
<nlcustrecord_auxiliary_result>
</td>
</tr>
</table>
</div>
</div>
</div>
<div>
<div class="fullWidth">
<div class="halfWidth">
<table style="width:100%">
<tr>
<th></th>
<th>Description</th>
<th>Test</th>
<th>Result</th>
</tr>
<tr>
<td>Other</td>
<td>
<nlcustrecord_other_1_description>
</td>
<td>
<nlcustrecord_other_1_test>
</td>
<td>
<nlcustrecord_other_1_result>
</td>
</tr>
<tr>
<td>Other</td>
<td>
<nlcustrecord_other_2_description>
</td>
<td>
<nlcustrecord_other_2_test>
</td>
<td>
<nlcustrecord_other_2_result>
</td>
</tr>
<tr>
<td>Other</td>
<td>
<nlcustrecord_other_3_description>
</td>
<td>
<nlcustrecord_other_3_test>
</td>
<td>
<nlcustrecord_other_3_result>
</td>
</tr>
</table>
</div>
</div>
</div>
<div>
<div class="fullWidth">
<div class="halfWidth">
<h3 class="textStyle">Resistance Test</h3>
<table style="width:100%">
<tr>
<th class="textAlign" colspan="3">Resistance Test</th>
</tr>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
<tr>
<td>
<nlcustrecord_resistance_test>
</td>
<td>
<nlcustrecord_resistance_test_b>
</td>
<td>
<nlcustrecord_resistance_test_c>
</td>
</tr>
</table>
</div>
<div class="halfWidth">
<h3 class="textStyle">Insulation Test</h3>
<table style="width:100%">
<tr>
<th class="textAlign" colspan="6">Insulation Test</th>
</tr>
<tr>
<td>A-B</td>
<td>A-C</td>
<td>B-C</td>
<td>A-G</td>
<td>B-G</td>
<td>C-G</td>
</tr>
<tr>
<td>
<nlcustrecord_insulation_test_a_b>
</td>
<td>
<nlcustrecord_insulation_test_a_c>
</td>
<td>
<nlcustrecord_insulation_test_b_c>
</td>
<td>
<nlcustrecord_insulation_test_a_g>
</td>
<td>
<nlcustrecord_insulation_test_b_g>
</td>
<td>
<nlcustrecord_insulation_test_c_g>
</td>
</tr>
</table>
</div>
</div>
</div>
<div>
<h3 class="textStyle">Current Test</h3>
<div class="fullWidth">
<table style="width:100%">
<tr>
<th></th>
<th></th>
<th class="textAlign" colspan="3">Current Result</th>
<th class="textAlign" colspan="3">Trip Time</th>
</tr>
<tr>
<td>Function</td>
<td>Current Setting</td>
<td>A</td>
<td>B</td>
<td>C</td>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
<tr>
<td>Long Time Trip</td>
<td>
<nlcustrecord_long_time_trip_setting>
</td>
<td>
<nlcustrecord_long_time_current_a>
</td>
<td>
<nlcustrecord_long_time_current_b>
</td>
<td>
<nlcustrecord_long_time_current_c>
</td>
<td>
<nlcustrecord_long_time_trip_trip_time_a>
</td>
<td>
<nlcustrecord_long_time_trip_trip_time_b>
</td>
<td>
<nlcustrecord_long_time_trip_trip_time_c>
</td>
</tr>
<tr>
<td>Long Time Delay</td>
<td>
<nlcustrecord_long_time_delay_setting>
</td>
<td>
<nlcustrecord_long_time_delay_current_a>
</td>
<td>
<nlcustrecord_long_time_delay_current_b>
</td>
<td>
<nlcustrecord_long_time_delay_current_c>
</td>
<td>
<nlcustrecord_long_time_delay_trip_time_a>
</td>
<td>
<nlcustrecord_long_time_delay_trip_time_b>
</td>
<td>
<nlcustrecord_long_time_delay_trip_time_c>
</td>
</tr>
<tr>
<td>Short Time Trip</td>
<td>
<nlcustrecord_short_time_trip_setting>
</td>
<td>
<nlcustrecord_short_time_trip_current_a>
</td>
<td>
<nlcustrecord_short_time_trip_current_b>
</td>
<td>
<nlcustrecord_short_time_trip_current_c>
</td>
<td>
<nlcustrecord_short_time_trip_time_a>
</td>
<td>
<nlcustrecord_short_time_trip_time_b>
</td>
<td>
<nlcustrecord_short_time_trip_time_c>
</td>
</tr>
<tr>
<td>Short Time Delay</td>
<td>
<nlcustrecord_short_time_delay_setting>
</td>
<td>
<nlcustrecord_short_time_delay_current_a>
</td>
<td>
<nlcustrecord_short_time_delay_current_b>
</td>
<td>
<nlcustrecord_short_time_delay_current_c>
</td>
<td>
<nlcustrecord_short_time_delay_trip_a>
</td>
<td>
<nlcustrecord_short_time_delay_trip_b>
</td>
<td>
<nlcustrecord_short_time_delay_trip_c>
</td>
</tr>
<tr>
<td>Instantaneous Trip</td>
<td>
<nlcustrecord_instantaneous_trip_setting>
</td>
<td>
<nlcustrecord_instantaneous_current_a>
</td>
<td>
<nlcustrecord_instantaneous_current_b>
</td>
<td>
<nlcustrecord_instantaneous_current_c>
</td>
<td>
<nlcustrecord_instantaneous_trip_time_a>
</td>
<td>
<nlcustrecord_instantaneous_trip_time_b>
</td>
<td>
<nlcustrecord_instantaneous_trip_time_c>
</td>
</tr>
<tr>
<td>Ground Fault Trip</td>
<td>
<nlcustrecord_ground_fault_trip_setting>
</td>
<td>
<nlcustrecord_ground_fault_trip_current_a>
</td>
<td>
<nlcustrecord_ground_fault_trip_current_b>
</td>
<td>
<nlcustrecord_ground_fault_trip_current_c>
</td>
<td>
<nlcustrecord_ground_fault_trip_trip_time_a>
</td>
<td>
<nlcustrecord_ground_fault_trip_trip_time_b>
</td>
<td>
<nlcustrecord_ground_fault_trip_trip_time_c>
</td>
</tr>
<tr>
<td>Ground Fault Delay</td>
<td>
<nlcustrecord_ground_fault_delay_setting>
</td>
<td>
<nlcustrecord_ground_fault_delay_current_a>
</td>
<td>
<nlcustrecord_ground_fault_delay_current_b>
</td>
<td>
<nlcustrecord_ground_fault_delay_current_c>
</td>
<td>
<nlcustrecord_ground_fault_delay_trip_time_>
</td>
<td>
<nlcustrecord_ground_fault_delay_trip_timeb>
</td>
<td>
<nlcustrecord_ground_fault_delay_delay_trip>
</td>
</tr>
</table>
</div>
</div>
<div>
<h3 class="textStyle">Pass/Fail Final Result</h3>
<input type="radio" name="passorfail" id="pass" value="1">PASS<br>
<input type="radio" name="passorfail" id="fail" value="2">FAIL<br>
<div hidden>
<nlcustrecord_final_result>
</div>
</div>
<br>
<button type="submit" align="center" class="button buttonhover">SUBMIT</button>
<script>
//***************************************************
$('#pass').click(function() {
var value = $('#pass').attr('value');
$('#custrecord_final_result').val(value);
})
$('#fail').click(function() {
var value = $('#fail').attr('value');
$('#custrecord_final_result').val(value);
})
//***************************************************
$('#frame1').click(function() {
var value = $('#frame1').attr('value');
$('#custrecord_frame_inspected').val(value);
})
$('#frame2').click(function() {
var value = $('#frame2').attr('value');
$('#custrecord_frame_inspected').val(value);
})
$('#frame3').click(function() {
var value = $('#frame3').attr('value');
$('#custrecord_frame_inspected').val(value);
})
//***************************************************
$('#lugs1').click(function() {
var value = $('#lugs1').attr('value');
$('#custrecord_lugs').val(value);
})
$('#lugs2').click(function() {
var value = $('#lugs2').attr('value');
$('#custrecord_lugs').val(value);
})
$('#lugs3').click(function() {
var value = $('#lugs3').attr('value');
$('#custrecord_lugs').val(value);
})
//***************************************************
$('#arcchute1').click(function() {
var value = $('#arcchute1').attr('value');
$('#custrecord_arc_chute').val(value);
})
$('#arcchute2').click(function() {
var value = $('#arcchute2').attr('value');
$('#custrecord_arc_chute').val(value);
})
$('#arcchute3').click(function() {
var value = $('#arcchute3').attr('value');
$('#custrecord_arc_chute').val(value);
})
//***************************************************
$('#phoneseparators1').click(function() {
var value = $('#phoneseparators1').attr('value');
$('#custrecord_phase_seperators').val(value);
})
$('#phoneseparators2').click(function() {
var value = $('#phoneseparators1').attr('value');
$('#custrecord_phase_seperators').val(value);
})
$('#phoneseparators3').click(function() {
var value = $('#phoneseparators3').attr('value');
$('#custrecord_phase_seperators').val(value);
})
//***************************************************
$('#contacts1').click(function() {
var value = $('#contacts1').attr('value');
$('#custrecord_contacts').val(value);
})
$('#contacts2').click(function() {
var value = $('#contacts2').attr('value');
$('#custrecord_contacts').val(value);
})
$('#contacts3').click(function() {
var value = $('#contacts3').attr('value');
$('#custrecord_contacts').val(value);
})
//***************************************************
$('#accessories1').click(function() {
var value = $('#accessories1').attr('value');
$('#custrecord_accessories').val(value);
})
$('#accessories2').click(function() {
var value = $('#accessories2').attr('value');
$('#custrecord_accessories').val(value);
})
$('#accessories3').click(function() {
var value = $('#accessories3').attr('value');
$('#custrecord_accessories').val(value);
})
//***************************************************
/*var mappedobj = {
'lugs1': 'custrecord_lugs',
'lugs2': 'custrecord_lugs',
'pass': 'custrecord_final_result',
'fail': 'custrecord_final_result'
}
for (var key in mappedobj) {
$('#' + key).click(function() {
var value = $('#' + key).attr('value');
$('#' + mappedobj[key]).val(value);
})
}*/
</script>
</form>
</div>
</body>
</html>APC-7 Create Test Report Userevent Script
/**
* @NApiVersion 2.x
* @NScriptType UserEventScript
*/
/*******************************************************************************
* CLIENTNAME: APC
* APC-7
* Create Test Report
* **************************************************************************
* Date : 18-03-2019
*
* Author: Jobin & Jismi IT Services LLP
* Script Description : To make a button in Sales order and on its click, redirect to the online form.
* Date created : 18-03-2019
*
* REVISION HISTORY
*
******************************************************************************/
define(['N/record', 'N/search', 'N/runtime'],
function(record, search, runtime) {
function beforeLoad(context) {
try {
if (context.type == 'view') {
var soRec = context.form;
context.form.clientScriptFileId = 13219;
var testReportButton = soRec.addButton({
id: 'custpage_test_report',
label: 'Create Test Report',
functionName: 'testreport'
});
}
} catch (er) {
log.debug('er', er);
}
};
function beforeSubmit(context) {};
function afterSubmit(context) {};
return {
beforeLoad: beforeLoad,
beforeSubmit: beforeSubmit,
afterSubmit: afterSubmit
};
});APC-7 Create Test Report Client Script
/**
* @NApiVersion 2.x
* @NScriptType ClientScript
* @NModuleScope SameAccount
*/
/*******************************************************************************
* CLIENTNAME: APC
* APC-7
* Create Test Report
* **************************************************************************
* Date : 18-03-2019
*
* Author: Jobin & Jismi IT Services LLP
* Script Description : To make a button in Sales order and on its click, redirect to the online form.
* Date created : 18-03-2019
*
* REVISION HISTORY
*
******************************************************************************/
define(['N/currentRecord', 'N/url', 'N/runtime', 'N/search'],
function(currentrecord, url, runtime, 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) {}
function testreport(scriptContext) {
try {
var record = currentrecord.get();
//console.log('record', record);
var recordId = record.id
//console.log('recordId', recordId);
var customerObject = search.lookupFields({
type: search.Type.SALES_ORDER,
id: recordId,
columns: ['entity', 'otherrefnum', 'tranid']
});
//console.log('customerObject', customerObject);
var customer = customerObject.entity[0].value;
//console.log('customer', customer);
var poNumber = customerObject.otherrefnum;
//console.log('poNumber', poNumber);
var currentUser = runtime.getCurrentUser()
var currentUserID = currentUser.id;
//console.log('currentUserID', currentUserID);
var salesorder = customerObject.tranid;
//console.log('salesorder', salesorder);
var url = '/app/crm/common/onlineforms/internalonlineform.nl?formid=4&customer=' + customer + '&tester=' + currentUserID + '&poNumber=' + poNumber + '&salesorder=' + salesorder;
//console.log('url', url);
//window.location = url;
window.open(url);
} catch (er) {
log.debug('er', er)
}
}
return {
pageInit: pageInit,
testreport: testreport
};
});