Running client script in view mode

July 4, 2016 Adolfo Garza Comments 3,034 comments

In order to run clientscript in view mode you need to modify the form on BeforeLoad using a UserEvent script and attach a Clientscript file to the form using clientScriptFieldId function. Here’s some examples on how to do it:

Suitescript 1.0:

function beforeLoad(type, form) {

if (nlapiGetContext().getExecutionContext() == 'userinterface') {

form.setScript('customscript_yourscriptid');//<< SET THIS TO YOUR SCRIPT ID

}

Here’s what you would have in your 1.0 Clientscript customscript_yourscriptid file:

Note: The Clientscript record doesn’t need to be deployed, you don’t need to fill the function names either. As long as it exists the logic will run.

1	alert('Test succesful');

Suitescript 2.0:

var SEARCHMODULE;

/**

*@NApiVersion 2.x

*@NModuleScope Public

*@NScriptType UserEventScript

define(['N/search'], runUserEvent);

function runUserEvent(search) {

SEARCHMODULE = search;

var returnObj = {};

returnObj.beforeLoad = beforeLoad;

return returnObj;

}

function beforeLoad(scriptContext) {

if (scriptContext.type == scriptContext.UserEventType.VIEW) {

scriptContext.form.clientScriptFileId = 163452;//<< SET THIS TO YOUR SCRIPT ID

//scriptContext.form.clientScriptModulePath = 'SuiteScripts/myClientscript.js';//<< ALTERNATIVELY YOU CAN USE THE PATH

scriptContext.form.addButton({

id: 'custpage_some_button',

label: 'Some Button',

functionName: 'someFunction'

});

}

Here’s what you would have in your 2.0 Clientscript file:

var SEARCHMODULE;

define(['N/search'], runClientscript);

function runClientscript(search){

SEARCHMODULE = search;

//*********** HELPER FUNCTIONS ***********

function someFunction() {

alert('Clientscript someFunction triggered');

return;

}

var returnObj = {};

returnObj.someFunction = someFunction;

return returnObj;

}

Suitescript 2.0 InlineHTML Hack:

If you need to run your code without having to click a button you can try the the following code. This code injects a script into the form to hack the DOM. In other words it’s a hack.

The following code is a hack. Use carefully.

/**

*@NApiVersion 2.x

*@NModuleScope Public

*@NScriptType UserEventScript

define([], runUserEvent);

function runUserEvent() {

var returnObj = {};

returnObj.beforeLoad = beforeLoad;

return returnObj;

}

function beforeLoad(scriptContext) {

if (scriptContext.type == scriptContext.UserEventType.VIEW) {

var field = scriptContext.form.addField({

id: 'custpageinjectcode',

type: 'INLINEHTML',

label: 'Inject Code'

});

field.defaultValue = "<script>alert('Hello')</script>"; //This is where you would type your script

}

Kish

Has this functionality changed since this was posted? I’m trying to get this to work in a Suitelet, but it’s not recognizing the function in the client script.

/*************Client Script **********/
var SEARCHMODULE;
/**
*@NApiVersion 2.0
*@NModuleScope Public
*@NScriptType ClientScript
*/
define([‘N/search’], runClientScript);

function runClientScript(search) {
SEARCHMODULE = search;
function pageInit(context) {
log.debug(‘page init’);
}
function printPDF(){
log.debug(‘button pushed’);
return;
}
var returnObj = {};
returnObj.printPDF = printPDF;
returnObj.pageInit = pageInit;
return returnObj;
}

/********** Suitelet Script ***********/
/**
*@NApiVersion 2.0
*@NModuleScope Public
*@NScriptType Suitelet
*/
define([‘N/ui/serverWidget’,’N/task’],
function(serverWidget,task) {
function onRequest(context) {
var form = serverWidget.createForm({
title: ‘Simple Form’
});
form.clientScriptFileId = 13768;
form.addButton({
id : ‘custpage_custom_button’,
label: ‘A Wild Button’,
functionName: ‘printPDF’
});
}
);
- Adolfo Garza
  
  Yeah, its still working. I see discrepancies in your clientscript. Try using alert instead of log
  Debug and if that doesnt work then try deleting the jtags. Also check your script file id.
  - Kish
    
    Huh. You’re right. The log statement just disappears.
    
    Works like a charm now. Thanks!
Jet

I can’t seem to make this work using SS1.0
How should the client script record look?
Was wondering if it should be configured as normal (e.g. pageinit for alert or hiding buttons using jQuery) and does it need script deployment?

I’m trying to hide the sub list button ‘Close Remaining Lines’ which appear on edit mode of a Purchase Order.
Was wondering if there could also be a workaround to hide sublist buttons (no internalid) on user event script as jQuery(‘#button_id’).hide(); doesn’t seem to work.

Thank you!
- Adolfo Garza
  
  Hi Jet, I just updated the post to provide more clarity on the contents of the clientscript. Although I think you will be better off using:
  
  function beforeLoad(type, form) {
  if (nlapiGetContext().getExecutionContext() == ‘userinterface’) {
  form.removeButton(‘closeremaining’); //REMOVE BUTTON
  }
  }
  - Jet
    
    Hi @borncorp:disqus,
    Thank you for the fast turnaround. I actually tried that and I don’t think it works on the button found under the items subtab. The button is labeled ‘Close Remaining Lines’ alongside the buttons ‘Add Multiple’ and ‘Clear All Lines’.
    
    Thank you for this website. I’ve been seeing you around SO and props to your help for the community!
    - Adolfo Garza
      
      Oh, yeah in that case jQuery(‘#tr_closeremaining’).hide(); should do the trick. Thanks for visiting my site. I am glad it was helpful for you.
Brian Waugh

If i’m understanding this then you cannot get it to work in SS2.0 without having a button? For instance, showing a message on record view using SS2.0 fully. I’ve tried doing an inlineHTML field in SS2.0 like bknights suggested here https://stackoverflow.com/questions/40245943/ss2-0-display-message-on-record/40267529#40267529 to no avail.
- Adolfo Garza
  
  Yeah, I have only been able to do that on SS2.0 with the inlineHTML hack. I updated the post so check the “SS 2.0 Hack version” example.
patrick moon

Just starting NS and don’t understand error I’m getting by copy/paste your code: invalid return.
**** my error *** found it….Thanks for this great post.
Love your code
- Adolfo Garza
  
  I am glad you were able to figure it out. Thanks for checking out my site!
Dean

Hi, I’m having a trouble regarding the onclick function in may created button using before load. Here’s the scenario:

User Event :

before load : if (context.type === context.UserEventType.EDIT) {
context.form.clientScriptFileId = ‘111’;
context.form.addButton({
id: ‘custpage_buttonupdate’,
label: ‘Update Sublist ‘,
functionName: ‘updateSublist()’
});
}

Client :
updateSublist(context){
var record = contect.currentRecord;

var count = record.getSublistCount(‘item’);
for(var x = 0; x< count; x++){
// updating sublist
}

}

How does it work's on manipulating record, the function works only in alert(). please response ASAP
thank you so much.
- Adolfo Garza
  
  I don’t think the context.currentRecord you have on your clientscript works. You probably need to encapsulate your clientside logic using require as the following example:
  
  require([‘N/currentRecord’], function (currentRecord){
  var record = currentRecord.get();
  var count = record.getLineCount({ sublistId: ‘item’ });
  console.log(count)
  }
  )
D17339

Hi
Do you know how to use this in 2.0 Suitelet
sublist.addMarkAllButtons();
it just adds two buttons
i can do the mark and markall Functionality using sublist.addButton

How to use this default api
sublist.addMarkAllButtons();
- Adolfo Garza
  
  Here’s how:
  https://imgur.com/a/H5EdY
  - D17339
    
    HI Adolfo
    
    Thank you
    
    i tried those already by referring to Help center it doesn’t work.
    
    do you have any working code.
    - Adolfo Garza
      
      Unfortunately no, usually those examples work fine for me but I have never tried this one in particular.
D17339

HI adolfo

i was not able to set Script Parameter value through the below code.
can you help me out.

var schedule= task.create({
taskType: task.TaskType.SCHEDULED_SCRIPT,
scriptId: runtime.getCurrentScript().id,
deploymentId: runtime.getCurrentScript().deploymentId,
params:{
‘custscript_schedule_status’: booleanValue
}
});
schedule.submit();
- Adolfo Garza
  
  I don’t see anything wrong with the code, but try creating the task object first and then assigning the params separately like:
  
  var scriptTask = task.create({taskType: task.TaskType.SCHEDULED_SCRIPT});
  scriptTask.scriptId = 1234;
  scriptTask.deploymentId = ‘customdeploy1’;
  scriptTask.params = {searchId: ‘custsearch_456’};
  var scriptTaskId = scriptTask.submit();
Daniel Mashburn

https://uploads.disquscdn.com/images/08927eab405523c8d733911e357c42bb63d843e9c8b74aeac94ba7bc93b924ab.png Hi Adolfo,

Long time lurker and many thanks for your helpful posts. I’m trying to use the 2.0 version above at the end, and I can see my jQuery in the console elements, but its not triggering on the page. Is there something I need to do to trigger it as a “”?
- Daniel Mashburn
  
  Disregard. The field just can’t be hidden.
  - Adolfo Garza
    
    Cool. I am glad you were able to figure it out.
Adolfo Garza

Sorry for not replying earlier. I don’t think you can control the paging on a suitelet sublist, but if the sublist has a very large number of rows I believe Netsuite automatically adds the paging. Give it a try.
Patrick Lee

Hi Adolfo

Love your posts! Always really helpful and in this particular case, helped me manipulate the DOM to hide subtabs on view under specific conditions. While I know DOM manipulation isn’t encouraged, sometimes you gotta get creative when meeting business needs.

Cheers from Australia
- Adolfo Garza
  
  Thanks for your comment! I am glad you found the post helpful. Cheers from Austin.
Nayeem

Hello Ursus, hope you are doing great!,I am trying to show an icon in a transaction line level field for each item record, once we click on it, I need to get the line item details and then need to show suitelet, for this created a transaction line field of type inline html, used user event before load function to set the field default value to html code, but its not shown up when the transaction is in edit mode, and only shown up in record view mode… I am trying to achieve the same way like inventory detail icon functionality, your suggestions are much more helpful for me to achieve this…
- Adolfo Garza
  
  Sounds like you are hacking the DOM in some way so you might need to debug that further on your end. I don’t think you’ll be able to achieve the functionality in both view and edit modes that way though.
  - Nayeem
    
    Thanks a lot Adolfo, but how NetSuite is providing inventory details even in edit or view mode, cant we achieve this at all?, any suggestions?
    - Adolfo Garza
      
      You can get inventory details in the console/clientscript, it’s just getting the icon there and click functionality which is not supported.
Kevin

Hello,
Suppose I were to set the field.defaultValue to execute a script that fetches an external webpage and assigns the scraped data via document.querySelector() to a variable. How would I go about passing that scraped data (variable) back into NetSuite to populate a normal text variable?
- Adolfo Garza
  
  Hi Kevin, you could either use clientscript to set a field value and then wait for the user to save the record/trigger it yourself or you could pass the data to an internal Suitelet that would write the data back to the record and then reload the page afterwards to avoid running into “this record has been changed” error. Good luck!
PureAbsolute

Hi – Thank you for this. I’m only just getting into Netsuite 2.0, I don’t have gold support, and so I need hacks such as this!. One of your comments in this thread set me along the correct path – using require if needed. I was wondering from the start how to call NS functionality from an inline script. I thought I’d return the favor and post an implementation for an example:

/** *@NApiVersion 2.1 *@NModuleScope SameAccount *@NScriptType UserEventScript */ define(['N/ui/serverWidget'],
function (m_serverWidget) { function beforeLoad(context) { if (context.type !== context.UserEventType.VIEW) return; // ... let inlineHTMLField = context.form.addField({ id: 'custpage_linehtmlwholesalemsg', type: m_serverWidget.FieldType.INLINEHTML, label: 'Inline HTML Wholesale display message', });
inlineHTMLField.defaultValue =
require(['N/ui/message'], (m_message) => { m_message.create({title: 'Wholesale alert', message: 'Warning: wholesale customer records are treated differently then normal customer-closed won records.', type: m_message.Type.INFORMATION, }).show(); });
;

}

return {
beforeLoad: beforeLoad
};

});

This also has the benefit of using some 2.1 syntax.

Thank you!
- Adolfo Garza
  
  Cool, thanks for sharing!