Question

我使用自定义编辑器的网格。我用colum中的textarea替换了常用输入。

USECASE：

将textarea的当前值chack为“test 0”
按网格（其行）的编辑按钮
添加新值“test 01”
按网格的更新按钮
检查网格行中是否更新了新值（有效）
再次按下网格的编辑按钮（新值为“test 01”）
按下网格的取消按钮（这里有一些魔术！不仅有网格，还有每个自定义编辑元素）
检查当前值是否从“test 01”变为“test 0”（失败）。

取消后，网格显示前一个值（“测试0”而不是“测试01”）。情况与来自其他列（不是customEditable）的值相同，例如量。如果我保存然后按取消，则会显示错误的值，但正确的值将保存在db

完全网格重新加载可以节省情况，但对于ajax网格来说并不是最佳的

Grid的数据源：

// bind json result from /Bonuses/GetPagedJsonBonuses
var bonusesDataSource = new kendo.data.DataSource({
    transport: {
        read: "@Url.Action("GetPagedJsonBonuses", "Bonuses")",
        update: {
            url: "@Url.Action("Edit", "Bonuses")",
            type: "PUT"
        },
        create: {
            url: "@Url.Action("Create", "Bonuses")",
            type: "POST"
        },
        parameterMap: function(options, operation) {
            if (operation === "update" || operation === "create") {
                // updates the BonusDTO.EmployeeId with selected value
                if (newValueEmployeeId !== undefined)
                    options.EmployeeId = newValueEmployeeId;
            }
            return options;
        }
    },
    schema: {
        data: "Data", // PagedResponse.Data
        total: "TotalCount", // PagedResponse.TotalCount
        model: {
            id: "BonusId",  // Data
            fields: {
                EmployeeId: { type: "number" },
                EmployeeLastName: {
                    type: "string",
                    editable: true,
                    //validation: { required: {message: "Employee's last name is required"}}
                },
                Amount: {
                    type: "number",
                    editable: true,
                    nullable: false,
                    validation: {
                        required: { message: "Amount is required to be set" }
                    }
                }
            } // fields
        } // model
    }// schema 
});

网格元素如下所示：

// creates bonuses grid control
$("#bonusesGrid").kendoGrid({
    dataSource: bonusesDataSource,
    toolbar: ["create"],
    editable: "inline",
    columns: [
        "BonusId",
        "EmployeeId",
        {
            field: "EmployeeLastName",
            editor: employeeAutocompletingEditor,
            template: "#=EmployeeLastName#"
        },
        "Amount",
        {
            field: "Comment",
            titel: "Comment",
            editor: textareaEditor,
            filterable: {
                operators: {
                    number: {
                        contains: "Contains"
                    }
                }
            }
        },
        {
            command: ["edit"],
            title: " "
        }
    ],
    save: function(e) {
        if (newValueEmployeeId !== undefined && newValueEmployeeLastName !== undefined) {
            e.model.EmployeeId = newValueEmployeeId; // it's a hack to bind model and autocomplete control
            e.model.EmployeeLastName = newValueEmployeeLastName;
        }
    },
    edit: function(e) {
        setCurrentValueEmployeeIdAndLastName(e.model.EmployeeId, e.model.EmployeeLastName);
    },
    cancel: function(e) {
        setCurrentValueEmployeeIdAndLastName(e.model.EmployeeId, e.model.EmployeeLastName);
    }
});

Textarea代码在这里：

function textareaEditor(container, options) {
    $('<textarea data-bind="value: ' + options.field + '" cols="10" rows="4"></textarea>')
        .appendTo(container);
}

更新1

在第4步之后（将'test 0'更改为'test 01'评论并按更新）我有下一个要求：

  Accept:application/json, text/javascript, */*; q=0.01
  Content-Length:490
  Content-Type:application/x-www-form-urlencoded; charset=UTF-8
  Host:localhost
  Origin:http://localhost
  Referer:http://localhost/
  X-Requested-With:XMLHttpRequest

POST的身体

  Form Dataview sourceview URL encoded
  BonusId:45
  EmployeeId:47
  Employee[EmployeeId]:47
  Employee[UserName]:opetriv
  Employee[LastName]:Oleh Petrivskyy
  Employee[LastNameUkr]:Петрівський Олег Миронович
  EmployeeLastName:Oleh Petrivskyy
  Date:Fri Apr 19 2013 12:00:00
  Amount:2
  **Comment:test 01**
  IsActive:true
  Ulc:ryakh               
  Dlc:Fri Apr 19 2013 12:34:33 GMT+0300 (FLE Daylight Time)

这对我来说是正确的。

来自控制器的响应是：

{"BonusId":45,
 "EmployeeId":47,
 "Employee":{"EmployeeId":47,"UserName":"opetriv","LastName":"Oleh      Petrivskyy","LastNameUkr":"Петрівський Олег Миронович"},
 "EmployeeLastName":"Oleh     Petrivskyy","Date":"\/Date(1366362000000)\/","Amount":2,**"Comment":"test    01"**,"IsActive":true,"Ulc":"ryakh               ","Dlc":"\/Date(1366375264603)\/"}

在第7步之后（按取消并接收此魔法），对服务器没有任何ajax请求。我有一个数据源的错误处理程序，它不会触发。

Answer 1

重要的是当您按更新时服务器的响应是什么。为dataSource的错误事件设置一个处理程序，看看它是否被触发。

检查服务器对更新请求的原始响应是什么。它不应包含任何错误。还要记住，使用最新版本的jQuery空响应是无效的JSON，并且将触发错误事件。

Answer 2

使用自定义编辑器更改字段不会触发数据库的更新。这可以通过更改save函数来解决，如下所示：

save: function(e) {
    if (newValueEmployeeId !== undefined && newValueEmployeeLastName !== undefined) {
      e.model.EmployeeId = newValueEmployeeId; // it's a hack to bind model and autocomplete control
    e.model.EmployeeLastName = newValueEmployeeLastName;
    **e.model.dirty = true;**
  }

Answer 3

我遇到了同样的问题。在我的情况下，问题是在创建新值后，我没有返回正确的模型（具有有效ID）。

旧代码（无效）：

public ActionResult Product_Create([DataSourceRequest] DataSourceRequest request, Product product)
{
    if (product != null && ModelState.IsValid)
    {
        Database.Products.InsertOnSubmit(new Product()
        {
            Name = product.Name,
            IsActive = product.IsActive
        });
        Database.SubmitChanges();
    }

    return Json(new[] { product }.ToDataSourceResult(request, ModelState), JsonRequestBehavior.AllowGet);
}

新代码：

public ActionResult Product_Create([DataSourceRequest] DataSourceRequest request, Product product)
{
    Product newProduct = product;
    if (product != null && ModelState.IsValid)
    {
        Database.Products.InsertOnSubmit(newProduct = new Product()
        {
            Name = product.Name,
            IsActive = product.IsActive
        });
        Database.SubmitChanges();
    }

    return Json(new[] { newProduct }.ToDataSourceResult(request, ModelState), JsonRequestBehavior.AllowGet);
}

我正在使用带有EF的ASP.NET MVC，因此在Database.SubmitChanges()之后，我的产品具有有效ID。

Kendo网格取消按钮失去新的价值

3 个答案: