Grid paging not working

[Donna Stewart]

I have a grid with server binding.  I have followed the example, but for some reason the paging is not working.  The first page populates fine, but when I hit the next page, no rows appear and the page number goes to 0.  I have the latest Kendo for MVC and I have jquery v1.8.1.  I am using Razor and C#.   I need to hvae this small project working ASAP.  Any help and/or advice anyone can give is very much appreciated.  Thank you in advance!  Is there something I'm missing?  Here is the code:
Razor page with grid:

@model IEnumerable<TrackGridModel>

<div>

    @(Html.Kendo().Grid(Model).Name("TrackGrid")

        .Columns(columns =>

        {

            columns.Bound(t => t.rowIndex).Visible(false);

            columns.Bound(t => t.trackNumber).Title("Tracking Number").Template(@<text><a href="#" onclick="getTrackDetail(@item.rowIndex)">@item.trackNumber</a></text>);

            columns.Bound(t => t.shipDate).Title("Ship Date");

            columns.Bound(t => t.originalABFlag).Title("Original/Accessorial");

            columns.Bound(t => t.refNotes).Title("Reference");

            columns.Bound(t => t.billToAccount).Title("Bill To Account");

            columns.Bound(t => t.shipperName).Title("Shipper Name");

            columns.Bound(t => t.shipperAddress).Title("Shipper Address");

            columns.Bound(t => t.recipientName).Title("Recipient Name");

            columns.Bound(t => t.recipientAddress).Title("Recipient Address");

            columns.Bound(t => t.PODDate).Title("POD Date");

            columns.Bound(t => t.service).Title("Service");

            columns.Bound(t => t.packaging).Title("Packaging");

            columns.Bound(t => t.billedWeight).Title("Billed Weight");

            columns.Bound(t => t.actualWeight).Title("Actual Weight");

        }).Pageable())

 </div>

<div style="position:relative">

@(Html.Kendo().Window().Name("TrackDetailWindow").Title("Tracking Detail").HtmlAttributes(new { style = "font-size:1.5em;" })

    .Width(1000).Height(700).Visible(false))

</div>

 

<script type="text/javascript">

    getTrackDetail = function (n) {

        var kendoWindow = $("#TrackDetailWindow").data("kendoWindow");

        kendoWindow.refresh({ url: "/Home/GetTrackDetail/",

                              data: { ndx: n} });

        kendoWindow.center();

        kendoWindow.open();

    }

 

</script>

Model:

using System.Collections.Generic;

 

public class TrackGridModel

{

    public string trackNumber {get; set;}

    public string shipDate {get; set;}

    public string refNotes {get; set;}

    public string billToAccount {get; set;}

    public string shipperName {get; set;}

    public string shipperAddress {get; set;}

    public string recipientName { get; set; }

    public string recipientAddress { get; set; }

    public string PODDate {get; set;}

    public string packaging {get; set;}

    public string service {get; set;}

    public string billedWeight {get; set;}

    public string actualWeight {get; set;}

    public int rowIndex {get; set;}

    public char originalABFlag {get; set;}

}

Controller:

public ActionResult TrackItByAccount(string acctNumbers, DateTime begindate, DateTime enddate )

