https://netsuiteprofessionals.com logo
Join Slack
Powered by
I'm trying to load an outside library via an inlin...
# suitescript
j
I'm trying to load an outside library via an inline html field and after working through several errors I believe i've gotten everything but the <script src> to work properly. I've tried downloading the library to the file cabinet and loading it from there, but either way I'm still getting this error. Any ideas? Everything I've found online says it may be missing a semi-colon somewhere, but I'm not sure. Thanks in advanced
b
which library are you trying to load, and what does your script element look like
j
@battk Here is the exact html omitting my api key.
Copy code
var esriHtml = '<html>'+
	      '<head>'+
	        '<meta charset="utf-8">'+
	        '<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">'+
	        '<title>ArcGIS API for JavaScript Tutorials: Search for an address</title>'+
	        '<style>'+
	          'html, body, #viewDiv {'+
	            '"padding": 0;'+
	            '"margin": 0;'+
	            '"height": 100%;'+
	            '"width": 100%;'+
	          '}'+
	        '</style>'+
	        '<link rel="stylesheet" href="<https://js.arcgis.com/4.23/esri/themes/light/main.css>">'+
	        '<script src="<https://js.arcgis.com/4.23/>"></script>'+
//	        '<script src="<https://6734664-sb1.app.netsuite.com/core/media/media.nl?id=34721&c=6734664_SB1&h=VjbA8ObuXKuJw-1FbExqAUvsg6oKwiKyiqGsQq9zXvOes6oe&_xt=.js>"></script>'+
	        '<script>'+
	        
	        'require(['+
	          '"esri/config",'+
	          '"esri/Map",'+
	          '"esri/views/MapView",'+
	         
	          '"esri/widgets/Search"'+
	         
	        '], function(esriConfig,Map, MapView,Search) {'+
	        
	        'esriConfig.apiKey = "'+apiKey+'";'+
	       
	        'const map = new Map({'+
	            '"basemap": "arcgis-navigation"'+
	          '});'+
	        
	        'const view = new MapView({'+
	            '"container": "viewDiv",'+
	            '"map": map,'+
	            '"center": [-122.3321,47.6062],'+
	            '"zoom": 12'+
	          '});'+
	         
	        'const search = new Search({'+
	            '"view": view'+
	            '});'+
        
	          'view.ui.add(search, "top-right");'+
	          
	        '});'+
	        '</script>'+
	        
	      '</head>'+
	      '<body>'+
	        '<div id="viewDiv"></div>'+
	      '</body>'+
	      '</html>';
This is the url for the library
Copy code
<https://js.arcgis.com/4.23/>
b
works fine for me
though that string is not going to work in an inline html field
thats basically an entire html page
you dont want to stick another html page in another one
write esriHtml in the response to a suitelet
j
I don't understand, sorry I'm a bit new to loading libraries. So you're saying create a suitelet with the esri html, and then load it via an iframe or something?
b
first part is that an inline html field adds html to another html page
your string represents a complete html page
you cant add a html element in the middle of another html page
j
Oh gotcha, so I could just add the script instead of the entire html?
b
i wouldnt expect it to work on any of netsuite's pages
netsuite includes their own version of require
j
Alright, so I'll create a suitelet and move the code for the html there and then in the inline html field call that suitelet in an iframe. Hopefully that sounds right
b
thats a reasonable approach
j
Thanks for the help, I'm sure i'll be able to work it out from here.
Hey battk, sorry to bother you again. I thought this would be relatively simple, but I can't seem to get it to work. I figured it would just be a context.response.write(html). Is there something I'm doing wrong?
b
thats basically it
j
hmm I'm getting a field help error in the console
Copy code
/**
 * @NApiVersion 2.x
 * @NScriptType Suitelet
 * @NModuleScope SameAccount
 */
define(['N/record', 'N/ui/serverWidget'],
/**
 * @param {record} record
 * @param {serverWidget} serverWidget
 */
function(record, serverWidget) {
   
    /**
     * Definition of the Suitelet script trigger point.
     *
     * @param {Object} context
     * @param {ServerRequest} context.request - Encapsulation of the incoming request
     * @param {ServerResponse} context.response - Encapsulation of the Suitelet response
     * @Since 2015.2
     */
    function onRequest(context) {
    	
    	var apiKey = "xxxxx";
    	


    	var esriHtml = getEsriHtmlCode(apiKey)
    	
    	
    	
    	context.response.write(esriHtml);
    }

    return {
        onRequest: onRequest
    };
    
    function getEsriHtmlCode(apiKey){
    	
    	var esriHtml = '<html>'+
	      '<head>'+
	        '<meta charset="utf-8">'+
	        '<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">'+
	        '<title>ArcGIS API for JavaScript Tutorials: Search for an address</title>'+
	        '<style>'+
	          'html, body, #viewDiv {'+
	            '"padding": 0;'+
	            '"margin": 0;'+
	            '"height": 100%;'+
	            '"width": 100%;'+
	          '}'+
	        '</style>'+
	        '<link rel="stylesheet" href="<https://js.arcgis.com/4.23/esri/themes/light/main.css>">'+
	        '<script src="<https://js.arcgis.com/4.23/>"></script>'+
	        '<script>'+
	        
	        'require(['+
	          '"esri/config",'+
	          '"esri/Map",'+
	          '"esri/views/MapView",'+
	         
	          '"esri/widgets/Search"'+
	         
	        '], function(esriConfig,Map, MapView,Search) {'+
	        
	        'esriConfig.apiKey = "'+apiKey+'";'+
	       
	        'const map = new Map({'+
	            '"basemap": "arcgis-navigation"'+
	          '});'+
	        
	        'const view = new MapView({'+
	            '"container": "viewDiv",'+
	            '"map": map,'+
	            '"center": [-122.3321,47.6062],'+
	            '"zoom": 12'+
	          '});'+
	         
	        'const search = new Search({'+
	            '"view": view'+
	            '});'+
        
	          'view.ui.add(search, "top-right");'+
	          
	        '});'+
	        '</script>'+
	        
	      '</head>'+
	      '<body>'+
	        '<div id="viewDiv"></div>'+
	      '</body>'+
	      '</html>';
    	
    	return esriHtml;
    }
    
});
b
you should be getting a reference error about apiKey being undefined
j
oh I removed my key
just for the example i provided
b
give a better example code
your current one errors
if your code looks anything like
Copy code
function onRequest(context) {
    	
    	var apiKey = "xxxxx";
    	


    	var esriHtml = getEsriHtmlCode(apiKey)
    	
    	
    	
    	context.response.write(esriHtml);
    }
then you defined apiKey in the wrong place
9 Views
Open in Slack
PreviousNext
Powered by