Pass an array as parameter to a controller from an ajax call in JavaScript
<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>