title: Pass an array as parameter to a controller from an ajax call in JavaScript
body: <p>I'm working on an ASP.NET MVC 4 website and I've got some troubles with a functionality. I explain, I've to select entities displayed in a table with their linked checkbox :</p>
  
  <p><a href="http://i.stack.imgur.com/TyzMD.png" rel="nofollow">Screenshot of my table where each row has a checkbox with the same Id as the entity</a>  </p>
  
  <p><a href="http://i.stack.imgur.com/x6h5K.png" rel="nofollow">Console showing updates in the array</a></p>
  
  <p>Inside my script I have been abled to store each checked Id's checkbox in an array and remove those if the checkbox is unchecked. But I can't pass the array to my controller's function to delete each selected entity in the database.
  I used <code>$.ajax()</code> from jquery to send through a POST request the array (as JSON) but I always get 500 error : </p>
  
  <ul>
  <li>JSON primitive invalid</li>
  <li>Null reference </li>
  </ul>
  
  <p>Here's my function in my script (I don't know if my array's format is valid) :</p>
  
  <pre><code>    var sendDocsToDelete = function (docsArray) {
          $.ajax({
              type: 'POST',
              url: 'Main/DeleteDocuments',
              data: JSON.stringify(docsArray),
              contentType: 'application/json; charset=utf-8',
              datatype: 'json',
              success: function (result) {
                  alert('Success ' + result.d);
              },
              error: function (result) {
                  alert('Fail ' + result.d);
              }
          });
      }
  </code></pre>
  
  <p>Then, the POST call the following function in my controller :</p>
  
  <pre><code>    [Authorize]
      [WebMethod]
      public void DeleteDocuments(string docsToDelete)
      {
          int id; 
          string[] arrayDocs = JsonConvert.DeserializeObject&lt;string[]&gt;(docsToDelete);
  
          foreach (string docId in arrayDocs)
          {
              int.TryParse(docId, out id);
              dal.DeleteDocument(id); // dal = DataAccessLayer is the class which interacts with the database by executing queries (select, delete, update...)
          }
      }
  </code></pre>
  
  <h2>Update 2</h2>
  
  <pre><code>    [Authorize]
      public ActionResult DeleteDocuments(int[] docsToDelete)
      {
          try{
                 foreach (string docId in arrayDocs)
                 {
                         int.TryParse(docId, out id);
                         dal.DeleteDocument(id); // dal = DataAccessLayer is the class which interacts with the database by executing queries (select, delete, update...)
                 }
                 return Json("Success");
          } 
          catch 
          {
                 return Json("Error");
          }
      }
  
  
      var sendDocsToDelete = function (docsArray) {
          $.ajax({
              type: 'POST',
              url: 'Main/DeleteDocuments',
              data: docsArray,
              contentType: 'application/json; charset=utf-8',
              datatype: 'json',
              success: function (result) {
                  alert('Success ' + result.d);
              },
              error: function (result) {
                  alert('Fail ' + result.d);
              }
          });
      }
  </code></pre>
  
  <p>Any ideas about this issue ? I hoped I was clear enough. Do not hesitate if you need more details.</p>