diff --git a/js/aggrid.widget.js b/js/aggrid.widget.js
index 1670f63..480cd6e 100644
--- a/js/aggrid.widget.js
+++ b/js/aggrid.widget.js
@@ -4,16 +4,24 @@
 (function ($) {
     'use strict';
 
+    var aggridFieldName = new Array();
+    var aggridLicense = new Array();
+    var aggridDataEdit = new Array();
+
+    var eGridDiv = new Array();
+    var gridOptions = new Array();
+
     Drupal.aggridInstances = [];
 
     Drupal.behaviors.aggridIntegration = {
         attach: function (context) {
-            function makeJson() {
+
+            function makeJson(item) {
                 var aggridOutput = {};
-                aggridOutput = gridOptions.rowData;
+                aggridOutput = gridOptions[item].rowData;
 
                 // Write back to Drupal "Value" field
-                $('#' + aggridFieldName +'_rowData').val(JSON.stringify(aggridOutput));
+                $('#' + aggridFieldName[item] +'_rowData').val(JSON.stringify(aggridOutput));
             }
 
             function formatNumber(number) {
@@ -24,69 +32,77 @@
 
             // @todo Init functionality should support multiple drop zones on page.
             var selector = $('.aggrid-widget');
+            var idArray = [];
 
-            var aggridFieldName = selector.data('target');
-            var aggridLicense = selector.data('license');
-            var aggridDataEdit = selector.data('edit') != undefined ? selector.data('edit') : false;
-
-            selector.addClass('aggrid');
+            selector.each(function () {
+                idArray.push(this.id);
+            });
 
-            $(selector)
-                .css('height', '500px');
+            jQuery.each(idArray, function(index, item) {
+                aggridFieldName[item] = $("#"+ item).data("target");
+                aggridLicense = $("#"+ item).data("license");
+                aggridDataEdit[item] = $("#"+ item).data("edit");
 
-            // If DropzoneJS instance is already registered on Element. There is no
-            // need to register it again.
-            if (selector.once('.aggrid-widget').length !== selector.length) {
-                return;
-            }
+                $("#"+ item)
+                    .addClass('aggrid')
+                    .css('height', '500px');
 
-            // Get the data
-            var colDefsValue = $('#' + aggridFieldName +'_columnDefs').val();
-            var rowDataValue = $('#' + aggridFieldName +'_rowData').val();
-            var addOptValue = $('#' + aggridFieldName +'_addOptions').val();
-
-            // If it's not blank, parse the json... otherwise, null
-            var aggridJSON_colDefs = colDefsValue ? JSON.parse(colDefsValue) : null;
-            var aggridJSON_rowData = rowDataValue ? JSON.parse(rowDataValue) : null;
-            var aggridJSON_addOpt = addOptValue ? JSON.parse(addOptValue) : null;
-
-            // Build JSON for ag-Grid
-            var aggridJSON = {
-                "columnDefs": aggridJSON_colDefs,
-                "rowData": aggridJSON_rowData
-            };
-            aggridJSON = Object.assign(aggridJSON, aggridJSON_addOpt);
-
-            // Default Options for all ag-Grid
-            var default_gridOptions = {
-                stopEditingWhenGridLosesFocus: true,
-                defaultColDef: {
-                    editable: aggridDataEdit,
-                },
-                onGridReady: function () {
-                    gridOptions.api.sizeColumnsToFit();
-                },
-                onCellValueChanged: function() {
-                    makeJson();
+                // If DropzoneJS instance is already registered on Element. There is no
+                // need to register it again.
+                if ($("#"+ item).once("#"+ item).length !== $("#"+ item).length) {
+                    return;
                 }
-            };
-
-            //colDef.menuTabs: ['filterMenuTab','columnsMenuTab'],
 
-            // Add the Default Options
-            var gridOptions = aggridJSON;
-            gridOptions = Object.assign(aggridJSON, default_gridOptions);
+                // Get the data
+                var colDefsValue = $('#' + aggridFieldName[item] +'_columnDefs').val();
+                var rowDataValue = $('#' + aggridFieldName[item] +'_rowData').val();
+                var addOptValue = $('#' + aggridFieldName[item] +'_addOptions').val();
+
+                // If it's not blank, parse the json... otherwise, null
+                var aggridJSON_colDefs = colDefsValue ? JSON.parse(colDefsValue) : null;
+                var aggridJSON_rowData = rowDataValue ? JSON.parse(rowDataValue) : null;
+                var aggridJSON_addOpt = addOptValue ? JSON.parse(addOptValue) : null;
+
+                // Build JSON for ag-Grid
+                var aggridJSON = {
+                    "columnDefs": aggridJSON_colDefs,
+                    "rowData": aggridJSON_rowData
+                };
+
+                aggridJSON = Object.assign(aggridJSON, aggridJSON_addOpt);
+
+                // Default Options for all ag-Grid
+                var default_gridOptions = {
+                    stopEditingWhenGridLosesFocus: true,
+                    defaultColDef: {
+                        editable: aggridDataEdit[item],
+                    },
+                    onGridReady: function () {
+                        gridOptions[item].api.sizeColumnsToFit();
+                    },
+                    onCellValueChanged: function() {
+                        makeJson(item);
+                    }
+                };
+
+                //colDef.menuTabs: ['filterMenuTab','columnsMenuTab'],
+
+                // Add the Default Options
+                gridOptions[item] = aggridJSON;
+                gridOptions[item] = Object.assign(aggridJSON, default_gridOptions);
+
+                // Apply the license if it is available
+                if (aggridLicense != ''){
+                    agGrid.LicenseManager.setLicenseKey(aggridLicense);
+                }
 
+                // Get the ag-Grid Div and start it up
+                eGridDiv[item] = document.querySelector("#"+ item);
 
-            // Apply the license if it is available
-            if (aggridLicense != ''){
-                agGrid.LicenseManager.setLicenseKey(aggridLicense);
-            }
+                // create the grid passing in the div to use together with the columns & data we want to use
+                new agGrid.Grid(eGridDiv[item], gridOptions[item]);
 
-            // Get the ag-Grid Div and start it up
-            var eGridDiv = document.querySelector('.aggrid-widget');
-            // create the grid passing in the div to use together with the columns & data we want to use
-            new agGrid.Grid(eGridDiv, gridOptions);
+            });
         }
     }