How to use JQuery in Netsuite

All organizations have their unique need and everyone wants to implement something different, thus where customization comes in to picture.

Netsuite allows not only to leverage the core functionality of CRM & ERP but much more with customization.

 jQuery is included by default on all NetSuite pages.You can access it in any Client scriptbut it is not available for server-side scripts. Note that you have to reference it using jQuery instead of $.

 e.g.  jQuery('#myElementId').hide();

If your intended Jquery function isn't available in Netsuite then you can make a reference to the CDN/Filecabinet, where you have physically place your library scripts.

​​For Client/Serverside use :

In the 'OnPageInit' function, we are first adding the 'jquery.min.js' (google CDN) and then we are using 'setTimeout' method for doing a time out of few seconds before adding the 2nd script.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

function OnPageInit() { AddJavascript('http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js', 'head'); var t = setTimeout("AddJavascript('https://system.netsuite.com/core/media/media.nl?id=253&c=TSTDRV896291&h=c3fc87f394f396552e09&_xt=.js', 'body')", 3000); AddStyle('https://system.netsuite.com/core/media/media.nl?id=254&c=TSTDRV896291&h=50d488b82c3c3ed7263c&_xt=.css', 'head'); } function AddJavascript(jsname, pos) { var tag = document.getElementsByTagName(pos)[0]; var addScript = document.createElement('script'); addScript.setAttribute('type', 'text/javascript'); addScript.setAttribute('src', jsname); tag.appendChild(addScript); } function AddStyle(cssLink, pos) { var tag = document.getElementsByTagName(pos)[0]; var addLink = document.createElement('link'); addLink.setAttribute('type', 'text/css'); addLink.setAttribute('rel', 'stylesheet'); addLink.setAttribute('href', cssLink); tag.appendChild(addLink); }

This is because, when the page gets loaded it will first download the 'jquery.min.js' script might take some time, for this reason when the second script 'jquery.alert.js' gets loadedit might show 'jquery undefined' error. To avoid this we can use the 'setTimeout' to delay the adding of the 'jquery.alert.js' script in the page's DOM. After that the CSS is also added to it. In this code we have hosted the 'jquery.alert.js' and 'jquery.alert.css' in the Netsuite's 'File Cabinet' folder.