{

    string[] strSplitArr = acctNumbers.Split(new string[] {"\n", "\r\n"}, StringSplitOptions.None);

    List<string> acctNums = strSplitArr.ToList<string>();

    ShipmentRetrieval shipmentRetrieval = new ShipmentRetrieval();

    ShipmentInformation shipinfo = new ShipmentInformation();

    List<ShipmentInformation> trackInfoList = new List<ShipmentInformation>();

    TrackGridModel tgm = new TrackGridModel();

    List<TrackGridModel> trackGridList = new List<TrackGridModel>();

    ShipmentInformationList shipInfoList = new ShipmentInformationList();

    List<ShipmentInformationList> shipInfoListAll = new List<ShipmentInformationList>();

    foreach (string acct in acctNums)

    {

        shipInfoList = shipmentRetrieval.getVendorDetailListByAccountAndDate(acct, begindate, enddate);

        shipInfoListAll.Add(shipInfoList);

        shipInfoList = new ShipmentInformationList();

 

    }

 

    string custRef = "";

    foreach (ShipmentInformationList sil in shipInfoListAll)

    {

        for (int i = 0; i < sil.ShipmentList.Count; i++)

        {

            shipinfo = sil.ShipmentList[i];

            foreach (KeyValuePair<string, string> reference in shipinfo.CustomerReference)

            {

                custRef = (custRef == "" ? "" : custRef + ", ") + reference.Value;

            }

            tgm.rowIndex = i;

            tgm.actualWeight = shipinfo.PackageInfo.ActualWeight.Weight.ToString() + " " + shipinfo.PackageInfo.ActualWeight.WeightUnit;

            tgm.billedWeight = shipinfo.PackageInfo.BilledWeight.Weight.ToString() + " " + shipinfo.PackageInfo.BilledWeight.WeightUnit;

            tgm.packaging = shipinfo.PackageInfo.PackageDescription;

            tgm.PODDate = shipinfo.PODInfo.PODDate;

            tgm.billToAccount = shipinfo.BillingInfo.BillToAccount;

            tgm.recipientAddress = shipinfo.RecipientInformation.Address.City + ", " + shipinfo.RecipientInformation.Address.StateProvince + "  " + shipinfo.RecipientInformation.Address.PostalCode;

            tgm.recipientName = shipinfo.RecipientInformation.Name;

            tgm.refNotes = custRef;

            tgm.service = shipinfo.PackageInfo.Service;

            tgm.shipDate = shipinfo.ShipDate;

            tgm.shipperAddress = shipinfo.ShipperInformation.Address.City + ", " + shipinfo.ShipperInformation.Address.StateProvince + "  " + shipinfo.ShipperInformation.Address.PostalCode;

            tgm.shipperName = shipinfo.ShipperInformation.Name;

            tgm.trackNumber = shipinfo.TrackingNumber;

            tgm.originalABFlag = shipinfo.OriginalABFlag;

            trackGridList.Add(tgm);

            shipinfo = new ShipmentInformation();

            tgm = new TrackGridModel();

            custRef = "";

        }

    }

     

    return PartialView("TrackGrid", trackGridList);

}

[Donna Stewart]

An update:
 
As I am trying different things to get this to work - originally in my _Layout.cshtml, I was only referencing the kendo.all.min.js.  I removed that and referenced kendo.web.min.js and kendo.aspnetmvc.min.js.  Now the grid completely disappears when I try to go to another page!  I added back the kendo.all.min.js, but I get the same behaviour - the grid disappears when I go to another page....

Here's the _Layout.cshtml as it is right now:

<!DOCTYPE html>

<html>

<head>

    <title>@ViewBag.Title</title>

    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />

    <link href="@Url.Content("~/Content/kendo/2012.2.710/kendo.common.min.css")" rel="stylesheet" type="text/css" />

    <link href="@Url.Content("~/Content/kendo/2012.2.710/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />

    <link href="@Url.Content("~/Content/kendo/2012.2.710/kendo.metro.min.css")" rel="stylesheet" type="text/css"  />

    <script src="@Url.Content("~/Scripts/jquery-1.8.1.min.js")"></script>

    <script src="@Url.Content("~/Scripts/kendo/2012.2.710/kendo.all.min.js")"></script>

    <script src="@Url.Content("~/Scripts/kendo/2012.2.710/kendo.web.min.js")"></script>

    <script src="@Url.Content("~/Scripts/kendo/2012.2.710/kendo.aspnetmvc.min.js")"></script>

</head>

 

<body>

    <div class="page">

        <section id="main">

            @RenderBody()

        </section>

    </div>

</body>

</html>

Please help!  I need this ASAP!

Thank you so much!

Donna

[PAUL]

Hey Donna we experienced the same problem it took a couple of days to figure out.

In the siteLayout.cshtml we had the following kendo scripts...notice the third one is commented out. Once we commented that out, paging and sorting worked just fine...

 @* kendo scripts*@
    <script src="@Url.Content("~/Scripts/kendo.web.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/kendo.aspnetmvc.min.js")" type="text/javascript"></script>
   @* <script src="@Url.Content("~/Scripts/kendo.all.min.js")" type="text/javascript"></script>*@


