add csv file custom widget

JinZhang — Fri, 11 Dec 2015 14:35:59 GMT

Hello,

I am trying to create a custom widget AddCSVfile using the code i found on

Drag and drop to display data | ArcGIS API for JavaScript to upload a csv file and then plot the points to the map. Following is the code for widget.js i am working on, I keep getting http://machinename.domain:3344/webappbuilder/apps/widgets/AddCSVfile/reflect.ashx 404 (Not Found). Although when i am able to access http://machinename.domain:3344/webappbuilder/apps/widgets/AddCSVfile/reflect.ashx from the browser.

Any help is appreciated!

Jin

define([

'dojo/_base/declare',

'jimu/BaseWidget',

"esri/config",

"esri/domUtils",

"esri/graphic",

"esri/InfoTemplate",

"esri/map",

"esri/request",

"esri/urlUtils",

"esri/dijit/InfoWindowLite",

"esri/geometry/Multipoint",

"esri/geometry/Point",

"esri/geometry/webMercatorUtils",

"esri/layers/ArcGISDynamicMapServiceLayer",

"esri/layers/ArcGISImageServiceLayer",

"esri/layers/FeatureLayer",

"esri/symbols/PictureMarkerSymbol",

"dojo/dom",

"dojo/dom-construct",

"dojo/json",

"dojo/on",

"dojo/parser",

"dojo/_base/array",

"dojo/_base/lang",

"dojox/data/CsvStore",

"dojox/encoding/base64",

"dijit/Dialog",

"dijit/layout/BorderContainer",

"dijit/layout/ContentPane",

"dojo/domReady!",

'esri/Color',

'dojo/sniff'

function (

declare,

BaseWidget,

esriConfig,

domUtils,

Graphic,

InfoTemplate,

Map,

request,

urlUtils,

InfoWindowLite,

Multipoint,

Point,

webMercatorUtils,

ArcGISDynamicMapServiceLayer,

ArcGISImageServiceLayer,

FeatureLayer,

PictureMarkerSymbol,

dom,

domConstruct,

JSON, on, parser, arrayUtils, lang, CsvStore, base64,

sniff) {

return declare([BaseWidget], {

baseClass : 'jimu-widget-addcsvfile',

portalUrl : 'http://www.arcgis.com',

arrayFeatureLayer : null,

startup : function () {

this.inherited(arguments);

esriConfig.defaults.io.corsEnabledServers.push("serverapi.arcgisonline.com");

esriConfig.defaults.io.proxyUrl = 'http://serverapi.arcgisonline.com/proxy/proxy.ashx';

on(this.uploadForm, "change", lang.hitch(this, function (event) {

var fileName = event.target.value.toLowerCase();

this.arrayFeatureLayer = [];

if (sniff("ie")) { //filename is full path in IE so extract the file name

var arr = fileName.split("\\");

fileName = arr[arr.length - 1];

}

if (fileName.indexOf(".csv") !== -1) { //is file a zip - if not notify user

this.uploadFile(this.files);

} else {

this.uploadstatus.innerHTML = 'Add a .csv file';

}

}));

onOpen : function () {

console.log('onOpen');

onClose : function () {

console.log('onClose');

onRemoveCSVfile : function (evt) {

if (this.arrayFeatureLayer.length > 0) {

arrayUtils.forEach(this.arrayFeatureLayer, function (currFeatureLayer) {

this.map.removeLayer(currFeatureLayer);

}, this);

}

uploadFile : function (files) {

if (files && files.length === 1) {

console.log("handle files");

handleCSV(files[0]);

} else {

this.uploadstatus.innerHTML = 'Uploading…';

request({

url : "widgets/AddCSVfile/reflect.ashx",

form : this.uploadForm,

load : this.requestSucceeded,

error : this.requestFailed

});

}

handleCSV : function (file) {

console.log("Processing CSV: ", file, ", ", file.name, ", ", file.type, ", ", file.size);

if (file.file) {

var decoded = bytesToString(base64.decode(file.data));

processCSVData(decoded);

} else {

var reader = new FileReader();

reader.onload = function () {

console.log("Finished reading CSV data");

processCSVData(reader.result);

};

reader.readAsText(file);

}

requestSucceeded : function (response) {

this.uploadstatus.innerHTML = 'Upload success…';

this.handleCSV(response);

requestFailed : function (error) {

//this.uploadstatus.innerHTML = 'unable to upload';

console.log(JSON.stringify(error));

}

});

Re: add csv file custom widget

JunshanLiu — Tue, 15 Dec 2015 01:42:25 GMT

Could you try this one?

request({

url : this.folderUrl + "reflect.ashx",

form : this.uploadForm,

load : this.requestSucceeded,

error : this.requestFailed

})

Re: add csv file custom widget

JinZhang — Tue, 15 Dec 2015 12:31:05 GMT

Thank you Junshan, I appreciate your help!

topic add csv file custom widget in Web AppBuilder Custom Widgets Questions

add csv file custom widget

Re: add csv file custom widget

Re: add csv file custom widget