HOW TO CREATE A FULL CALENDAR IN NETSUITE USING SUITELET?

A full calendar can be built in netsuite using suitelet script. This would require you to first download the zip file from https://fullcalendar.io/download.

Place this file at file cabinet and note down the url of fullcalendar.min.css, fullcalendar.print.min.css, /lib/moment.min.js, /lib/jquery.min.js, fullcalendar.min.js.

You can also create a client script and refer that url in html link ref, so that it can be triggered when user selects a date.

Below is the sample code: replcae the link url with your url

 var html = '<!DOCTYPE html>\n'
+'<html>\n'
+'<head>\n'
+'<meta charset="utf-8" />\n'
+'<link href="https://system.netsuite.com/core/media/media.nl?id=1234&c=4318&h=7264c1d&_xt=.css" rel="stylesheet" />\n' //fullcalendar.min.css
+'<link href="https://system.netsuite.com/core/media/media.nl?id=4523&c=4318&h=695a0109b&_xt=.css" rel="stylesheet" media="print" />\n'//fullcalendar.print.min.css
+'<script src="https://system.netsuite.com/core/media/media.nl?id=9999&c=4318&h=c4eee7ce6c9&_xt=.js"></script>\n'// /lib/moment.min.js,
+'<script src="https://system.netsuite.com/core/media/media.nl?id=8888&c=4318&h=aa5de54c&_xt=.js"></script>\n' ///lib/jquery.min.js
+'<script src="https://system.netsuite.com/core/media/media.nl?id=5555&c=4318&h=6096c&_xt=.js"></script>\n' // client script
+'<script>\n'

+' $(document).ready(function() {\n'

+' $("#calendar").fullCalendar({\n'
+' header: {\n'
+'left: "prev,next today",\n'
+'center: "title",\n'
+'right: "month,basicWeek,basicDay"\n'
+'},\n'
+' defaultDate: "'5/20/2018'",\n'
+' navLinks: true, // can click day/week names to navigate views\n'
+'editable: true,\n'
+'eventLimit: true, // allow "more" link when too many events\n'
+ 'displayEventTime : false,\n'
+'selectable: true,\n'
+'select: function(start, end, jsEvent, view) {\n' // This function will be triggered                                                                                                               //  on click of date
         // start contains the date you have selected
         // end contains the end date.
                                // you can also call a client function by calling the function name declared in                                      //client script
         // Caution: the end date is exclusive (new since v2).
+'var allDay = !start.hasTime() && !end.hasTime();\n'
+' alert(["Event Start date: " + moment(start).format(),"Event End date: " + moment(end).format(),"AllDay: " + allDay].join(" "));\n'
+'},\n'
+'events: [\n';


html = html +'{\n'
+'title: "'+i+'",\n'
+'start: "'5/22/2018"\n'

+'},\n';


html = html   +']\n'
          +'});\n'

          +'});\n'

          +'</script>\n'
          +'<style>\n'

          +'body {\n'
          +'margin: 40px 10px;\n'
          +'padding: 0;\n'
   // font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
          +'font-size: 14px;\n'
          +'}\n'

          +'#calendar {\n'
          +'max-width: 900px;\n'
          +'margin: 0 auto;\n'
          +'}\n'

          +'</style>\n'
          +'</head>\n'
          +'<body>\n'

          +'<div id="calendar"></div>\n'

          +'</body>\n'
          +'</html>\n';

response.write(html);


// You can alternatively create a inline type field and assign the variable html as default value.


The output will be a calendar like https://fullcalendar.io/.



Comments

Post a Comment

Popular posts from this blog

ALERT IN NETSUITE USING USER EVENT BEFORE LOAD SCRIPT

HOW TO THROW ALERT FROM USER EVENT BEFORE LOAD SCRIPT? It is a well known fact that alert can be thrown from client script by directly using alert() method. But lot of times developer needs to use user event script as client script has several limitations like not being able to run as admin. It always runs the script using the logged in user's role. Client script also doesn't get triggered when you view a record. It gets triggered only on edit, create and copy. Alert can be thrown from user event script by using a mix of  html code with Netsuite API. So, first you will to create a custom field of type inline html. Label is not required for this field. This field can be created using form object in the before load function. Then we can set an html alert in that field as default value. The code snippet is given below function UE_BeforeLoad(type, form, request) {             var alert_value = "<html><body><script type='te...
Read more

HOW TO CREATE SUITELET ASSISTANT IN NETSUITE?

Creating a suitelet assistant involves the following steps: 1)  Create the assistant. 2)  Create steps. 3) Attach client script to validate data on page init, field change, save ( when user clicks on next or finish) or any other trigger function supported by client script. 4)  Build pages for each step. (Get Function) 5) Set values for fields 6) Set up the action when user clicks on next, cancel, back or finish. (Post function) 1) Create the assistant First step is to create assistant by using the api. You can provide name of the assistant under the api parameter. var assist = nlapiCreateAssistant('SUITELET ASSISTANT); 2)  Create steps. Second step is to assign steps to the assistant. You must provide internal id and the name of the step. You can also declare if each step should be completed before proceeding to next one or can be completed randomly.        var step1 = assist.addStep('customstep_step1', 'STEP1'); v...
Read more

HOW TO CREATE A FUNCTIONALITY TO PRINT GL IMPACT OF A TRANSACTION IN NETSUITE?

Netsuite provides the functionality to print a transaction but there is no standard functionality to print GL impact of a transaction. To create a new functionality to print GL impact of a transaction, we can make use of scripts. Using user event script, we can create a custom button on transaction. On click of this button a client script will get triggered which will open a suitelet to print the transaction. The code below shows how to create a custom code to print GL impact of an item fulfillment record. 1. First create a client script. This need not be deployed. Note down the script id. Let us assume that script id is "customscript_client_call_suitlet_printgl". 2. Write a User Event script to add a custom button on item fulfillment. Attach the client script created above to trigger it on click of button. function userEventBeforeLoad(type, form, request){ if(type=='view') {          form.setScript('customscript_client_call_suitlet_print...
Read more