We also have the kendo style sheets included

 @* kendo css files*@
    <link rel="stylesheet" href="@Url.Content("~/Content/kendo.common.min.css")"/>
    <link rel="stylesheet" href="@Url.Content("~/Content/kendo.default.min.css")"/>


   

[Donna Stewart]

Paul,

Thank you so much for your response.  I tried your suggestions and the grid is still disappearing when I try to go to the next grid page.  I am completely at a loss!   I really appreciate you taking the time to try to help. 

Donna

[Vladimir Iliev]

Hi Donna,  


I have tried to reproduce the behavior you described on our side but without success. I would ask you to send us run-able project with the issue reproduced.

Also I would suggest you to try and change the following in your project:

• You are using at the same time "kendo.web.min.js" and "kendo.all.min.js" - please note that "kendo.all.min.js" includes Web, DataViz and Mobile scripts and you should remove the "kendo.web.min.js" . You can read our JavascriptDependencies page for more information.
• The project is using jQuery v1.8.1, which is supported only by our latest internal build. If you are using KendoUI v.2012.2 710 you should change the jQuery back to v.1.7.1.

 
Kind regards,
Vladimir Iliev
the Telerik team

[Donna Stewart]

Thank you for your response, Vladimir.  I have opened a support ticket for this.  I did try your suggestions to no avail.  The grid is still disappearing when I try to go to the next page.  I am not sure how to close this thread out , but I guess I should since I've opened a support ticket.  Thank you again for your help.

Donna

[John]

I get the same issue.  I am using the Telerik ORM for the data.  Here is my code for the view:

@model IEnumerable<LightRouteDB.Customer>


@{
    ViewBag.Title = "Customer List";
}


@(
 Html.Kendo().Grid(Model)
    .Name("CustomerGrid")
    .Columns(cols =>
    {
        cols.Bound(c => c.CustomerNum).Width(100).Groupable(false);
        cols.Bound(c => c.CustomerName).Width(200);
    })
    .Pageable()
)

and here is the code for the controller:

        //
        // GET: /Customer/


        public ActionResult Index()
        {
            return View(dbm.Customers.OrderBy(c => c.CustomerNum));
        }

Do we have to have some sort of callback? 

[John]

There was another post on a different thread with a sample app MvcApplication43 that works. The topic is Kendo Razor and Grid. Copying the kendo.web.min.js and kendo.aspnetmvc.min.js from that project to my local project solved the issue.  There is something wrong with 2012.2.710 scripts that got automatically inserted by the new kendo.ui template project.  Also, the scripts now load VERY fast as opposed to 30 to 40 seconds.

[Donna Stewart]

Hi John,

I have tried copying the js files from the MvcApplication43 that you mentioned, but it is still not working for me.  I appreciate you sharing what works for you.  I may create a new project and go from there and see if that works.

Thanks again,
Donna

[John]

If I use the content delivered stuff, it does NOT work in their test program:
    <script src="http://cdn.kendostatic.com/2012.2.710/js/kendo.web.min.js" type="text/javascript"></script>
    <script src="http://cdn.kendostatic.com/2012.2.710/js/aspnetmvc.min.js" type="text/javascript"></script>

If I use the test program files and specify the type, it does work:
    <script src="@Url.Content("~/Scripts/kendo.web.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/kendo.aspnetmvc.min.js")" type="text/javascript"></script>

So, when I copy the files from MvcApplication43, I also need to make the java script changes in _layout.cshtml

That seems to fix the issue.  In all cases, I am using jquery-1.7.1.min.js

[Donna Stewart]

Hi John,

Thank you for your help.  I found out from the support ticket I opened that I was mixing server and ajax binding.  I am accessing the action to get the grid data via a jquery post and returning a partial view.  In my grid I was using the model returned in the partial view and using server binding.  I think that was confusing it.  Once I switched my grid over to completely all Ajax binding, everything worked beautifully.   I am glad you were able to get your issues resolved as well.  I am going to mark this as resolved.

Thanks again,
Donna

[George]

I ran into this same problem using Server-side binding. I was missing the link to the "kendo.aspnetmvc.min.js" in my layout. Once that's added the paging works right away.

