Error when connecting DataTables to Web API Controller

andygator

I have a json response coming back from a WebAPI controller that looks like this:

{"sEcho":"1","iTotalRecords":1,"iTotalDisplayRecords":1,"aaData":[{"id":2,"name":"Andy","description":"New To DataTables"}]}

I am using DataTable like this.

 $(function () {

        $('#materials').dataTable({
            "bServerSide": true,
            "bProcessing": true,
            "sAjaxSource": "api/materials",
            "sAjaxDataProp": "aaData",
            "sPaginationType": "full_numbers",
            "Columns": [
                               { "mData": "id" },
                               { "mData": "name" },
                               { "mData": "description" }
            ]
           
        });
    });

My Markup Looks like this:

<h2>Materials</h2>
   <table id="materials" class="grid">
   <thead>
        <tr>
            <th>Id</th>
            <th>Name</th>
            <th>Description</th>
        </tr>
    </thead>
       <tbody>
       </tbody>
    

</table>

The error I get is:

DataTables warning: table id=materials- Requested unknown parameter '0' for row 0."

Any ideas as to why this is happening?

allan

Sounds like you have more than 3 columns in the HTML (although without a test case, as required in the forum rules, I'm just guessing).

Allan