【问题标题】:Kendo Grid Paging doesn't work MVC剑道网格分页不起作用 MVC
【发布时间】:2016-09-27 13:21:25
【问题描述】:

我有 kendogrid,分页数还可以,每页的项目还可以,但是当我按页码时,网格中的结果没有改变,所有结果都显示在第一页。请在此处提供帮助。下面是我的代码。谢谢

                    $(function() {
                        $("#invoices-grid").kendoGrid({
                            dataSource: {
                                data: @Html.Raw(JsonConvert.SerializeObject(Model.Invoices)),
                                schema: {
                                    model: {
                                        fields: {
                                            JobNumber: { type: "string" },
                                            CustomerName: { type: "string" },
                                            DepartmentName: { type: "string" },
                                            DateInvoice: { type: "string" },
                                            ValidDays: { type: "number" },
                                            Delivery: { type: "string" },
                                            IsPayed: { type: "boolean" },
                                            Payed: { type: "number" },
                                            Status: { type: "boolean" },
                                        }
                                    }
                                },
                                @*type: "json",
                   transport: {
                       read: {
                           url: "@Html.Raw(Url.Action("List", "Finances"))",
                           type: "POST",
                           dataType: "json",
                           data: additionalData1
                       },

                   },
                   schema: {
                       data: "Data",
                       total: "Total",
                       errors: "Errors"
                   },*@
                                error: function(e) {
                                    display_kendoui_grid_error(e);
                                    // Cancel the changes
                                    this.cancelChanges();
                                },
                                pageSize: 20,
                                serverPaging: true,
                                serverFiltering: true,
                                serverSorting: true
                            },


                            columns: [

                                {
                                    field: "JobNumber",
                                    title: "@T("gp.Invoice.Fields.JobNumber")",
                                    template: '#= JobNumber #'
                                },
                                {
                                    field: "CustomerName",
                                    title: "@T("gp.Invoice.Fields.CustomerName")",
                                    template: '#= CustomerName #'
                                },
                                {
                                    field: "DepartmentName",
                                    title: "@T("gp.Invoice.Fields.DepartmentName")",
                                    template: '#= DepartmentName #'
                                },
                                {
                                    field: "DateInvoice",
                                    title: "@T("gp.Invoice.Fields.DateInvoice")",
                                    template: '#= DateInvoice #'
                                },
                                {
                                    field: "ValidDays",
                                    title: "@T("gp.Invoice.Fields.ValidDays")",
                                    template: '#= ValidDays #'
                                },
                                {
                                    field: "Delivery",
                                    title: "@T("gp.Invoice.Fields.Delivery")",
                                    template: '#= Delivery #'
                                },
                                {
                                    field: "Payed",
                                    title: "@T("gp.Invoice.Fields.IsPayed")",
                                    template: '#= (Payed == 2) ? "Комп." : ((Payed == 1) ? "ДЕ" : "НЕ") #'
                                },

                                {
                                    field: "Id",
                                    title: "@T("Common.Edit")",
                                    width: 100,
                                    template: '<a href="Edit/#=Id#">@T("Common.Edit")</a>'
                                },

                            ],
                            pageable: {
                                refresh: true,
                                pageSizes: [5, 10, 20, 50]
                            },
                            editable: {
                                confirmation: false,
                                mode: "popup"
                            },
                            scrollable: false,

                            selectable: true,
                            change: function(e) {
                                var selectedRows = this.select();

                                var jobId = parseInt($(selectedRows).data('job-id'));
                                var jobItemId = parseInt($(selectedRows).data('job-item-id'));

                                var result = $.get("@Url.Action("SideDetails", "Production")/" + jobItemId);

                                result.done(function(data) {

                                    if (data) {
                                        $(".job-edit .jobItemDetails").html(data);
                                    }

                                });

                            },

                            rowTemplate: kendo.template($("#invoiceRowTemplate").html()),

                        });
                    });

            </script>



       protected virtual void PrepareInvoiceFinanceListModel(FinanceListModel model,FormCollection form/*,string SearchJobItemNumber*/)
    {

        var customers = model.SearchCustomerId;
        var isChecked = model.IsChecked;
        var searchString = model.SearchJobItemNumber;
        var IsChecked1 = model.IsChecked1;
        // searchString = model.SearchJobItemNumber;/* "001/2016";*/
        //var searchString = model.SearchJobItemNumber;
        //searchString = "091/2016";
        if (model == null)
            throw new ArgumentNullException("model");

        var finishedJobs = _jobService.GetJobsByHasInvoice(false);

        finishedJobs = finishedJobs.OrderByDescending(x =>
        {
            var firstOrDefault = x.JobItems.FirstOrDefault();
            return firstOrDefault?.DateCompletition ?? new DateTime();


        }).ToList();

        foreach (var job in finishedJobs)
        {
            var jobModel = job.ToModel();

            model.FinishedJobs.Add(jobModel);
        }

        var jobsBycustomers = finishedJobs.GroupBy(x => new { x.CustomerId, x.Customer.Name }).Select(x => new JobCustomersModel()
        {
            CustomerId = x.Key.CustomerId,
            CustomerName = x.Key.Name,
            JobsCount = x.Count(),
        });

        model.FinishedJobStatus = new JobStatusesModel()
        {
            Status = _localizationService.GetResource("gp.jobs.whitout.invoice"),
            Value = (int)JobStatusEnum.Finished,
            Count = finishedJobs.Count,
            CustomersJobs = jobsBycustomers.ToList()
        };

        var invoices = _invoiceService.GetAllInvoices(searchString, isChecked, IsChecked1, customers);
        foreach (var invoice in invoices)
        {
            var inv = invoice.ToModel();
           // var a = invoice.Payed;
            model.Invoices.Add(inv);
        }
        /////////////////////             ////////////////////////
        //var allCustomers = _invoiceService.GetAllCustomers(customers);
        //foreach (var customer in allCustomers)
        //{
        //    var cust = customer.ToModel();
        //    model.SearchCustomerId = customer.CustomerId;
        //    model.Invoices.Add(cust);

        //}

        var invoiceByCustomer =
            invoices.GroupBy(x => new { x.CustomerId, x.CustomerName }).Select(x => new JobCustomersModel()
            {
                CustomerId = x.Key.CustomerId,
                CustomerName = x.Key.CustomerName,
                JobsCount = x.Count(),
            });

        model.InvoiceStatus = new JobStatusesModel()
        {
            Status = _localizationService.GetResource("gp.jobs.with.invoice"),
            Value = (int)JobStatusEnum.Finished,
            Count = invoices.Count,
            CustomersJobs = invoiceByCustomer.ToList()
        };



        var latestOffers = _offerService.GetLatestOffers(0, 10);
        foreach (var offer in latestOffers)
        {
            var offerModel = offer.ToModel();

            model.LatestOffers.Add(offerModel);
        }


    }