[Monika]

Hi Donna,

Can you please provide your code because I am having same kind of problem.

I am using AJAX binding in Kendo Grid.

Thanks
Monika

[Donna Stewart]

Hi Monika,

Here is my code.  I hope it helps.

the controller:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.Mvc;

using Kendo.Mvc.UI;

using Kendo.Mvc.Extensions;

 

using com.gmcps;

using com.gmcps.GreenMtnDataModel;

using com.gmcps.GMCDataServices;

using com.gmcps.VO;

 

namespace BNCollegeReport.Controllers

{

    public class HomeController : Controller

    {

        public ActionResult Index()

        {

 

            return View();

        }

 

        public ActionResult TrackByTrackingNumber()

        {

            try

            {

                GMCPublic gmcpublic = new GMCPublic();

                List<web_CarrierListResult> carriers = gmcpublic.getAllCarriers(11423, 11423);

                return PartialView("TrackByTrackingNumber", carriers);

            }

            catch (Exception ex) {

                ViewBag.errorMessage = ex.Message;

                return View("Error");

            }

        }

 

        public ActionResult TrackByAccount()

        {

            return PartialView("TrackByAccount");

        }

 

        public ActionResult ReturnTrackGridPartialView(string tnumbers, string carrier)

        {

            TrackByTrackGridModel tbtgModel = new TrackByTrackGridModel();

            string[] strSplitArr = tnumbers.Split(new string[] { "\n", "\r\n" }, StringSplitOptions.None);

            List<string> trackNums = strSplitArr.ToList<string>();

            string tNums = "";

            foreach (string tnum in trackNums)

            {

                tNums = tnum + "," + tNums;

            }

            tbtgModel.trackingNumbers = tNums;

            tbtgModel.carrier = carrier;

            return PartialView("TrackGridView", tbtgModel);

        }

 

        public ActionResult ReturnAccountGridPartialView(string acctNumbers, DateTime begindate, DateTime enddate )

        {

            TrackByAccountGridModel tbagModel = new TrackByAccountGridModel();

            string[] strSplitArr = acctNumbers.Split(new string[] { "\n", "\r\n" }, StringSplitOptions.None);

            string acctNums = "";

            foreach (string acct in strSplitArr)

            {

                acctNums = acct + "," + acctNums;

            }

            tbagModel.accountNumbers = acctNums;

            tbagModel.beginDate = begindate;

            tbagModel.endDate = enddate;

            return PartialView("AccountGridView", tbagModel);

        }

 

        public ActionResult TrackItByNumber([DataSourceRequest]DataSourceRequest request, string tnumbers, string carrier)

        {

            try

            {

                string[] strSplitArr = tnumbers.Split(new string[] { "," }, StringSplitOptions.None);

                List<string> trackNums = strSplitArr.ToList<string>();

                ShipmentRetrieval shipmentRetrieval = new ShipmentRetrieval();

                ShipmentInformation shipinfo = new ShipmentInformation();

                List<ShipmentInformation> trackInfoList = new List<ShipmentInformation>();

                TrackGridModel tgm = new TrackGridModel();

                List<TrackGridModel> trackGridList = new List<TrackGridModel>();

                ShipmentInformationList shipInfoList = shipmentRetrieval.getAirbillInfoList(carrier, trackNums);

                string custRef = "";

             

                for (int i =0; i < shipInfoList.ShipmentList.Count; i++)

                {

                    if (shipInfoList.ShipmentList[i].OriginalABFlag.ToString() != "O")

                    {

                        continue;

                    }

                    shipinfo = shipInfoList.ShipmentList[i];

                    if (shipinfo.CustomerReference.Count > 0){custRef = shipinfo.CustomerReference.FirstOrDefault().Value.ToString();}

                    tgm.rowIndex = i;

                    tgm.actualWeight = shipinfo.PackageInfo.ActualWeight.Weight.ToString() + " " + shipinfo.PackageInfo.ActualWeight.WeightUnit.ToString();

                    tgm.billedWeight = shipinfo.PackageInfo.BilledWeight.Weight.ToString() + " " + shipinfo.PackageInfo.BilledWeight.WeightUnit.ToString();

                    tgm.packaging = shipinfo.PackageInfo.PackageDescription;

                    tgm.PODDate = shipinfo.PODInfo.PODDate;

                    tgm.billToAccount = shipinfo.BillingInfo.BillToAccount;

                    tgm.recipientAddress = shipinfo.RecipientInformation.Address.City + ", " +

                                            shipinfo.RecipientInformation.Address.StateProvince + "  " + shipinfo.RecipientInformation.Address.PostalCode;

                    tgm.recipientName = shipinfo.RecipientInformation.Name;

                    tgm.refNotes = custRef;

                    tgm.service = shipinfo.PackageInfo.Service;

                    tgm.shipDate = shipinfo.ShipDate;

                    tgm.shipperAddress = shipinfo.ShipperInformation.Address.City + ", " +

                                            shipinfo.ShipperInformation.Address.StateProvince + "  " + shipinfo.ShipperInformation.Address.PostalCode;

                    tgm.shipperName = shipinfo.ShipperInformation.Name;

                    tgm.trackNumber = shipinfo.TrackingNumber;

                    tgm.originalABFlag = shipinfo.OriginalABFlag;

                    tgm.shipmentKey = shipinfo.ShipmentKey;

                    trackGridList.Add(tgm);

                    shipinfo = new ShipmentInformation();

                    tgm = new TrackGridModel();

                    custRef = "";

                }

                DataSourceResult result = trackGridList.ToDataSourceResult(request);

                return Json(result);

            }

            catch (Exception ex)

            {

                ViewBag.errorMessage = ex.Message + ex.StackTrace;

                return View("Error");

            }

        }

 

        public ActionResult GetTrackDetail(int shipmentKey, string trackingNumber)

        {

            ShipmentRetrieval shipmentRetrieval = new ShipmentRetrieval();

            ShipmentInformation shipinfo = new ShipmentInformation();

            shipinfo = shipmentRetrieval.GetVendorDetailInformation(trackingNumber, "", shipmentKey);

            return PartialView("TrackDetail", shipinfo);

        }

 

        public ActionResult TrackItByAccount([DataSourceRequest]DataSourceRequest request, string acctNumbers, DateTime begindate, DateTime enddate)

        {

            try

            {              

                string[] strSplitArr = acctNumbers.Split(new string[] {","}, StringSplitOptions.None);

                List<string> acctNums = strSplitArr.ToList<string>();

                ShipmentRetrieval shipmentRetrieval = new ShipmentRetrieval();

                ShipmentInformation shipinfo = new ShipmentInformation();

                List<ShipmentInformation> trackInfoList = new List<ShipmentInformation>();

                TrackGridModel tgm = new TrackGridModel();

                List<TrackGridModel> trackGridList = new List<TrackGridModel>();

                ShipmentInformationList shipInfoList = new ShipmentInformationList();

                List<ShipmentInformationList> shipInfoListAll = new List<ShipmentInformationList>();

                foreach (string acct in acctNums)

                {

                    shipInfoList = shipmentRetrieval.getVendorDetailListByAccountAndDate(acct, begindate, enddate);

                    shipInfoListAll.Add(shipInfoList);

                    shipInfoList = new ShipmentInformationList();

 

                }

 

                string custRef = "";

                foreach (ShipmentInformationList sil in shipInfoListAll)

                {

                    for (int i = 0; i < sil.ShipmentList.Count; i++)

                    {

                        if (sil.ShipmentList[i].OriginalABFlag.ToString() != "O")

                        {

                            continue;

                        }

                        shipinfo = sil.ShipmentList[i];

                        if (shipinfo.CustomerReference.Count > 0){custRef = shipinfo.CustomerReference.FirstOrDefault().Value.ToString();}

                        tgm.rowIndex = i;

                        tgm.actualWeight = shipinfo.PackageInfo.ActualWeight.Weight.ToString() + " " + shipinfo.PackageInfo.ActualWeight.WeightUnit;

                        tgm.billedWeight = shipinfo.PackageInfo.BilledWeight.Weight.ToString() + " " + shipinfo.PackageInfo.BilledWeight.WeightUnit;

                        tgm.packaging = shipinfo.PackageInfo.PackageDescription;

                        tgm.PODDate = shipinfo.PODInfo.PODDate;

                        tgm.billToAccount = shipinfo.BillingInfo.BillToAccount;

                        tgm.recipientAddress = shipinfo.RecipientInformation.Address.City + ", " +

                                                shipinfo.RecipientInformation.Address.StateProvince + "  " + shipinfo.RecipientInformation.Address.PostalCode;

                        tgm.recipientName = shipinfo.RecipientInformation.Name;

                        tgm.refNotes = custRef;

                        tgm.service = shipinfo.PackageInfo.Service;

                        tgm.shipDate = shipinfo.ShipDate;

                        tgm.shipperAddress = shipinfo.ShipperInformation.Address.City + ", " + shipinfo.ShipperInformation.Address.StateProvince + "  " + shipinfo.ShipperInformation.Address.PostalCode;

                        tgm.shipperName = shipinfo.ShipperInformation.Name;

                        tgm.trackNumber = shipinfo.TrackingNumber;

                        tgm.originalABFlag = shipinfo.OriginalABFlag;

                        tgm.shipmentKey = shipinfo.ShipmentKey;

                        trackGridList.Add(tgm);

                        shipinfo = new ShipmentInformation();

                        tgm = new TrackGridModel();

                        custRef = "";

                    }

                }

 

                DataSourceResult result = trackGridList.ToDataSourceResult(request);

                return Json(result);

            }

            catch (Exception ex)

            {

                ViewBag.errorMessage = ex.Message + ex.StackTrace;

                return View("Error");

            }

        }

    }

}

