• : 1-877-596-8218
  • : sales@aecc.ca
# # #
#

How to implement a suitelet with custom HTML code.

Here I’m going to describe a process on how to create a custom button that shows a page with a custom
HTML code.

The first step is to create a user event script that executes before the page is loaded. The following code
shows an example of the implementation:


function beforeLoad_showAllCustomers(type, form, request) {
    var CONTEXT = nlapiGetContext();
    if (nlapiGetRecordType() == 'customer') {
        if (type == 'view') {
            form.setScript(CONTEXT.getScriptId());
            form.addButton('custpage_showallcustomers', 'Show all customers', 'executeSuiteletForm()');
        }
    }
}

function executeSuiteletForm() {
    var params = '/app/site/hosting/scriptlet.nl?script=397&deploy=1';
    var stWidth = '1200';
    var stHeight = '800';
    window.open(params, "All bins", 'left=500px,top=100px, resizable=no, scrollbars=no,height=' + stHeight + ', width=' + stWidth);
}

The first function customizes the form before it loads. It actually adds additional button on the page with the name “custpage_showallcustomers”, caption is “Show all customers” and with the “executeSuiteletForm()” event. Function that is called when the user clicks on the button opens a form with the custom HTML code.

The next step is to create a Suitelet that implements the business logic of this example. The example of such code:


function suitelet_showAllCustomers(request , response) {
    var context = nlapiGetContext ();
    var method = request.getMethod().toUpperCase();
    if (method == 'GET') {
        var stHtml = "";
        stHtml += "";
        stHtml += generateForm();
        stHtml += "";
        response.write (stHtml);
    }
}

function generateForm() {
    var data = getData();
    var result = '';
    for (var i = 0; i < data.length; i++) {
        var obj = data[i];
        result += '' + obj.internalId + '' + obj.companyname + '';
    }
    return '' +
                '' +
                    '' +
                '' + result +
            '
Internal IdCompany Name
'; } function getData() { function modifyFilters(assocArray) { var result = []; for ( var key in assocArray) { result.push(assocArray[key]); } return result; } var filters = []; var columns = {}; columns["internalid"] = new nlobjSearchColumn('internalid'); columns["companyname"] = new nlobjSearchColumn('companyname'); filters.push(new nlobjSearchFilter('stage', null, 'is', 'CUSTOMER')); var data = (nlapiSearchRecord("customer", null, filters, modifyFilters(columns)) || []).map(function(rec) { var internalId = rec.getValue(columns["internalid"]); var companyname = rec.getValue(columns["companyname"]); return { internalId: internalId, companyname: companyname } }); return data; }

The entry point is a function with the name suitelet_showAllCustomers. If the type of the request is GET, then we extract the list of all customers from the system using nlapiSearchRecord (see getData function).