ASP.NET MVC Paging Does Not Appear
ASP.NET MVC Paging Does Not Appear
 arosner            
            
                Posts: 35Questions: 8Answers: 1
arosner            
            
                Posts: 35Questions: 8Answers: 1            
            Hello,
**Paging does not appear in the DataTables control. I have 12 records in the database. I query for <page size> records for each callback. When I set the page size to 10, I expect to see 2 pages (recordsTottal=12). I only see 1. I also expect that when the user selects another page, there is a callback to the server for more data.
**
Javascript is:
    $(document).ready(function () {
        bindDatatable();
    });
    function bindDatatable() {
        datatable = $('#tableData')
            .DataTable({
                "dom": "lrtip", 
                "processing": true, 
                "serverSide": true, 
                "filter": true, 
                "pageLength": 10,
                "ajax": {
                    "url": "/DatabaseTables/LoadData",
                    "data": {
                        "rowCount": @Model.RowCount,
                        "databaseTableColumns": "@Model.ToJsonDatabaseTableColumns",
                        "databaseTableRow": "@Model.ToJsonDatabaseTableRow"
                    },
                    "type": "POST",
                    "datatype": "json"
                },
                "language": {
                    "emptyTable": "No record found.",
                    "processing":
                        '<i class="fa fa-spinner fa-spin fa-3x fa-fw" style="color:#2a2b2b;"></i><span class="sr-only">Loading...</span> '
                },
                initComplete: function () {
                    this.api()
                        .columns()
                        .every(function () {
                            let column = this;
                            let title = column.footer().textContent;
                            // Create input element
                            let input = document.createElement('input');
                            input.placeholder = title;
                            column.footer().replaceChildren(input);
                            // Event listener for user input
                            input.addEventListener('change', () => {
                                if (column.search() !== this.value) {
                                    column.search(input.value).draw();
                                }
                            });
                        });
                },
                "columns": [
                    @foreach (var item in Model.DatabaseTableColumns)
                    {
                        <text>
                        {
                            "data": "@Html.DisplayFor(modelItem => item.COLUMN_NAME)",
                            "autoWidth": true,
                            "searchable": true,
                        },
                        </text>
                    }
                ]
            });
    }
