Why is my ajax not posting to my controller?

Question

I’m trying to post the data from handsontable to my controller. The table loads ok and works fine but nothing happens when I click the save button. I then did a F12 and saw an error:

Requested URL: /Scripts/jquery.min.map

After researching I fouind this link….. jquery 1.9.0 and modernizr cannot be minified with the ASP.NET Web Optimization Framework …… but it did not solve my problem. The action does ot get called and the error message is the same.

What could be the problem. Please help me to understand what’s going on. Thanks.

 <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>

 <script src="../../Scripts/jquery.handsontable-excel.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 = $("#dataGrid");
 var $console = $("#dataConsole");
 var $parent = $container.parent();
 var autosaveNotification;
 $container.handsontable({
   startRows: 8,
   startCols: 6,
   rowHeaders: true,
   colHeaders: true,
   minSpareRows: 1



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

     $parent.find('button[name=save]').click(function () {
       $.ajax({
      url: "Controller/Action",
      data: {"data": handsontable.getData()}, //returns all cells' data
      dataType: 'json',
      type: 'POST',
      success: function (res) {
       if (res.result === 'ok') {
      $console.text('Data saved');
      }
      else {
      $console.text('Save error');
     }
    },
      error: function () {
    $console.text('Success!');
   }
  });
 });

 </script>


   <div id="dataGrid"></div>
    <div id="dataCoonsole"></div>

   <input type="button" value="Save" name="save">

Your url does not look correct Controller/Action, are u using WebApi ? U wanna use fiddler to capture a trace of the network traffic to the API, i wouldn't worry about the minification, that's not anything to do with the ajax call — fuzzybear, Mar 23 '14 at 04:06

score 0 · Answer 1 · answered Mar 23 '14 at 04:04

0

You misspelled dataCoonsole

<div id="dataConsole"></div>

Additionally, the error you're seeing in the console is unrelated to your save errors.

answered Mar 23 '14 at 04:04

Zoey Mertes

3,139
19
23

score 0 · Answer 2 · answered Mar 23 '14 at 06:18

0

I changed the button click line to $("button").click(function () {} and changed the html element to

  <button> save </button>.

answered Mar 23 '14 at 06:18

CloudyKooper

727
3
19
47

Why is my ajax not posting to my controller?

2 Answers2