add Html Table rows data into JSON array Object (ok)

https://stackoverflow.com/questions/44097281/add-html-table-rows-data-into-json-array-object

Ask QuestionAsked 4 years, 2 months agoActive 2 years, 8 months agoViewed 3k timesReport this ad11

I am new in MVC. I want to add my HTML Table data into JSON array object. and that object I want to pass to Action Using ajax post.

I am not able to convert my html rows to json object. Can Anybody have solution for the same It will be appreciable

1 Answer

ActiveOldestVotes4

HTML

     <table id="table">
      <tr>
        <td>Alfreds Futterkiste</td>
        <td>Maria Anders</td>
        <td>Germany</td>
      </tr>
      <tr>
        <td>Centro comercial Moctezuma</td>
        <td>Francisco Chang</td>
        <td>Mexico</td>
      </tr>
      <tr>
        <td>Ernst Handel</td>
        <td>Roland Mendel</td>
        <td>Austria</td>
      </tr>
      <tr>
        <td>Island Trading</td>
        <td>Helen Bennett</td>
        <td>UK</td>
      </tr>
      <tr>
        <td>Laughing Bacchus Winecellars</td>
        <td>Yoshi Tannamuri</td>
        <td>Canada</td>
      </tr>
      <tr>
        <td>Magazzini Alimentari Riuniti</td>
        <td>Giovanni Rovelli</td>
        <td>Italy</td>
      </tr>
    </table>

JS code to create JSON Array

  var table = document.getElementById('table');
  var jsonArr = [];
  for(var i =0,row;row = table.rows[i];i++){
       var col = row.cells;
       var jsonObj = {
           company : col[0].innerHTML,
           contact : col[1].innerHTML,
           country : col[2].innerHTML
         }

      jsonArr.push(jsonObj);
  }


  console.log(jsonArr);

https://jsfiddle.net/0h957km9/3/

Last updated

Navigation

Lionel

@Copyright 2023