Payload is:
draw: 1
columns[0][data]: testdecimal
columns[0][name]:
columns[0][searchable]: true
columns[0][orderable]: true
columns[0][search][value]:
columns[0][search][regex]: false
columns[1][data]: testfloat
columns[1][name]:
columns[1][searchable]: true
columns[1][orderable]: true
columns[1][search][value]:
columns[1][search][regex]: false
columns[2][data]: testint
columns[2][name]:
columns[2][searchable]: true
columns[2][orderable]: true
columns[2][search][value]:
columns[2][search][regex]: false
columns[3][data]: testmoney
columns[3][name]:
columns[3][searchable]: true
columns[3][orderable]: true
columns[3][search][value]:
columns[3][search][regex]: false
columns[4][data]: testsmallint
columns[4][name]:
columns[4][searchable]: true
columns[4][orderable]: true
columns[4][search][value]:
columns[4][search][regex]: false
columns[5][data]: testtinyint
columns[5][name]:
columns[5][searchable]: true
columns[5][orderable]: true
columns[5][search][value]:
columns[5][search][regex]: false
columns[6][data]: testString
columns[6][name]:
columns[6][searchable]: true
columns[6][orderable]: true
columns[6][search][value]:
columns[6][search][regex]: false
columns[7][data]: testBit
columns[7][name]:
columns[7][searchable]: true
columns[7][orderable]: true
columns[7][search][value]:
columns[7][search][regex]: false
columns[8][data]: testDateTime
columns[8][name]:
columns[8][searchable]: true
columns[8][orderable]: true
columns[8][search][value]:
columns[8][search][regex]: false
columns[9][data]: testVarchar
columns[9][name]:
columns[9][searchable]: true
columns[9][orderable]: true
columns[9][search][value]:
columns[9][search][regex]: false
columns[10][data]: testDate
columns[10][name]:
columns[10][searchable]: true
columns[10][orderable]: true
columns[10][search][value]:
columns[10][search][regex]: false
columns[11][data]: testTime
columns[11][name]:
columns[11][searchable]: true
columns[11][orderable]: true
columns[11][search][value]:
columns[11][search][regex]: false
order[0][column]: 0
order[0][dir]: asc
start: 0
length: 10
search[value]:
search[regex]: false
rowCount: 12
Response is:
{
    "draw": "1",
    "recordsFiltered": 10,
    "recordsTotal": 12,
    "data": [
        {
            "testdecimal": 6.567,
            "testfloat": 7.24,
            "testint": 58,
            "testmoney": 1300.67,
            "testsmallint": 6,
            "testtinyint": 8,
            "testString": "ts2       ",
            "testBit": false,
            "testDateTime": "01/01/2024 12:00:00",
            "testVarchar": "v2",
            "testDate": "03/01/2023",
            "testTime": "11:23:34"
        },
        {
            "testdecimal": 16.234,
            "testfloat": 6.78,
            "testint": 55,
            "testmoney": 3456105.42,
            "testsmallint": 5,
            "testtinyint": 7,
            "testString": "ts1       ",
            "testBit": true,
            "testDateTime": "01/01/2023 11:34:22",
            "testVarchar": "v1",
            "testDate": "02/01/2023",
            "testTime": "11:23:34"
        },
        {
            "testdecimal": 17.2,
            "testfloat": 978.23,
            "testint": 57,
            "testmoney": 33.56,
            "testsmallint": 17,
            "testtinyint": 22,
            "testString": "abc       ",
            "testBit": true,
            "testDateTime": "04/01/2023 11:57:22",
            "testVarchar": "varc1",
            "testDate": "01/15/2023",
            "testTime": "14:23:56"
        },
        {
            "testdecimal": 17.3,
            "testfloat": 978.24,
            "testint": 58,
            "testmoney": 33.57,
            "testsmallint": 18,
            "testtinyint": 23,
            "testString": "abcd      ",
            "testBit": false,
            "testDateTime": "04/02/2023 11:57:22",
            "testVarchar": "varc2",
            "testDate": "01/16/2023",
            "testTime": "14:23:57"
        },
        {
            "testdecimal": 17.4,
            "testfloat": 978.25,
            "testint": 59,
            "testmoney": 33.58,
            "testsmallint": 19,
            "testtinyint": 24,
            "testString": "abce      ",
            "testBit": true,
            "testDateTime": "04/03/2023 11:57:22",
            "testVarchar": "varc3",
            "testDate": "01/17/2023",
            "testTime": "14:23:58"
        },
        {
            "testdecimal": 17.5,
            "testfloat": 978.26,
            "testint": 60,
            "testmoney": 133.58,
            "testsmallint": 20,
            "testtinyint": 25,
            "testString": "abcef     ",
            "testBit": false,
            "testDateTime": "04/09/2023 11:57:22",
            "testVarchar": "varc54",
            "testDate": "01/23/2023",
            "testTime": "15:23:58"
        },
        {
            "testdecimal": 17.9,
            "testfloat": 978.268,
            "testint": 62,
            "testmoney": 143.58,
            "testsmallint": 21,
            "testtinyint": 26,
            "testString": "abcef1    ",
            "testBit": true,
            "testDateTime": "04/10/2023 11:57:22",
            "testVarchar": "varc55",
            "testDate": "02/23/2023",
            "testTime": "05:23:58"
        },
        {
            "testdecimal": 18.9,
            "testfloat": 988.288,
            "testint": 63,
            "testmoney": 144.58,
            "testsmallint": 22,
            "testtinyint": 27,
            "testString": "abcef2    ",
            "testBit": false,
            "testDateTime": "04/11/2023 07:57:22",
            "testVarchar": "varc56",
            "testDate": "02/25/2023",
            "testTime": "08:24:58"
        },
        {
            "testdecimal": 19.9,
            "testfloat": 998.288,
            "testint": 64,
            "testmoney": 154.58,
            "testsmallint": 23,
            "testtinyint": 28,
            "testString": "abcef3    ",
            "testBit": true,
            "testDateTime": "04/13/2023 07:58:22",
            "testVarchar": "varc57",
            "testDate": "02/26/2023",
            "testTime": "08:25:58"
        },
        {
            "testdecimal": 20.6,
            "testfloat": 998.298,
            "testint": 65,
            "testmoney": 155.58,
            "testsmallint": 24,
            "testtinyint": 29,
            "testString": "abcef4    ",
            "testBit": false,
            "testDateTime": "04/14/2023 07:59:22",
            "testVarchar": "varc58",
            "testDate": "02/27/2023",
            "testTime": "08:27:58"
        }
    ]
}
Thank you,
Al
This question has an accepted answers - jump to answer
Answers
Is wrong. Unless you have a filter applied to the table, it should be exactly the same as
recordsTotal.See the description of the parameter in the manual.
Allan
Thank you,