【问题讨论】:

  • 有人能帮帮我吗?

标签: asp.net-mvc kendo-ui


【解决方案1】:

目前已启用服务器操作...

serverPaging: true,
serverFiltering: true,
serverSorting: true

...但是transport 配置被注释掉了。这就是问题的原因。

如果要使用服务器操作,则配置数据源transport。否则,使用本地数据绑定并禁用服务器操作,如下例所示:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Untitled</title>

    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.914/styles/kendo.common.min.css">
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.914/styles/kendo.default.min.css">

    <script src="http://code.jquery.com/jquery-1.12.3.min.js"></script>
    <script src="http://kendo.cdn.telerik.com/2016.3.914/js/kendo.all.min.js"></script>
  </head>
  <body>

    <div id="invoices-grid"></div>

    <script>
      $(function() {

        var d = [];

        for (var i = 1; i <= 100; i++) {
          d.push({Id: i, CustomerName: "CustomerName " + i});
        }

        $("#invoices-grid").kendoGrid({
          dataSource: {
            data: d,
            schema: {
              model: {
                id: "Id",
                fields: {
                  CustomerName: { type: "string" }
                }
              }
            },

            error: function(e) {
              display_kendoui_grid_error(e);
              // Cancel the changes
              this.cancelChanges();
            },
            pageSize: 20,
            //serverPaging: true,
            //serverFiltering: true,
            //serverSorting: true
          },


          columns: [

            {
              field: "CustomerName",
              title: "gp.Invoice.Fields.CustomerName",
              template: '#= CustomerName #'
            },
            {
              field: "Id",
              title: "Common.Edit",
              width: 100,
              template: '<a href="Edit/#=Id#">Common.Edit</a>'
            },

          ],
          pageable: {
            refresh: true,
            pageSizes: [5, 10, 20, 50]
          },
          editable: {
            confirmation: false,
            mode: "popup"
          },
          scrollable: false,

          selectable: true,
          change: function(e) {
          }


        });
      });

    </script>

  </body>
</html>

【讨论】:

  • 我可以在这段代码中添加我自己的分页方法吗?
  • 我已经编辑了问题,从控制器添加数据,这是来自控制器的数据,由剑道填充,但我不知道如何将其添加为本地源,如您的示例所示
  • 否则当我添加数据传输弹出窗口没有触发时,我无法理解这是什么问题
  • 这是工作,但现在我在网格列中的按钮没有调用剑道模板中的 javascript 函数。按钮一直工作到我点击页码的那一刻
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2023-03-18
  • 2017-03-05
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多