"Uncaught SyntaxError: Unexpected end of JSON input" when use DataTable in ASP.NET Boilerplate

13 views Asked by At

I followed a code in the ABP Boilerplate framework but got the error "Uncaught SyntaxError: Unexpected end of JSON input". I don't know what return type needs to be returned to display the table in the .cshtml file. I see that the return data of the sample source has an additional count variable. I don't know if that variable is needed or is there a way to avoid having that variable?

This is my code in JS file

(function ($) {
    var _placeService = abp.services.app.place,
        l = abp.localization.getSource('TrainingProject'),
        _$modal = $('PlaceCreateModal'),
        _$form = _$modal.find('form'),
        _$table = $('#PlacesTable');

    var _$placesTable = _$table.DataTable({
        paging: true,
        serverSide: true,
        listAction: {
            ajaxFunction: _placeService.listAll,
            inputFilter: function () {
                return $('#PlacesSearchForm').serializeFormToObject(true);
            }
        },
        
        buttons: [
            {
                name: 'refresh',
                text: '<i class="fas fa-redo-alt"></i>',
                action: () => _$placesTable.draw(false)
            }
        ],
        responsive: {
            details: {
                type: 'column'
            }
        },
        columnDefs: [
            {
                targets: 0,
                className: 'Id',
                defaultContent: '',
            },
            {
                targets: 1,
                className: 'namePlace',
                sortable: false
            },
            {
                targets: 2,
                className: 'viewPlace',
                sortable: false
            },
            {
                targets: 3,
                data: null,
                sortable: false,
                autoWidth: false,
                defaultContent: '',
                render: (data, type, row, meta) => {
                    return [
                        `   <button type="button" class="btn btn-sm bg-secondary edit-role" data-role-id="${row.id}" data-toggle="modal" data-target="#PlaceEditModal">`,
                        `       <i class="fas fa-pencil-alt"></i> ${l('Edit')}`,
                        '   </button>',
                        `   <button type="button" class="btn btn-sm bg-danger delete-role" data-role-id="${row.id}" data-role-name="${row.name}">`,
                        `       <i class="fas fa-trash"></i> ${l('Delete')}`,
                        '   </button>',
                    ].join('');
                }
            }
        ]
    });


})(jQuery);

And JSON return is

{
    "result": [
        {
            "id": 1,
            "namePlace": "Test",
            "viewPlace": 50
        },
    ],
    "targetUrl": null,
    "success": true,
    "error": null,
    "unAuthorizedRequest": false,
    "__abp": true
}
0

There are 0 answers