This article is relevant if you are programming a generic HTML Suitelet in the SuiteScript 1.0 fashion and you would like to better understand how file upload techniques work.
Background
In performing custom NetSuite development, we are often asked to create various HTML web pages that serve as forms to get information into NetSuite. NetSuite’s generic “online forms” technology can get the job done. But the framework may not be right for a simple application.
For example, we have a client that would like their customers to come to a branded and personalized web page to ask them to upload a scanned picture of the front and back of their automobile driver’s license. To do this, we are leveraging our Content Renderer Engine pattern as it quite easily allows us to a) search any data inside NetSuite and b) allows us to craft database driven HTML (content) pages that are personalized.
In this case, we needed to craft a friendly page and offer up two spots to collect scanned images. While we could have hard coded the entire HTML web page using NetSuite Suitelet technology, we instead prefer to think in more general patterns so that we can produce more flexible ways for data capture while also allowing a good HTML programmer to work in the model.
General HTML Pattern for File Uploads to NetSuite
NetSuite offers code examples of how to upload files via SuiteLet’s. But the underlying assumption is as follows:
- Using NetSuite Forms: we are using NetSuite HTML forms versus standard HTML forms.
- File References Known: the name of the file element is known in advance.
We wanted a framework that would allow us to dynamically generate as many file uploads as needed and know the name of the file references as we work. See related image to see the basic HTML pattern. Naturally, via JavaScript, we can easily craft the pattern dynamically.
NetSuite SuiteLet SuiteScript 1.0 Code Example to Get File Uploads
While NetSuite’s SuiteScript 2.0 has newer capacities to get at files that were uploaded via HTML web pages, the following code example shows how we leverage extra information supplied in the HTML POST to discover, store and attach the files to a business record. Thus, this Suitelet code pattern can act as a general HTML File Upload POST handler.
//test if we have file attachments to netsuite's Request object. //Due to limitation of the SuiteScript 1.0 nlobjRequest.getFile function, we can't easily //discover the name of the files. Our convention then is to look for a "file" parameter that is comma //separated. If we have "file" value, we will add them as an attachment. var files = request.getParameter("file") nlapiLogExecution("DEBUG", "files found list", files); var filenames = files.split(","); var fileids = []; //hold array of file ids, if found for (filename in filenames){ var f = filenames[filename].trim(); //get rid of spaces in file list references var file = request.getFile(f); //try to retrieve a file if (file){ nlapiLogExecution("DEBUG", "test for file " + f, (file) ? file.getName() : 'no file'); //temp folder variable previously set; let's store it and hold the ids to later attach to record file.setFolder(TEMP_FOLDER_ID); var fileid = nlapiSubmitFile(file); fileids.push(fileid); } } //now attach files to our custom record [id variable already in play] for (fileid in fileids){ nlapiAttachRecord("file", fileids[fileid], "customrecord_mycustomrecord", id, null); }
Extend NetSuite to Drive Your Business Requirements
One of NetSuite’s strengths is that fact that the platform allows you to invent and work with general web technologies to produce great user experiences and integrations. If you have a NetSuite technology challenge, let’s have a conversation.