如何使Kendo UI网格折叠重复行

时间:2013-11-25 09:35:53

标签: kendo-ui kendo-grid

我有Kendo UI grid可以添加新行。

添加的行可以与现有行具有相同的ID,我需要删除存在的旧行。

为此编写代码,但它不起作用。

function checkSameID(e){
    if(e.type != 'create'){
        return false;
    }
    var grid = $("#grid").data("kendoGrid");
    $.map(e.response, function(row){

        grid.table.find('tbody tr').each(function(){
            var $this = $(this);
            var id = $('td:first-child', $this).html();
            if(id == row.id){
                var uid = $this.data('uid');
                grid.collapseRow(grid.table.find('tr[data-uid="' + uid + '"]'));
            }
        });
    });
}

dataSource.bind("requestEnd", checkSameID);

我的问题在哪里?

更新

的DataSource:

dataSource = new kendo.data.DataSource({
    transport: {
        read:  {
            url: crudServiceBaseUrl,
            dataType: "json",
            type: 'post',
            data:{
                'table':'user','action':'get'}
        },
        update: {
            url: crudServiceBaseUrlSave,
            dataType: "json",
            type: 'POST'
        },
        destroy: {
            url: crudServiceBaseUrlSave,
            dataType: "json",
            type: 'POST',
        },
        create: {
            url: crudServiceBaseUrlSave,
            dataType: "json",
            type: 'POST',
        },
        parameterMap: function(options, operation) {
            if (operation !== "read" && options.models) {
                return {table:'user',action:operation, models: kendo.stringify(options.models)};
            }

            return {'table':'user','action':'get'};
        }
    },
    success: function(e){
        console.log(e);
    },
    batch: true,
    pageSize: 20,
    schema: {
        model: {
            id: "id",
            fields: {
                id: {
                    editable: false, nullable: true },
                    percent: {
                        type: "number", validation: {
                            required: true}
                    },
                    active: {
                        type: "boolean" },
                        group:{
                            defaultValue: {
                                id:0,name:'Group'},validation: {
                                    required: true }
                        },
                        date:{
                            editable: false, nullable: true },
                            user_name:{
                                editable: false, nullable: true },
            }
        }
    }
});

3 个答案:

答案 0 :(得分:4)

我认为这可能会对你有帮助,

function onSave(e){
    var currentProductName = e.model.ProductName;
    var currentProductID = e.model.ProductID;
    var data = this.dataSource.data();
    for(item in data){
        if(data[item].ProductName == currentProductName &&
           data[item].ProductID != currentProductID){
            e.preventDefault();
            alert("Duplicates found");
             // here you can delete your Duplicates
             // you had to pass ur UID to 'getByUid' function
             // var dataRow = $('#grid').data("kendoGrid").dataSource.getByUid(uid);
             // $('#grid').data("kendoGrid").dataSource.remove(dataRow);
        }

    }
}

然后您可以继续删除副本。

参见:
1.Checking the Kendo Grid for duplicate values

2.Deleting grid row by UID programmatically

3.Adding And Removing Items In kendo.data.DataSource

答案 1 :(得分:3)

我认为您应该以不同的方式处理此问题 - 您需要阻止用户创建具有重复ID的新行,并让他编辑正确的行(using validation),或阻止用户完全编辑id。 创建和编辑数据应该明确分开。

答案 2 :(得分:0)

在IE浏览器中无法读取像“data [item] .ProductName”这样的元素。所以请使用如下。

var currentActionCode = e.model.lffaActionCode;
var data = this.dataSource.data();
var i=0;
for(item in data){
    if(e.model.isNew()  && (data[i] != undefined) &&(e.model.uid != data[i].uid) && (data[i].lffaActionCode == currentActionCode.toUpperCase())){
        e.preventDefault();
        $(
        "#errorNotification")
        .data(
                "kendoNotification")
        .show(
                "Duplicate values not allowed.",
                "error");
        break;
    }
    i++;
}