结合剑道的批量编辑和多行选择

时间:2016-03-30 14:56:19

标签: javascript jquery kendo-ui telerik kendo-grid

我对剑道很新,我遇到了一些困难。

我在创建一个kendo网格时遇到问题,我可以使用网格选择功能(http://demos.telerik.com/kendo-ui/grid/selection第二个例子)进行批量内联编辑(http://demos.telerik.com/kendo-ui/grid/editing)。

基本上,我希望能够选择多个CELLS(不是行 - 所以上面链接中的第二个例子),并开始输入以编辑所有选定的单元格。

我到目前为止最接近的是创造了一些东西,我可以选择多个单元格并按下按钮来生成预定值,但这不是我想要的。

$(document).ready(function () {
               var crudServiceBaseUrl = "//demos.telerik.com/kendo-ui/service",
                    dataSource = new kendo.data.DataSource({
                        transport: {
                            read:  {
                                url: crudServiceBaseUrl + "/Products",
                                dataType: "jsonp"
                            },
                            update: {
                                url: crudServiceBaseUrl + "/Products/Update",
                                dataType: "jsonp"
                            },
                            destroy: {
                                url: crudServiceBaseUrl + "/Products/Destroy",
                                dataType: "jsonp"
                            },
                            create: {
                                url: crudServiceBaseUrl + "/Products/Create",
                                dataType: "jsonp"
                            },
                            parameterMap: function(options, operation) {
                                if (operation !== "read" && options.models) {
                                    return {models: kendo.stringify(options.models)};
                                }
                            }
                        },
                        batch: true,
                        pageSize: 20,
                        schema: {
                            model: {
                                id: "ProductID",
                                fields: {
                                    ProductID: { editable: false, nullable: true },
                                    ProductName: { validation: { required: true } },
                                    UnitPrice: { type: "number", validation: { required: true, min: 1} },
                                    Discontinued: { type: "boolean" },
                                    UnitsInStock: { type: "number", validation: { min: 0, required: true } }
                                }
                            }
                        }
                    });

                $("#cellSelection").kendoGrid({
                    dataSource: dataSource,
                    selectable: "multiple cell",
                    pageable: {
                        buttonCount: 5
                    },
                    scrollable: false,
                    navigatable: true,
                    columns: [
                        "ProductName",
                        { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: 120 },
                        { field: "UnitsInStock", title: "Units In Stock", width: 120 },
                        { field: "Discontinued", width: 120 },
                        { command: "destroy", title: " ", width: 150 }],
                    editable: true
                });
            });

感谢您的帮助

0 个答案:

没有答案