How to write json variable in Datatables (My data is not displayed)

Question

This is my Model Class below

public class VisibleBodyAccessCodes
{
    [Key]
    public int VISIBLE_BODY_ACCESS_CODESId { get; set; }


    public string ACTIVATION_CODE { get; set; }


    public string STAR_ID { get; set; }


    public string FIRST_NAME { get; set; }


}

And this is my api call in controllers

[HttpGet]
    public IActionResult GetAssignedCodeUsers()
    {
        var records = _context.VISIBLE_BODY_ACCESS_CODES.ToList();
        
        return new JsonResult(records);
    }

When I put the debugger in the var records, I can see the records. This is my datatables call

 <script>
    $(document).ready(function() {  
   var table = $("#DT_load").DataTable({  
         
      ajax: {
                "url": "/VisibleBodyAccessCodes/GetAssignedCodeUsers",              
                "type": "GET",
                "dataSrc": "",
                "datatype": "json"
      },
        columns: [
           
            { "data": "FIRST_NAME"}
        ]
    });  
});  

Below is my html

    <table id="DT_load" class="table table-striped table-bordered" style="width:100%">
        <thead>
            <tr>
                @*<th>code</th>*@
                <th>name</th>
                
            </tr>
        </thead>
        <tbody></tbody>
    </table>
</div>

The problem I got that the data are not displayed in the table for me. I got an error that said "DataTables warning: table id=DT_load - Requested unknown parameter 'FIRST_NAME' for row 0, column 0. For more information about this error, please see http://datatables.net/tn/4"

If you could point me to the right direction, thanks!

Answer 1

Try to change FIRST_NAME to First_Name in VisibleBodyAccessCodes:

public class VisibleBodyAccessCodes
{
    ...

    public string First_Name{ get; set; }


}

And then change FIRST_NAME to first_Name in column:

<script>
    $(document).ready(function() {  
   var table = $("#DT_load").DataTable({  
         
      ajax: {
                "url": "/VisibleBodyAccessCodes/GetAssignedCodeUsers",              
                "type": "GET",
                "dataSrc": "",
                "datatype": "json"
      },
        columns: [
           
            { "data": "first_Name"}
        ]
    });  
});  

result: