Records not getting bound on the grid - Using ASP.NET Kendo UI (Not MVC)

11 posts, 1 answers
  1. n/a
    n/a avatar
    72 posts
    Member since:
    Jan 2018

    Posted 02 Jul 2020 Link to this post

    Hi Team,
        We are using Asp.Net Kendo UI grid (not MVC).To bind the grid we are using "transport read property (Ajax POST method)" to fetch the records from the database & convert it to JsonConvert.SerializeObject, Parse it and display them on the grid.

    When we bind more than 150 records we get the below error.

    Screen Shot link

    Code mentioned below for your reference. Can you please check & help with it?

    ASP.NET - Jquery

    var gridDataSource =new kendo.data.DataSource({
    transport: {
    read: function (option) {
    $.ajax({
    type: "POST",
    url: "History.aspx/BindGridDetails",
    data: JSON.stringify({ "FromDate": $("#ContentPlaceHolder1_tdpFromDate").val(), "ToDate": $("#ContentPlaceHolder1_tdpToDate").val(), "CategoryId": $("#ContentPlaceHolder1_ddlCategory option:selected").text(), "AccountId": $("#ContentPlaceHolder1_ddlAccount option:selected").val() }),
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (response) {
    option.success(JSON.parse(response.d));
    }
    });
    }
    },

    C# code 

    if (DB.GetHistory(iOwnerID, AccountId, sCategoryID, ref DT, ref sErrorMessage, ref ToDate, ref FromDate) == false)
    {
    return sErrorMessage;
    }
    return JsonConvert.SerializeObject(DT);

  2. n/a
    n/a avatar
    72 posts
    Member since:
    Jan 2018

    Posted 03 Jul 2020 in reply to n/a Link to this post

    Hi Team, 

            Can you please check and help with this on priority?   

  3. Tsvetomir
    Admin
    Tsvetomir avatar
    796 posts

    Posted 06 Jul 2020 Link to this post

    Hi Rick,

    Based on the provided information, the error is actually a server-side error. However, the screenshot is insufficient for me to determine what might be causing the issue. 

    What I can recommend is that you open the Network tab of the dev tools, perform the request, and examine the request's response. It will give you information about what is causing the problem.

    In case additional assistance is needed, let me know.

     

    Kind regards,
    Tsvetomir
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
  4. n/a
    n/a avatar
    72 posts
    Member since:
    Jan 2018

    Posted 06 Jul 2020 in reply to Tsvetomir Link to this post

    Hi Tsvetomir,

    As said before we are using Asp.Net Kendo UI (Not MVC).

    We referred this link (https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/configuration/transport.read#transport.read.cache) to bind the records in the grid. On this link,  for ajax method you have used  (https) link on URL to call the records on transport read property.

    For the ajax method we have called the web on the code behind (static method).

    We are getting the records on the datatable, change it to JsonConvert.SerializeObject & return it to Ajax.

    Returned data is parsed & bound on the grid. Code snippet mentioned below for your reference.

    JQuery - Ajax :
    var gridDataSource = new kendo.data.DataSource({
     transport: {
            read: function (options) {
                $.ajax({
                    type: "POST",
                    url: "History.aspx/BindGridDetails",
                    data: JSON.stringify({ "FromDate": $("#ContentPlaceHolder1_tdpFromDate").val(), "ToDate": $("#ContentPlaceHolder1_tdpToDate").val(), "CategoryId": $("#ContentPlaceHolder1_ddlCategory option:selected").text(), "AccountId": $("#ContentPlaceHolder1_ddlAccount option:selected").val() }),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {
                        options.success(JSON.parse(response.d));
                    }
                });
            }
        },
    });

    C# Code behind :
    [WebMethod]
            public static string BindGridDetails(DateTime FromDate, DateTime ToDate, string CategoryId,int AccountId)
            {
                DataTable DT = new DataTable();
               
                    int iOwnerID = Convert.ToInt32(HttpContext.Current.Session["OwnerID"]);
                    string sErrorMessage = string.Empty;              
      
                    SqlDataReader DR = null;
                    DBClass DB = new DBClass();               

                    if (DB.GetHistory(iOwnerID, AccountId, sCategoryID, ref DT, ref sErrorMessage, ref ToDate, ref FromDate) == false)
                    {                 
                        return sErrorMessage;
                    }
                }
               return JsonConvert.SerializeObject(DT);
            }

    Database class :
      public bool GetHistory(int iOwnerID, int iLocationID, string sCategory, ref DataTable DT, ref string sErrorMessage, ref DateTime toDate, ref DateTime fromDate)
            {
                DT = new DataTable();
                CreateNewCommand(CommandType.Text);
                {
                    var withBlock = _cmd;
                    withBlock.CommandText = "SELECT top(190) Cast(T.EDate AS Date) as CompDate, T.ID  AS TicketNumber, T.WorkOrder, L.Tag AS Account, " + "E.Unit, T.Cat, W.fDesc AS Mechanic, (T.Reg + T.OT + T.DT + T.NT) as Hours," + " CASE WHEN Charge = 1 or isnull(Invoice, 0) > 0 THEN '$' ELSE ' ' END AS Billable ,  T.fDesc AS ScopeOfWork, T.DescRes AS Resolution" + " FROM TicketD T  " + " INNER JOIN Loc L  ON T.Loc = L.loc  " + " INNER JOIN tblWork W ON T.fWork = W.ID  " + " LEFT JOIN Elev E ON  T.Elev=E.ID  " + " WHERE L.Owner = " + iOwnerID + GetHistoryWhere(iLocationID, sCategory) + " AND T.Internet = 1 AND EDate <= '" + toDate.Date + "' AND EDate >= '" + fromDate.Date + "'" + " ORDER BY T.EDate DESC";
                    try
                    {
                        SqlDataAdapter DA = new SqlDataAdapter(_cmd);
                        DA.Fill(DT);
                    }
                    catch (Exception X)
                    {
                        sErrorMessage = X.Message;
                        RemoveAllParameters(ref _cmd);
                        return false;
                    }
                    RemoveAllParameters(ref _cmd);
                    return true;
                }
            }

    If we get Top(100/150) records, it is getting bound correctly on the grid but if we get more than 190 we get the error.

    Video link mentioned below for your reference. Please check & let us know if you need more information on it.

    Video Link

  5. n/a
    n/a avatar
    72 posts
    Member since:
    Jan 2018

    Posted 07 Jul 2020 in reply to n/a Link to this post

    Hi Tsvetomir,

        Do we need to furnish any other information? Can you please help me with the solution asap?

  6. n/a
    n/a avatar
    72 posts
    Member since:
    Jan 2018

    Posted 08 Jul 2020 in reply to n/a Link to this post

    Hi Tsvetomir,

      While checking this issue we found the below errors on the Console Tab. Can you please check and help with this?

     

    Screen Shot link

  7. Tsvetomir
    Admin
    Tsvetomir avatar
    796 posts

    Posted 08 Jul 2020 Link to this post

    Hi Rick,

    Indeed, the information that you have provided code-wise is sufficient. However, as stated earlier, the exception that you observe is on the server-side. The only information that you have provided is that the request returns a status of 500 - a server-side error. 

    It is possible for you to open the devtools of the browser and navigate to the Network tab. Navigate to the Read request of the grid and investigate the response - it will contain detailed information on what exactly the exception is. This information is crucial in order for me to understand where the problem stems from.

    Attached to my response is a sample project with jQuery implementation and MVC server-side. It loads 350 items. Could you examine it and let me know on the steps needed to replicate the issue?

     

    Regards,
    Tsvetomir
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
  8. n/a
    n/a avatar
    72 posts
    Member since:
    Jan 2018

    Posted 08 Jul 2020 in reply to Tsvetomir Link to this post

    Hi Tsvetomir,

             Thanks for the sample project but we are using Asp.Net with Kendo UI & not MVC. Can you please help out with a sample project with it?

    I have taken a screenshot of the Internal server error 500. Hope this helps. Please do check & let me know you need any other information on it.

    Screen Shot link

  9. Answer
    Tsvetomir
    Admin
    Tsvetomir avatar
    796 posts

    Posted 09 Jul 2020 Link to this post

    Hi Rick,

    The stack trace for the error on the client-side does not provide accurate information on what exactly is the error. As per my request, could you open the Network tab:

    https://www.screencast.com/t/D396xPxjj

    In your case, the request will have the text in red color. After you click on the request itself, navigate to the response, and check the actual error.

    https://www.screencast.com/t/IByUwRCqbjaC

    Instead of a JSON string that is the data for the grid, you will have a descriptive text of the error.

    Looking forward to you sharing the server-side error.

     

    Kind regards,
    Tsvetomir
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
  10. n/a
    n/a avatar
    72 posts
    Member since:
    Jan 2018

    Posted 09 Jul 2020 in reply to Tsvetomir Link to this post

    Thanks for your timely support.

    Sorry, now I clearly understood what you meant earlier.

    I found the exact issue & I have resolved it.

    While changing the datatable as Jsonserialize, it does not accept huge records because the Jsonserialize default max length value is very less. On the web config I have added the max length value for Jsonserialization. ScreenShot mentioned below.

    Screen Shot link

  11. Tsvetomir
    Admin
    Tsvetomir avatar
    796 posts

    Posted 10 Jul 2020 Link to this post

    Hi Rick,

    I am happy to hear that you have resolved the issue. Indeed, this is one option to set the max length for the JSON. Instead of setting it for the whole application, you could opt for setting it per-ActionMethod. Here is an example that you might find helpful:

    https://stackoverflow.com/questions/5692836/maxjsonlength-exception-in-asp-net-mvc-during-javascriptserializer

     

    Regards,
    Tsvetomir
    Progress Telerik

Back to Top