[Solved] ASP.Net jQuery Ajax Error: Undefined response

Jilsoft
 
on Jul 07, 2021 11:03 PM
Sample_181985.zip
6268 Views

Hello,

I am using List (of T) in webservice to populate data from sql database into html table using ajax call.

I works perfectly but i get error undefined when the populating data exceed 301.

<script type="text/javascript">
   $(function () {
       $.ajax({
           type: "POST",
           url: "frmStudentList.aspx/GetStudentList",
           data: '{}',
           contentType: "application/json; charset=utf-8",
           dataType: "json",
           success: function (response) { alert(response.d); },
           failure: function (response) { alert(response.d); },
           error: function (response) { alert(response.d); }
       });
   });
     
   function OnSuccess(response) {
       $(function () {
           $('[id*=gvCustomers]').prepend($("<thead></thead>").append($(this).find("tr:first"))).DataTable({
               "responsive": true, "lengthChange": true, "autoWidth": false,
               "sLoadingRecords": {"loadingRecords": "Please wait - loading..."},
               lengthMenu: [[10, 20, -1], [10, 20, "All"]],
               "buttons": ["copy", "excel", "pdf", "print"],
               data: response.d,
               columns: [
                 { 'data': 'STUDENT_ID' },
                 { 'data': 'FULL_NAME' },
                 { 'data': 'GENDER' },
                 { 'data': 'PROGRAME' },
                 { 'data': 'FORM' },
                 { 'data': null, title: 'Edit', wrap: true, "render": function (item) { return '<div class="btn-group"> <button type="button" onclick="fnEdit(' + item.STUDENT_ID + ')"  class="btn btn-block btn-success btn-xs"><i class="fas fa-pencil-alt"></i> Edit</button></div>' } },
                 { 'data': null, title: 'Deactivate', wrap: true, "render": function (item) { return '<div class="btn-group"> <button type="button" onclick="fnDelete(' + item.STUDENT_ID + ')" class="btn btn-block btn-danger btn-xs"><i class="fas fa-trash"></i> Deactivate</button></div>' } },
                 ]
           }).buttons().container().appendTo('[id*=gvCustomers_wrapper] .col-md-6:eq(0)');
       });
   };

 

<WebMethod()> _
Public Shared Function GetStudentList() As List(Of STD)
    Dim strConnString As String = ConfigurationManager.ConnectionStrings("conString").ConnectionString
    Using con As New SqlConnection(strConnString)
        Using cmd As New SqlCommand("SELECT TOP 5 *  FROM STUDENT_RECORD ORDER BY FULL_NAME", con)
 
            Dim STDs As New List(Of STD)()
            con.Open()
            Using sdr As SqlDataReader = cmd.ExecuteReader()
                While sdr.Read()
                    STDs.Add(New STD() With { _
                        .STUDENT_ID = sdr("STUDENT_ID").ToString(), _
                        .FULL_NAME = sdr("FULL_NAME").ToString(), _
                        .GENDER = sdr("GENDER").ToString(), _
                        .PROGRAME = sdr("PROGRAME").ToString(), _
                    .FORM = sdr("FORM").ToString() _
                    })
                End While
            End Using
            Return STDs
            con.Close()
        End Using
    End Using
End Function
 
Public Class STD
    Public Property STUDENT_ID() As String
    Public Property FULL_NAME() As String
    Public Property GENDER() As String
    Public Property PROGRAME() As String
    Public Property FORM() As String
End Class

 

Download FREE API for Word, Excel and PDF in ASP.Net: Download
dharmendr
 
on Jul 08, 2021 05:20 AM
on Jul 08, 2021 05:20 AM

Hi Jilsoft,

Refer below modified code.

HTML

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" />
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.4.2/css/buttons.dataTables.min.css" />
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.4.2/js/dataTables.buttons.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.4.2/js/buttons.print.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.html5.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.colVis.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/fixedcolumns/3.2.6/js/dataTables.fixedColumns.min.js"></script>
<script type="text/javascript">
    $(function () {
        $.ajax({
            type: "POST",
            url: "frmStudentList.aspx/GetStudentList",
            data: '{}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: OnSuccess,
            failure: function (response) { alert(response.responseText); },
            error: function (response) { alert(response.responseText); }
        });
    });

    function OnSuccess(response) {
        $('[id*=gvCustomers]').prepend($("<thead></thead>").append($(this).find("tr:first"))).DataTable({
            "responsive": true, "lengthChange": true, "autoWidth": false,
            "sLoadingRecords": { "loadingRecords": "Please wait - loading..." },
            "lengthMenu": [[10, 20, -1], [10, 20, "All"]],
            "buttons": ["copy", "excel", "pdf", "print"],
            data: response.d,
            columns: [
                { 'data': 'STUDENT_ID' },
                { 'data': 'FULL_NAME' },
                { 'data': 'GENDER' },
                { 'data': 'PROGRAME' },
                { 'data': 'FORM' },
                { 'data': null, title: 'Edit', wrap: true, "render": function (item) { return '<div class="btn-group"> <button type="button" onclick="fnEdit(' + item.STUDENT_ID + ')"  class="btn btn-block btn-success btn-xs"><i class="fas fa-pencil-alt"></i> Edit</button></div>' } },
                { 'data': null, title: 'Deactivate', wrap: true, "render": function (item) { return '<div class="btn-group"> <button type="button" onclick="fnDelete(' + item.STUDENT_ID + ')" class="btn btn-block btn-danger btn-xs"><i class="fas fa-trash"></i> Deactivate</button></div>' } },
            ]
        }).buttons().container().appendTo('[id*=gvCustomers_wrapper] .col-md-6:eq(0)');
    };
</script>

Code

<WebMethod()>
Public Shared Function GetStudentList() As List(Of STD)
    Dim strConnString As String = ConfigurationManager.ConnectionStrings("conString").ConnectionString
    Using con As New SqlConnection(strConnString)
        Using cmd As New SqlCommand("SELECT TOP 5 *  FROM STUDENT_RECORD ORDER BY FULL_NAME", con)
            Dim STDs As New List(Of STD)()
            con.Open()
            Using sdr As SqlDataReader = cmd.ExecuteReader()
                While sdr.Read()
                    STDs.Add(New STD() With {
                        .STUDENT_ID = sdr("STUDENT_ID").ToString(),
                        .FULL_NAME = sdr("FULL_NAME").ToString(),
                        .GENDER = sdr("GENDER").ToString(),
                        .PROGRAME = sdr("PROGRAME").ToString(),
                        .FORM = sdr("FORM").ToString()
                    })
                End While
            End Using
            Return STDs
            con.Close()
        End Using
    End Using
End Function

Public Class STD
    Public Property STUDENT_ID() As String
    Public Property FULL_NAME() As String
    Public Property GENDER() As String
    Public Property PROGRAME() As String
    Public Property FORM() As String
End Class

 

Jilsoft
 
on Jul 08, 2021 02:55 PM

Thank you.

Problem solved. I added the below code to the web config.

<system.web.extensions>
    <scripting>
        <webServices>
            <jsonSerialization maxJsonLength="819200000" />
        </webServices>
    </scripting>
</system.web.extensions>