Datatable can't show data at rows > 259

synyuno · May 2019

Hi All,

Recently I'm using "fnCreatedCell" in datatable like below;

<script type="text/javascript">
        $(document).ready(function () {
            var product = {};
            $.ajax({
                type: "POST",
                url: "ProExe_Surat.aspx/GetTable",
                data: "{product:" + JSON.stringify(product) + "}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (data) {
                    var datatableVariable = $('#Tabel_ProExeSurat').DataTable({
                        destroy: true,
                        searching: true,
                        select: true,
                        lengthMenu: [10],
                        lengthChange: false,
                        dom: 'lrtip',
                        pagingType: "full_numbers",
                        data: data.d,
                        columns: [
                            {
                                'data': 'docno',
                                fnCreatedCell: function (td, cellData, rowData, row, col, meta) {
                                    var myfile;
                                    myfile = rowData.fileku;
                                    if (myfile == '') {
                                        $(td).html(rowData.docno);
                                        $(td).css('text-align', 'center');
                                    } else {
                                        $(td).html("<a href=/files/Project_Execution/Surat/" + encodeURIComponent(rowData.fileku) + " target='_blank'>" + rowData.docno + "</a>");
                                        $(td).css('text-align', 'center');
                                    }

                                }
                            },
                            {
                                'data': 'doctitle',
                                fnCreatedCell: function (td, cellData, rowData, row, col) { $(td).css('text-align', 'center'); }
                            },
                            {
                                'data': 'pro',
                                fnCreatedCell: function (td, cellData, rowData, row, col) { $(td).css('text-align', 'center'); }
                            },
                            {
                                'data': 'cat',
                                fnCreatedCell: function (td, cellData, rowData, row, col) { $(td).css('text-align', 'center'); }
                            },
                            {
                                'data': 'docdat',
                                fnCreatedCell: function (td, cellData, rowData, row, col) { $(td).css('text-align', 'center'); }
                            },
                        ]
                    });
                },
            });
            $("input[id*='Txt_Search_ProExeSurat']").on('keyup click', function () {
                filterGlobal_ProExeSurat();
            });

            $("[id*='Ddl_PXSurat_Project']").on('change', function () {
                filterProject_PXSurat();
            });
            $("[id*='Ddl_PXSurat_Cat']").on('change', function () {
                filterCat_PXSurat();
            });
        });
    </script>

Datatable can working properly when show row number < = 259, but when row number >= 260 datatable cannot show data (always blank). What is the problem? Is there any solution to solve this?

kthorngren · May 2019

Do you get any alert messages or errors in the browser's console?

The place to start is to see what the JSON response is in the browser's developer tools > network. Or you could use console.log(data); in the Ajax success function (line 11).

Kevin

synyuno · May 2019

Hi kthorngren,
From Chrome's Developer Console, i found this :
jquery-1.12.4.js:10254 POST http://10.54.2.20:85/ProExe_Surat.aspx/GetTable 500 (Internal Server Error)

I dont know about this error, because when i change SQL to "SELECT TOP 259 Tbl_ProExecution_Surat...." then nothing error happend and everything okay.
Can you help me ?

kthorngren · May 2019

500 (Internal Server Error)

That is an error from your server. You will need to look at your server logs to see why the error is occurring.

Kevin

synyuno · May 2019

Hi Kevin,

I still haven't found the problem. I have checked IIS Server Log but only got information below :
"2019-05-14 00:29:41 10.54.2.20 POST /ProExe_Surat.aspx/GetTable - 85 - 10.54.73.90 Mozilla/5.0+(Windows+NT+10.0;+Win64;+x64)+AppleWebKit/537.36+(KHTML,+like+Gecko)+Chrome/74.0.3729.131+Safari/537.36 500 0 0 99"

And this is i sent you ASP.net script for GetTable function like below :

 <WebMethod()> _
    Public Shared Function GetTable(ByVal product As Product) As List(Of Product)
        Dim constr As String = ConfigurationManager.ConnectionStrings("MySQLConnection").ConnectionString
        Dim con As New SqlConnection(constr)
        Dim sql As String
        Dim rdr As SqlDataReader
        Dim PXSurat As New List(Of Product)()

        con.Open()

        'SELECT TOP 260 -> Blank
        sql = "SELECT Tbl_ProExecution_Surat.*"
        sql = sql & ", Tbl_Project.Nama_Project, Tbl_Project.ID_Pro"
        sql = sql & ", Tbl_CategoryProExeSurat.*"
        sql = sql & " FROM (Tbl_ProExecution_Surat"
        sql = sql & " LEFT JOIN Tbl_Project ON Tbl_Project.ID_Pro = Tbl_ProExecution_Surat.ID_Pro_ConPxSurat)"
        sql = sql & " LEFT JOIN Tbl_CategoryProExeSurat ON Tbl_CategoryProExeSurat.ID_CatProExeSurat = Tbl_ProExecution_Surat.ID_Category_ConPxSurat"
        sql = sql & " WHERE Tbl_Project.Status = 'Active'"
        sql = sql & " ORDER BY ID_ConPxSurat"
        Dim AddCmd As SqlCommand = New SqlCommand(sql, con)
        rdr = AddCmd.ExecuteReader()

        While rdr.Read()
            Dim MyPXSurat As New Product
            MyPXSurat.id_pxSurat = rdr("ID_ConPxSurat").ToString
            MyPXSurat.docno = rdr("NoDoc_ConPxSurat").ToString
            MyPXSurat.doctitle = rdr("Nama_Doc_ConPxSurat").ToString
            MyPXSurat.pro = rdr("Nama_Project").ToString
            MyPXSurat.cat = rdr("Category_ProExeSurat").ToString
            MyPXSurat.docdat = rdr("DocDate_ConPxSurat").ToString
            MyPXSurat.fileku = rdr("File_ConPxSurat").ToString
            PXSurat.Add(MyPXSurat)
        End While
        rdr.Close()
        con.Close()

        Return PXSurat
    End Function

The script above works fine if datatable's row below 260.
Do you have any idea to solve this ?

Yuno

colin · May 2019

Hi @synyuno ,

This isn't a DataTables issue - you're initialising DataTables on the data in the Ajax response, the issue is that the Ajax request is failing some how so it'll be something on your server as Kevin said. I would try running that SQL command by hand and seeing what it does. Also see what's in the JSON response, there might be clues there too.

Cheers,

Colin

synyuno · May 2019

Hi Colin and Kevin,

yes you are right, like Kevin said, i put break point at line 11 (First Script) :

 var datatableVariable = $('#Tabel_ProExeSurat').DataTable({

when i debugging via developer tools in IE, i got this error message :

responseText "{\"Message\":\"There was an error processing the request.\",\"StackTrace\":\"\",\"ExceptionType\":\"\"}"

But i still don't know that issue because the error mesage appears if only data row above 259.

colin · May 2019

Hi @synyuno ,

Have you tried running the SQL command by hand, as I suggested? That'll tell you if the issue is with the SQL, or some kind of server data length.

Cheers,

Colin

Datatable can't show data at rows > 259

Datatable can't show data at rows > 259

Answers

Howdy, Stranger!

Categories

DataTables

Datatable can't show data at rows > 259

Datatable can't show data at rows > 259

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables