Issue with rendering data

Issue with rendering data

DevilsGraveDevilsGrave Posts: 20Questions: 6Answers: 0

Hello I have a basic datatable that is getting it's data in JSON format from a webservice. The data is correct and I have verified that. The error I am getting is

Requested unknown parameter 'org_name' for Row 0 Col 0. For more information about this error, please see http://datatables.net/tn/4

My code is

<table id="dtUDocuments" class="display" cellspacing="0" width="100%">
     <thead>
         <tr>
            <th>File Name</th>
            <th>Document Type</th>
            <th>Comment</th>
            <th>Date Uploaded</th>
            <th>Uploaded By</th>
            <th>Program Name</th>
          </tr>
      </thead>
</table>

and js is

$.ajax({
            type: "POST",
            url: "GetDetails.asmx/getUInfoJson",
            data: '{uacProgId: ' + UId + ', StatusType: "' + StatusType + '", isActive: 0}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: OnUInfoDataTableSuccess,
            failure: function (data) {
                alert(data.d);
            }
        });

function OnUInfoDataTableSuccess(response) {
    console.log("response: " + response.d)
    $('#dtUDocuments').DataTable({
        bLengthChange: true,
        lengthMenu: [[5, 10, -1], [5, 10, "All"]],
        bFilter: true,
        bSort: true,
        bPaginate: true,
        data: response.d,
        columns: [
            { "data": "ORG_FILE_NAME" },
            { "data": "DOCUMENT_TYPE" },
            { "data": "REMARKS" },
            { "data": "LAST_UPDATED" },
            { "data": "STAFF" },
            { "data": "PROGRAM_NAME" }
        ]
    });
}

What am I doing wrong?

Thanks

Answers

  • allanallan Posts: 63,534Questions: 1Answers: 10,475 Site admin

    It is impossible to say for sure without being able to see the response from the server, but From past experience, this is .NET server-side presumably and for some reason response.d is a string. Try

    data: JSON.parse(response.d)
    

    If that doesn't work, please can you link to the page or show the data that is being returned.

    Thanks,
    Allan

  • DevilsGraveDevilsGrave Posts: 20Questions: 6Answers: 0

    Uncaught SyntaxError: Expected property name or '}' in JSON at position 2
    at JSON.parse (<anonymous>)

    Got this error when I did

    data: JSON.parse(response.d)

    The data is in this format

    { data: [{"PROGRAM_ID":784968.0,"DOC_ID":1523427.0,"LAST_UPDATED":"08/09/2022","STAFF":"Jane Doe","FILE_NAME":"211dd7e3-2ffa.pdf","FILE_TYPE":"application/pdf","FILE_SIZE":64.0,"PROGRAM_ID":107.0,"PROGRAM_NAME":"Test Program","ORG_FILE_NAME":"test.pdf","REMARKS":"test","DOCUMENT_TYPE":"test"}] }

  • kthorngrenkthorngren Posts: 21,343Questions: 26Answers: 4,954

    Are you saying that the console.log("response: " + response.d) output is this?

    { data: [{"PROGRAM_ID":784968.0,"DOC_ID":1523427.0,"LAST_UPDATED":"08/09/2022","STAFF":"Jane Doe","FILE_NAME":"211dd7e3-2ffa.pdf","FILE_TYPE":"application/pdf","FILE_SIZE":64.0,"PROGRAM_ID":107.0,"PROGRAM_NAME":"Test Program","ORG_FILE_NAME":"test.pdf","REMARKS":"test","DOCUMENT_TYPE":"test"}] }
    

    If so then you probably need this instead:

    {data: response.d.data},
    

    Kevin

  • DevilsGraveDevilsGrave Posts: 20Questions: 6Answers: 0

    Kevin,

    When I do response.d.data I get response: undefined

    And the datatable returns no rows.

    Thanks

  • kthorngrenkthorngren Posts: 21,343Questions: 26Answers: 4,954

    In the OnUInfoDataTableSuccess() function what does the response variable contain?

    The first step is to determine if response is a string or an object. If a string then you will need to use JSON.parse() to get the data.

    Once you have an object you will need to determine where the rows are. In your snippet the data object as the array containing the rows. That array is what the data is expecting.

    Kevin

  • DevilsGraveDevilsGrave Posts: 20Questions: 6Answers: 0

    My webmethod is returning the data like this

    string resp = JsonConvert.SerializeObject(dataSet.Tables[0]);
    return resp;

    Here is what response and response.d return

    response: [object Object]

    response.d:
    [{"PROGRAM_ID":784968.0,"DOC_ID":1523427.0,"LAST_UPDATED":"08/09/2022","STAFF":"Jane Doe","FILE_NAME":"211dd7e3-2ffa.pdf","FILE_TYPE":"application/pdf","FILE_SIZE":64.0,"PROGRAM_ID":107.0,"PROGRAM_NAME":"Test Program","ORG_FILE_NAME":"test.pdf","REMARKS":"test","DOCUMENT_TYPE":"test"}]

  • kthorngrenkthorngren Posts: 21,343Questions: 26Answers: 4,954

    Did you verify, maybe with typeof, the data type for response.d? If its an object then using data: response.d should work.

    Kevin

  • DevilsGraveDevilsGrave Posts: 20Questions: 6Answers: 0

    response.d type is a string. Probably why it's not working

  • kthorngrenkthorngren Posts: 21,343Questions: 26Answers: 4,954

    Yep. Use JSON.parse(response.d) to get convert it to a Javascript object.

    Kevin

  • allanallan Posts: 63,534Questions: 1Answers: 10,475 Site admin

    If it is a string, then you need data: JSON.parse(response.d) - but you said that gives an error.

    Can you use the debugger to give me a trace please - click the Upload button and then let me know what the debug code is.

    Allan

  • DevilsGraveDevilsGrave Posts: 20Questions: 6Answers: 0

    Figured it out.

    In my webmethod I used this

    var jsonObj = JsonConvert.SerializeObject(dataSet.Tables[0]);
    return jsonObj;
    

    In my js I used this for the datatable
    data: JSON.parse(resp.d),

    And now it is working as expected.

    Thank you

Sign In or Register to comment.