json data generating but not populating Jquery datatable

<table id ="studentTable" class="table table-bordered table-striped table-hover dataTable js-exportable">
<thead>
<tr>

<th>Admission No</th>

<th>Roll No</th>
<th>Admission Date</th>
<th>Full Name</th>
<th>DOB</th>
<th>Age</th>

<th>Gender</th>
<th>Caste</th>
<th>Religion</th>
<th>Nationality</th>
<th>Mother Name</th>
<th>Father Name</th>
<th> Contact Number</th>
<th>Local Guardian</th>
<th>Address</th>
<th>Class</th>
<th>Section</th>


</tr>
</thead>


</table>

<script type="text/javascript">

$(document).ready(function () {

$.ajax({
type: "POST",
dataType: "json",
url: "Service.asmx/getDataForView",
success: function (data) {
var datatableVariable = $('#studentTable').DataTable({

data: data,
columns: [

{ 'data': 'AdmissionNumber' },
{ 'data': 'RollNumber' },
{ 'data': 'AdmissionDate' }, { 'data': 'StudentName' },
{ 'data': 'DOB' },
{ 'data': 'Age' }, { 'data': 'Gender' },
{ 'data': 'Caste' },
{ 'data': 'Religion' }, { 'data': 'Nationality' },
{ 'data': 'MotherName' },
{ 'data': 'FatherName' }, { 'data': 'PhoneNumber' },
{ 'data': 'LocalGuardianName' },
{ 'data': 'Address' }, { 'data': 'Class' },
{ 'data': 'Section' }
]
});
}

});


});
</script>

My getDataForView method works perfectly fine with data getting generated.

But when i run this code, the  message "No data is available" comes. I know this message is thru the plugin. 

What i what to know is... why is my json data not populating the table.

Can some help.

Do i need to add anything in web config file.