the view:

@model TrackByTrackGridModel

<script type="text/javascript">

    function doOpen() {

 

        $('.k-window').css({

            left: 10,

            top: 10

        });

    }

 

    function getTheData() {

        return { tnumbers: '@Model.trackingNumbers', carrier: '@Model.carrier' };

    }

 

    getTrackDetail = function (n, t) {

        var kendoWindow = $("#TrackDetailWindow").data("kendoWindow");

        kendoWindow.refresh({ url: '@Url.Content("~/Home/GetTrackDetail")',

            data: { shipmentKey: n, trackingNumber: t }

        });

        kendoWindow.center();

        kendoWindow.open();

    }

 

</script>

<div>

    @(Html.Kendo().Grid<TrackGridModel>().Name("TrackGrid")

        .DataSource(dataSource => dataSource

            .Ajax()

            .Read(read => read.Action("TrackItByNumber", "Home").Data("getTheData"))

        )

        .Columns(columns =>

        {

            columns.Bound(t => t.shipmentKey).Visible(false);

            columns.Bound(t => t.trackNumber).Title("Tracking Number").ClientTemplate("<a href='\\#' onclick='getTrackDetail(#= shipmentKey #, \"#= trackNumber #\")'> #= trackNumber #</a>");

            columns.Bound(t => t.shipDate).Title("Ship Date");

            columns.Bound(t => t.refNotes).Title("Reference");

            columns.Bound(t => t.billToAccount).Title("Bill To Account");

            columns.Bound(t => t.shipperName).Title("Shipper Name");

            columns.Bound(t => t.shipperAddress).Title("Shipper Address");

            columns.Bound(t => t.recipientName).Title("Recipient Name");

            columns.Bound(t => t.recipientAddress).Title("Recipient Address");

            columns.Bound(t => t.PODDate).Title("POD Date");

            columns.Bound(t => t.service).Title("Service");

            columns.Bound(t => t.packaging).Title("Packaging");

            columns.Bound(t => t.billedWeight).Title("Billed Weight");

            columns.Bound(t => t.actualWeight).Title("Actual Weight");

        }).Resizable(resize => resize.Columns(true)).Pageable(page => page.PageSizes(true)))

 </div>

<div style="position:relative">

@(Html.Kendo().Window().Name("TrackDetailWindow").Title("Tracking Detail").HtmlAttributes(new { style = "font-size:1.5em;" })

    .Width(1000).Height(700).Visible(false).Draggable(true).Events(events => events.Open("doOpen")))

</div>