Kendo Ui ListView在编辑模式下删除行

时间:2014-11-05 14:53:50

标签: javascript jquery kendo-ui kendo-listview

我遇到kendouis列表视图的问题,如果我编辑一行,则从附加的数据源中删除另一行。这在我编辑第一行时工作正常,但是当我编辑另一行时,第一行被删除。

我注意到在编辑第一行时,首先调用listview的编辑函数,但是当我编辑第二行数据绑定时,会调用数据绑定然后编辑。

这是代码:

var dataSource = new kendo.data.DataSource({

  transport: {
     read: function (options) {    
     options.success(lst);
  },
  update: function (options) {
      oThis.httpService.Post('api/DynamicPricing/UpdateDynamicItem', lst)
                            .success(function (data, status) {    
                                options.success(data);
                            });    
                    },
                schema: {
                    model: {
                        id: "Id",
                        fields: {
                            Name: { type: "string" },
                            CategoryF: { type: "string" },
                            DirectCost: { type: "number" },
                            IndirectCost: { type: "number" },
                            StrategyType: { type: "string" },
                            Value: { type: "string" },
                            OverridePrice: { type: "number" },
                            Current: { type: "string" }
                        }
                    }
                }
            });

            list = $('#listcontent').kendoListView({
                template: kendo.template('<table cellpadding="3px" class="gridDynamicPricingContent"><tr> \
                                            <td width="100px">#:Name#</td> \
                                            <td width="100px">#:CategoryF#</td> \
                                            <td width="100px" align="right">#:DirectCostF#</td> \
                                            <td width="100px" align="right">#:IndirectCostF#</td> \
                                            <td width="100px">#:StrategyType#</td> \
                                            <td width="50px">#:Value#</td> \
                                            <td width="100px" style="text-align:right; padding-right:5px;" >#:OverridePriceF#</td> \
                                            <td width="100px">#:Current#</td > \
                                            <td width="100px"><a class="k-button  k-edit-button" href = "\\#"><span class="k-icon k-edit"></span></a></td>\
                                         </tr></table>'),
                editTemplate: kendo.template('<table class="gridDynamicPricingContent k-state-selected"><tr> \
                                            <td width="100px">#:Name#</td> \
                                            <td width="100px">#:CategoryF#</td> \
                                            <td width="100px" align="right">#if(DynamicPricingType==5){# #:data.DirectCost# #}else{#<input type="number" style="width:60px;" class="k-textbox" data-bind="value:DirectCost" name="DirectCost" />#}#</td> \
                                            <td width="100px" align="right">#:IndirectCost#</td> \
                                            <td width="100px">#:StrategyType#</td> \
                                            <td width="50px">#:Value#</td> \
                                            <td width="100px" style="text-align:right; padding-right:5px;">#if(DynamicPricingType==4 || DynamicPricingType==5){#<input type="number" class="k-textbox" style="width:60px;" data-bind="value:OverridePrice" name="OverridePrice" />#}else{# #:data.OverridePrice# #}#</td> \
                                            <td width="100px">#:Current#</td > \
                                            <td width="100px"><a class="k-button k-button-icontext k-update-button" href="\\#"><span class="k-icon k-update"></span></a></td> \
                                         </tr></table>'),
                dataSource: dataSource,
                selectable: true,
                dataBound: function () {
                    $('#listcontent').prepend(header);
                }    
            });//.data("kendoListView");

1 个答案:

答案 0 :(得分:0)

我认为您的主要问题是schema位于transport dataSource.transport.schemadataSource.schema,但应该是Id。所以DataSource没有看到你指定的schema.model。没有模型,它不知道schema.model.id字段是什么,如果没有,它可能想要在编辑时创建新记录,而不是更新它们。


另一个可能的问题可能是您将Id设置为schema.model.fields,但您在transport.update的字段列表中没有该字段。我会在字段中添加Id。


另一个问题是,Kendo DataSource希望服务器返回1个更新的项目,其中包含匹配的ID,而不是整个项目列表。如果您无法将服务器更改为仅返回1项,则可以将options.success()函数中的逻辑更改为仅使用包含1更新项的数组调用DirectCostF


您的模板还使用IndirectCostF中不存在的DynamicPricingTypeschmea.model.fields和{{1}}。


我无法重现您的服务器请求,但我在这里创建了一个使用本地数据的jsFiddle:http://jsfiddle.net/rally25rs/Lo41dzwp/1/