将选定的行分配为其他网格数据源 [英] Assigning selected rows as other grid datasource

问题描述

我正在按照以下步骤设置方案:

I am working on setting up a scenario as following:

1)在第一个网格上向用户显示现有结果

1) User is shown existing results on first grid

2)用户可以选择多个结果，然后单击编辑"按钮，该按钮将从第一个网格中提取所选项目

2) User can select multiple results and click an 'Edit' button which will extract the selected items from the first grid

3)第二个网格将填充用户从第一个网格中选择的行，并允许他们对内容进行编辑

3)Second grid will be populated with the rows the user has selected from the first grid and will allow them to make edits to the content

4)按保存将更新结果并显示第一个网格，其中行已更新

4)Pressing save will update the results and show the first grid with the rows updated

到目前为止，使用各种论坛主题的滴滴和单调(此处和在这里)，我设法完成了前两个步骤.

So far using drips and drabs of various forum threads (here and here), I have managed to accomplish the first two steps.

$("#editButton").kendoButton({
    click: function () {
        // extract selected results from the grid and send along with transition
        var gridResults = $("#resultGrid").data("kendoGrid"); // sourceGrid
        var gridConfig = $("#resultConfigGrid").data("kendoGrid"); // destinationGrid
        gridResults.select().each(function () {
            var dataItem = gridResults.dataItem($(this));
            gridConfig.dataSource.add(dataItem);
        });
        gridConfig.refresh();
        transitionToConfigGrid();
    }
});

dataItem返回有关所选项目的期望-附加的dataItem.png.我可以看到gridConfig正在填充，但是有空白行(gridBlankRows.png).

dataItem returns what i am expecting to see with regards to the selected item(s) - attached dataItem.png. I can see the gridConfig populating but with blank rows (gridBlankRows.png).

gridConfig设置:

$(document).ready(function () {

    // build the custom column schema based on the number of lots - this can vary 
    var columnSchema = [];
    columnSchema.push({ title: 'Date Time'});
    for(var i = 0; i < $("#maxNumLots").data("value"); ++i)
    {
        columnSchema.push({ 
            title: 'Lot ' + i,
            columns: [{
                title: 'Count'
            }, {
                title: 'Mean'
            }, {
                title: 'SD'
            }]
        });
    }
    columnSchema.push({ title: 'Comment'});
    columnSchema.push({ title: 'Review Comment' });

    // build the datasource with CU operations
    var configDataSource = new kendo.data.DataSource({
        transport: {
            create: function(options) {},
            update: function(options) {}
        }
    });

    $("#resultConfigGrid").kendoGrid({        
        columns: columnSchema,
        editable: true
    });
});

我已经用尽了有用的参考资料来确定我做错了什么/这里可能有什么突出之处.任何帮助/指导将不胜感激.

I have run out of useful reference material to identify what I am doing wrong / what could be outstanding here. Any help/guidance would be greatly appreciated.

此外，我还需要一些功能来添加新"结果.如果可能的话，我想使用相同的网格(带有空白datasource)来完成此操作.然后，用户可以将行添加到第二个网格中，并使用与更新功能相似的功能进行保存.因此，如果有任何方法可以将其纳入响应中，我将不胜感激.

Furthermore, I will also need functionality to 'Add New' results. If possible I would like to use the same grid (with a blank datasource) in order to accomplish this. The user can then add rows to the second grid and save with similar functionality to the update functionality. So if there is any way to factor this into the response, I would appreciate it.

推荐答案

以下示例...

http://dojo.telerik.com/EkiVO

...是...的修改版本.

...is a modified version of...

http://docs.telerik.com/kendo-ui/framework/datasource/crud#examples

一些注意事项:

• 如果要添加普通对象，这很重要到第二个Grid的dataSource(gridConfig.dataSource.add(dataItem).toJSON();)或Kendo UI Model对象(gridConfig.dataSource.add(dataItem);).在第一种情况下，您需要将更新后的值从Grid2传递回Grid1，否则将自动发生；
• 添加，删除或更改其数据项后，无需refresh()第二个网格
• 必须为CRUD操作配置两个Grid数据源，您可以遵循 CRUD文档
• 网格不会在重新绑定之间持久保留其选择，因此，如果您希望在更改某些值后将选择保留在第一个网格中，请使用坚持行选择

• it matters if you are adding plain objects to the second Grid's dataSource (gridConfig.dataSource.add(dataItem).toJSON();), or Kendo UI Model objects (gridConfig.dataSource.add(dataItem);). In the first case, you will need to pass back the updated values from Grid2 to Grid1, otherwise this will occur automatically;
• there is no need to refresh() the second Grid after adding, removing or changing its data items
• both Grid dataSources must be configured for CRUD operations, you can follow the CRUD documentation
• the Grid does not persist its selection across rebinds, so if you want to preserve the selection in the first Grid after some values have been changed, use the approach described at Persist Row Selection

这篇关于将选定的行分配为其他网格数据源的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！