topic Re: Display an array with one element per line in ArcGIS JavaScript Maps SDK Questions

Display an array with one element per line

StahlyEngineering — Tue, 14 Mar 2017 19:54:51 GMT

In a custom widget I want to display the contents of an output array one element per line. Currently the output in the widget's panel is:

RESULTS: 21N29W160,21N29W210

this is the js line that passes the array:

this.Quart.innerHTML = 'RESULTS: '+Quarter;‍

this is the html line:

<div data-dojo-attach-point="Quart"></div>‍

eventually each output line will be a link using a specific element of Quarter for the path and name.

Thanks in advance!

Re: Display an array with one element per line

RobertScheitlin__GISP — Tue, 14 Mar 2017 20:57:06 GMT

Stahly,

Then you need to loop through the Quarter array using dojo array or a simple for loop. and add a "<br>" to the end of each line of text before you add it to the innerHTML.

Re: Display an array with one element per line

ThomasSolow — Tue, 14 Mar 2017 21:05:10 GMT

My advice would be to use an HTML list, like this:

let htmlString = Quarter.reduce((accum, current) => accum += `<li>${current}</li>`, "<ul>");

htmlString += "</ul>"

this.Quart.innerHTML = 'RESULTS: '+htmlString;

For older versions of JS you could do:

var htmlString = Quarter.reduce(function(accum, current){ accum += "<li>"+current+"</li>"}, "<ul>");

htmlString += "</ul>";

You can style the list separately to your liking.

Re: Display an array with one element per line

RobertScheitlin__GISP — Tue, 14 Mar 2017 21:10:53 GMT

Just be advised that your targeted browsers would have to support ES6 arrow functions and array.reduce to use Thomas's code.