How can I send an array of my handsontable data to the controller? [Answered]RSS

• • Reply
  AlexanderBla...

  Member

  68 Points

  484 Posts

  How can I send an array of my handsontable data to the controller?

  Mar 24, 2014 02:53 AM|AlexanderBlade|LINK

  Hi, I’m trying to get the contents of my handsontable and post it to a controller action.  The table loads ok and the action is called but I get nothing in the in the object parameter of the action.  

  Here’s my view:

  <script src="../../Scripts/jquery.min.js" type="text/javascript"></script>

  <script src="../../Scripts/jquery-ui.custom.js" type="text/javascript"></script> 

  <script src="../../Scripts/jquery.handsontable.full.js" type="text/javascript"></script>

   

  <script src="../../Scripts/numeral.sv-se.js" type="text/javascript"></script>

   

  <link href="../../Content/themes/base/jquery-ui.custom.css" rel="stylesheet" type="text/css" />

  <link href="../../Content/themes/base/jquery.handsontable.full.css" rel="stylesheet" type="text/css" />

  <link href="../../Content/themes/base/demo-style.css" rel="stylesheet" type="text/css" />

   

  <script type="text/javascript">

      $(function () {

          var $container = $("#myHandsonTable");

          $container.handsontable({

              startRows: 15,

              startCols: 16,

              rowHeaders: true,

              colHeaders: true,

              useFormula: true,

              minSpareCols: 1,

              minSpareRows: 1,

              contextMenu: true,

   

              outsideClickDeselects: false,

              removeRowPlugin: true,

              useFormula: true

          });

   

          var data = [

    ["", "Kia", "Nissan", "Toyota", "Honda"],

    ["2008", 10, 11, 12, 13],

    ["2009", 20, 11, 14, 13],

    ["2010", 30, 15, 12, 13]

  ];

   

          $container.handsontable("loadData", data);

   

         var handsontable = $container.data('handsontable');

   

          $("#save").click(function () {

   

              console.log(handsontable.getData())

              var myData = handsontable.getData();

              myData = JSON.stringify(myData)

              $.ajax({

                  url: "/Home/tableData",

                  type: "POST",

                  contentType: 'application/json',

                  data: myData,

                  dataType: 'json',

                  success: function (data) {

                      alert(data);

                  }

              });

          });

      });

  </script>

      <button id="save">Save</button>

   

  Here’s my controller:

  using System;

  using System.Collections.Generic;

  using System.Linq;

  using System.Web;

  using System.Web.Mvc;

   

  namespace HandsonTable.Controllers

  {

      public class HomeController : Controller

      {

          public ActionResult Index()

          {

              ViewBag.Message = "Welcome to ASP.NET MVC!";

   

              return View();

          }

   

       

          [HttpPost]

          public ActionResult tableData(Object data)

          {

              return View();

          }

      }

  }

   Why is the array of data not being sent to the controller action?  I appreciate any help with this solution.  Thanks!

   

   

   

• • Reply
  Fuxiang Zhan...

  All-Star

  30411 Points

  3628 Posts

  Re: How can I send an array of my handsontable data to the controller?

  Mar 25, 2014 05:06 AM|Fuxiang Zhang - MSFT|LINK

  AlexanderBlade

  Why is the array of data not being sent to the controller action?  I appreciate any help with this solution.  Thanks!

  Hi Alexander,

  Thank you post the issue to asp.net forum.

  If you want to set below array to action, please change your ajax code like below.

  var data = [
  
    ["", "Kia", "Nissan", "Toyota", "Honda"],
  
    ["2008", 10, 11, 12, 13],
  
    ["2009", 20, 11, 14, 13],
  
    ["2010", 30, 15, 12, 13]
  
  ];
  

       $.ajax({
  
                  url: "/Home/tableData",
  
                  type: "POST",
  
                  contentType: 'application/json',
  
                  data:JSON.stringify({ data: data }),,
  
                  dataType: 'json',
  
                  success: function (data) {
  
                      alert(data);
  
                  }
  
              });
  

  Hope that helps, thanks.

  Best Regards!

  We are trying to better understand customer views on social support experience. Click HERE to participate the survey. Thanks!
  
• • Reply
  AlexanderBla...

  Member

  68 Points

  484 Posts

  Re: How can I send an array of my handsontable data to the controller?

  Mar 25, 2014 11:07 AM|AlexanderBlade|LINK

  Hi Fuxiang.  It calls the action but nothing is sent.. Should I be soing something different in the controller to receive the data?

• • Reply
  AlexanderBla...

  Member

  68 Points

  484 Posts

  Re: How can I send an array of my handsontable data to the controller?

  Mar 25, 2014 11:56 AM|AlexanderBlade|LINK

  Thanks Fuxiang.. It worked when i added contentType:. 'application/json, charset=UTF-8' .