ServerSide Ajax Call not working with Non-MVC asp.net project.

JackOfAll · April 2017

I've tried alot to search on google but not getting anything related to Serverside ajax with Non-MVC asp.net.
I've asked on stackoverflow also. stackoverflow.com/questions/43227910/jquery-datatables-serverside-ajax-with-asp-net-webmethod

PageLibrary.aspx :

<body>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <link href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css" rel="stylesheet" />
    <script type="text/javascript" src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
        <script>
            try {
                $(document).ready(function () {
                    $('#GridBooksList').dataTable({
                                "bServerSide": true,
                                "bProcessing": true,
                                "sAjaxSource": "PageLibrary.aspx/GetBooks",
                                "aoColumns": [
                                               { "sName": "NAME" },
                                               { "sName": "SERIAL_NUMBER" },
                                               { "sName": "AUTHOR" }
                                ]
                            });
                });
            } catch (ee) {
                alert(ee.message);
            }
    </script>
    <form id="form2" runat="server">
        <table id="GridBooksList" class="table table-bordered" style="text-align: center; width: 100%; height:100%" >
            <thead>
                <tr>
                <th>NAME</th>
                <th>SERIAL_NUMBER</th>
                <th>AUTHOR</th>
            </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
    </form>
</body>

PageLibrary.aspx.cs :

    public static IList<BookDetail> booklist = null;
    
    [WebMethod]
    public static IList<BookDetail> GetBooks(JQueryDataTableParamModel param)
    {
        try
        {
            int i = 0;
            while (i < 10)
            {
                booklist.Add(new BookDetail { AUTHOR = "AAAA" + i.ToString(), NAME = "BBB" + i.ToString(), SERIAL_NUMBER = "CCC" + i.ToString() });
                i++;
            }
            return booklist;
        }
        catch
        {
            return null;
        }
    }

Getting error :
DataTables warning: table id=GridBooksList - Invalid JSON response. For more information about this error, please see http://datatables.net/tn/1

Please tell me where i'm doing wrong? How can i implement Serverside ajax call in non-mvc asp.net project.

Regards,
Jack

allan · April 2017

Hi Jack,

If you follow the instructions at the tech note that the error links to, what does it show that the server is returning instead of valid JSON?

Allan

JackOfAll · April 2017

Hello Allan,
GetBooks() is actually not getting hit by ajax call, and not getting any JSON return.
I've done some changes in my code to make it execute the GetBooks() method.

Please check:

$('#GridBooksList').dataTable({
                        "processing": true,
                        "serverSide": true,
                        "ajax": {
                            url: "Default.aspx/GetBooks",
                            type: "GET",
                            dataType: "json",
                            contentType: "application/json; charset=utf-8"
                        },
                        "columns": [{ "sName": "NAME" },
                                    { "sName": "SERIAL_NUMBER" },
                                    { "sName": "AUTHOR" }]
                    });

and

    public class BookDetail
    {
        public string NAME { get; set; }
        public string SERIAL_NUMBER { get; set; }
        public string AUTHOR { get; set; }
    }

    
    [WebMethod]
    [ScriptMethod(UseHttpGet=true, ResponseFormat = ResponseFormat.Json)]
    public static string GetBooks()
    {
        try
        {
            List<BookDetail> booklist = new List<BookDetail>();
            int i = 0;
            while (i < 1000)
            {
                booklist.Add(new BookDetail { AUTHOR = "AAAA" + i.ToString(), NAME = "BBB" + i.ToString(), SERIAL_NUMBER = "CCC" + i.ToString() });
                i++;
            }
            JavaScriptSerializer JavaScriptSerializer = new JavaScriptSerializer();

            var jsonstr = JavaScriptSerializer.Serialize(booklist);
            return jsonstr;
            
        }
        catch
        {
            return null;
        }
    }

Is this the matter of GET and POST?
Now, I'm not getting Invalid JSON response error, But not also data is getting display in DataTable.

JackOfAll · April 2017

By POST method , I've tried the link https://datatables.net/manual/tech-notes/1

and got JSON response as:

{"Message":"Invalid JSON primitive: draw.","StackTrace":"   at System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializePrimitiveObject()\r\n   at System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializeInternal(Int32 depth)\r\n   at System.Web.Script.Serialization.JavaScriptObjectDeserializer.BasicDeserialize(String input, Int32 depthLimit, JavaScriptSerializer serializer)\r\n   at System.Web.Script.Serialization.JavaScriptSerializer.Deserialize(JavaScriptSerializer serializer, String input, Type type, Int32 depthLimit)\r\n   at System.Web.Script.Serialization.JavaScriptSerializer.Deserialize[T](String input)\r\n   at System.Web.Script.Services.RestHandler.GetRawParamsFromPostRequest(HttpContext context, JavaScriptSerializer serializer)\r\n   at System.Web.Script.Services.RestHandler.GetRawParams(WebServiceMethodData methodData, HttpContext context)\r\n   at System.Web.Script.Services.RestHandler.ExecuteWebServiceCall(HttpContext context, WebServiceMethodData methodData)","ExceptionType":"System.ArgumentException"}

allan · April 2017

What are you getting in return? Is it sending an error message back, or zero length data?

With POST:

Invalid JSON primitive: draw.

I'm afraid I have no idea what that actually means! You would need to ask on .NET programming forum or something more general like StackOverflow.

Allan

JackOfAll · April 2017

Well, I've already asked on StackOverflow

What I've written above on my previous comments: My codes are working when i'm calling Ajax by "GET" method, but getting failure when using "POST" with the same code.

A simple ASP.Net (Non-MVC) project with the functionality of ServerSide example would help.

allan · April 2017

I'm afraid I don't really know ASP.NET well enough to be able to provide such an example easily. The Editor server-side libraries have support for server-side processing and they use Web API rather then MVC. But if you aren't using Editor, that probably won't be of much help!

Allan

JackOfAll · April 2017

Anyways ! Thanks for reply

michaelkaldeck · April 2017

Is the "dataSrc": '' missing ? Like:
"ajax": {
"url": 'the/url',
"dataSrc": ''
},
Or you could not do that and add a "data": in the json response Your generate serverside.
Maybe that is the cause.

Michael

NourMazeed · October 2019

@JackOfAll, Did u solve it?

ServerSide Ajax Call not working with Non-MVC asp.net project.

ServerSide Ajax Call not working with Non-MVC asp.net project.

Answers

Howdy, Stranger!

Categories

DataTables

ServerSide Ajax Call not working with Non-MVC asp.net project.

ServerSide Ajax Call not working with Non-MVC asp.net project.

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables