add shapefile with JS sample code

[FaryalSafdar]

i want to add shapefile to the map from the folder. i have used JS sample code but it does not work for me. It gives error in response , featurecollection. It does not get into request block so i change it to esri request but still code not working. TypeError: Cannot read property 'layers' of undefined

  var portalUrl = "https://www.arcgis.com";
  esriConfig.defaults.io.proxyUrl = "/proxy/";
  on(dojo.byId("uploadForm"), "change", function (event) {
    var fileName = event.target.value.toLowerCase();
    <!-- 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(".zip") !== -1) {
      //is file a zip - if not notify user
      generateFeatureCollection(fileName);
    }
    else {
      alert("Add shapefile as .zip file");
    }
  });
  function generateFeatureCollection (fileName) {
    var name = fileName.split(".");
    name = name[0].replace("c:\\fakepath\\", "");
    var params = {
      'name': name,
      'targetSR': map.spatialReference,
      'maxRecordCount': 1000,
      'enforceInputFileSizeLimit': true,
      'enforceOutputJsonSizeLimit': true
    };
    //var extent = scaleUtils.getExtentForScale(map, 40000);
    var extent = esri.geometry.getExtentForScale(map, 40000);
    var resolution = extent.getWidth() / map.width;
    params.generalize = true;
    params.maxAllowableOffset = resolution;
    params.reducePrecision = true;
    params.numberOfDigitsAfterDecimal = 0;

    var myContent = {
      'filetype': 'shapefile',
      'publishParameters': JSON.stringify(params),
      'f': 'json',
      //'callback.html': 'textarea'
    };
    esriRequest({
      url: portalUrl + '/sharing/rest/content/features/generate',
      content: myContent,
      form: dojo.byId('uploadForm'),
      handleAs: 'json',
      load: lang.hitch(this, function (response) {
        <!-- if (response.error) { -->
          <!-- errorHandler(response.error); -->
          <!-- return; -->
        <!-- } -->
         var layerName = response.FeatureCollection.layers[0].layerDefinition.name;
         addShapefileToMap(response.FeatureCollection);
      }),
     //error: lang.hitch(this, errorHandler)
    });
  }
  function addShapefileToMap (featureCollection) {
     var fullExtent;
     var layers = [];
     arrayUtils.forEach(featureCollection.layers, function (layer) {
      var infoTemplate = new InfoTemplate("Details", "${*}");
      var featureLayer = new FeatureLayer(layer, {
        infoTemplate: infoTemplate
      });
      featureLayer.on('click', function (event) {
        map.infoWindow.setFeatures([event.graphic]);
      });
      changeRenderer(featureLayer);
      fullExtent = fullExtent ?
        fullExtent.union(featureLayer.fullExtent) : featureLayer.fullExtent;
      layers.push(featureLayer);
    });
    map.addLayers(layers);
    map.setExtent(fullExtent.expand(1.25), true);
   }
   function changeRenderer (layer) {
    //change the default symbol for the feature collection for polygons and points
    var symbol = null;
    switch (layer.geometryType) {
      case 'esriGeometryPoint':
        symbol = new PictureMarkerSymbol({
          'angle': 0,
          'xoffset': 0,
          'yoffset': 0,
          'type': 'esriPMS',
          'url': 'https://static.arcgis.com/images/Symbols/Shapes/BluePin1LargeB.png',
          'contentType': 'image/png',
          'width': 20,
          'height': 20
        });
        break;
      case 'esriGeometryPolygon':
        symbol = new SimpleFillSymbol(
          SimpleFillSymbol.STYLE_SOLID,
          new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
          new Color([112, 112, 112]), 1), new Color([136, 136, 136, 0.25])
        );
        break;
    }
    if (symbol) {
      layer.setRenderer(new SimpleRenderer(symbol));
    }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

[FaryalSafdar]

any solution. i have got error on arrayutils : arrayUtils is not a fucntion.

[RobertScheitlin__GISP]

Faryal,

  Sounds like you do not have arrayUtils in your require list.

[ThomasSolow]

arrayUtils is a dojo utility that contains some array methods.  The standard library in all browsers has most (all?) of these functions at this point, so could change

arrayUtils.forEach(featureCollection.layers, function (layer) { ... })

to 

featureCollection.layers.forEach(function(layer){...})

[FaryalSafdar]

i am using array in the rest of the code . so i changed arrayUtils to array . it does not give me error but i am getting new error like on one shapefile Tried to register widget with id==dijit_layout_AccordionContainer_0 but that id is already registered

on other shapefile it gives error time out exceeds.q {message: "Timeout exceeded", response: Object, status: undefined, responseText: undefined, xhr: XMLHttpRequest…}

i am using the same sample code i do not understands why it gives error

i am using the same sample code from arcgis javascript api but do not understand the errors.