Search code examples
jsonhandsontable

How to send Json Data using Handsontable using Key's as Colomn Headers

enter image description here

I am trying to send data of handson table to a server in json format using colomn headers as Keys in Key Value Pairs, i am getting output as

["Rohit","Kunar","DDD","DDD"]

but i want output as 

{
"SourceIP" : "172.34.32.43,172.23.34.56",
"DestinationIP":"172.34.32.43,123.345.432.345",
"Port": "8080",
"Protocol":"TCP"
}

What needs to be changed to make code to output like this

my code:

jQuery(document).ready(function(){



    var container = document.querySelector('#exampleGrid');

    var hot = new Handsontable(container, {

        startRows: 1,
        startCols: 5,
        minSpareCols: 0,
        //always keep at least 1 spare row at the right
        minSpareRows: 0,
        //always keep at least 1 spare row at the bottom,
        colHeaders: ['Source Ip','Destination Ip','Port','Protocol','Issue'],
        rowHeaders: true,
        //colHeaders: true,
        contextMenu: true,
        persistentState: true,
        manualColumnResize: true,
        manualRowResize: true[![enter image description here][1]][1]
    });

Handsontable.Dom.addEvent(load, 'click', function() {





      console.log(JSON.stringify({hot.getData()}));
  });
Solution

  • What you want to do is actually define a data structure in your initialization object. Right now you're not even defining anything (which might even break stuff). So you should do something like this:

    data: []

    And then define your columns object:

    columns: [
    {data:'SourceIP'},
    {data:'DestinationIP'}, 
    {data:'Port'}, 
    {data:'Protocol'}
]

    This defines the order of the columns and how the objects are created. If you now do hot.getData(), it'll come back as an object.