如何在不保存到数据库的情况下将数据添加到 Telerik UI for ASP.NET MVC 的网格中？

Question

你们知道如何在不将数据插入数据库的情况下在 telerik 中插入数据吗？因为我需要先保存数据，然后创建一个按钮将所有数据提交到数据库。

这是我的网格

@(Html.Kendo().Grid<COGS.Models.Invoice>()
        .Name("invoice-grid")
            .Events(e => {
                e.Edit("onEdit");
            }   
        )
        .DataSource(DataSource => DataSource
            .Ajax() 
            .Model(model => model.Id(data => data.InvoiceNumber))
            .Read(read => read
                    .Action("ReadInvoiceData", "Home"))
                    .Create(create => create.Action("CreateInvoiceData", "Home"))
                    .Update(update => update.Action("UpdateInvoiceData", "Home"))
                    .Destroy(destroy => destroy.Action("DeleteInvoiceData", "Home"))
        )
        .Columns(columns =>
                {
                    columns.Bound(data => data.InvoiceNumber);
                    columns.Bound(data => data.Date).EditorTemplateName("Date").Format("{0:MM/dd/yyyy}");
                    columns.Bound(data => data.RecievedDate).EditorTemplateName("Date").Format("{0:MM/dd/yyyy}");
                    columns.Command(command =>
                    {
                        command.Edit();
                        command.Destroy();
                    }).Title("Command").Width("250px");
                }
        )
        .ToolBar(toolbar =>
        {
            toolbar.Create().Text("Add New Invoice");
        })
        .Editable(editable => editable.Mode(GridEditMode.InLine))
        .Pageable()
        .Sortable()
    )

这是我的控制器

public ActionResult ReadInvoiceData([DataSourceRequest] DataSourceRequest request)
    {
        IQueryable<Invoice> data = connection.Invoices.Where(x => x.Status == 1 && x.WaybillNumber == null);
        DataSourceResult result = data.ToDataSourceResult(request);
        return Json(result, JsonRequestBehavior.AllowGet);
    }

public ActionResult CreateInvoiceData([DataSourceRequest] DataSourceRequest request, Invoice invoice)
    {
        if (ModelState.IsValid)
        {
            var entity = new Invoice
            {
                InvoiceNumber = invoice.InvoiceNumber,
                Date = invoice.Date,
                RecievedDate = invoice.RecievedDate,
                WaybillNumber = invoice.WaybillNumber,
                Status = invoice.Status
            };

            connection.Invoices.Add(entity);
            connection.SaveChanges();
        }
        return Json(new[] { invoice }.ToDataSourceResult(request, ModelState));
    }

public ActionResult UpdateInvoiceData([DataSourceRequest] DataSourceRequest request, Invoice invoice)
    {
        if (ModelState.IsValid)
        {
            var entity = new Invoice
            {
                InvoiceNumber = invoice.InvoiceNumber,
                Date = invoice.Date,
                RecievedDate = invoice.RecievedDate,
                WaybillNumber = invoice.WaybillNumber,
                Status = invoice.Status
            };

            connection.Invoices.Attach(entity);
            connection.Entry(entity).State = EntityState.Modified;
            connection.SaveChanges();
        }
        return Json(new[] { invoice }.ToDataSourceResult(request, ModelState));
    }

public ActionResult DeletePOData([DataSourceRequest] DataSourceRequest request, PurchaseOrder purchaseOrder)
    {
        if (ModelState.IsValid)
        {
            var entity = new PurchaseOrder
            {
                PONumber = purchaseOrder.PONumber,
                Date = purchaseOrder.Date,
                Origin = purchaseOrder.Origin,
                Vendor = purchaseOrder.Vendor,
                Status = purchaseOrder.Status
            };

            connection.PurchaseOrders.Attach(entity);
            connection.PurchaseOrders.Remove(entity);
            connection.SaveChanges();

        }
        return Json(new[] { purchaseOrder }.ToDataSourceResult(request, ModelState));
    }

编辑：我设法在不插入数据库的情况下添加数据并删除此行

connection.SaveChanges();

来自控制器中的创建函数，但现在我如何创建一个按钮来将网格中的所有数据保存到数据库？我假设它将使用 javascript 来做到这一点

Answer 1

以下是来自 KendoUI 文档网站的示例： http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#methods-sync

<script>
var dataSource = new kendo.data.DataSource({
  batch: true,
  transport: {
    read:  {
      url: "http://demos.telerik.com/kendo-ui/service/products",
      dataType: "jsonp" //"jsonp" is required for cross-domain requests; use "json" for same-domain requests
    },
    update: {
      url: "http://demos.telerik.com/kendo-ui/service/products/update",
      dataType: "jsonp" //"jsonp" is required for cross-domain requests; use "json" for same-domain requests
    },
    destroy: {
      url: "http://demos.telerik.com/kendo-ui/service/products/destroy",
      dataType: "jsonp" //"jsonp" is required for cross-domain requests; use "json" for same-domain requests
    }
  },
  schema: {
    model: { id: "ProductID" }
  }
});
dataSource.fetch(function() {
  var product = dataSource.at(0);
  product.set("UnitPrice", 20);
  var anotherProduct = dataSource.at(1);
  anotherProduct.set("UnitPrice", 20);
  var yetAnotherProduct = dataSource.at(2);
  dataSource.remove(yetAnotherProduct);
  dataSource.sync(); // makes a request to http://demos.telerik.com/kendo-ui/service/products/update" and http://demos.telerik.com/kendo-ui/service/products/destroy
});
</script>

因此在 javascript 中，您必须找到网格小部件，获取其数据源并调用其上的同步方法。

var grid = $("#mygrid.k-grid").data('kendoGrid');
var ds = grid.dataSource;
ds.sync();

如何在不保存到数据库的情况下将数据添加到 Telerik UI for ASP.NET MVC 的网格中？

How to add data into grid in Telerik UI for ASP.NET MVC without saving to database?

c#

asp.net

asp.net-mvc

telerik