0

我正在为我在 Kendo UI 网格弹出窗口中编辑的字段使用 DropDownList,虽然验证工具提示显示没有问题,但一旦更正输入,它们就不会消失。

我正在像这样创建 DropDownList:

  function serviceDropDownEditor(container, options) {
    $('<input data-bind="value:' + options.field + '" data-for="' + options.field + '"/>')
      .appendTo(container)
      .kendoDropDownList({
        optionLabel: "--- select a service ---",
        dataTextField: "name",
        dataValueField: "id",
        dataSource: window.services,  // an array I've already fetched from my DB
      });
  }

service_id我在定义数据源时将此函数应用于字段,如下所示:

  columns: [
    { field: "service_id",
      title: "Service",
      editor: serviceDropDownEditor,
      template: "#= getServiceName(service_id) #"  // display the name from the id
    },

为了确保有放置验证消息的位置,我使用此页面上的建议并在活动期间在 DropDownList 下方附加一个占位符范围edit

  edit: function(e) {
    var grid = $("#grid").data("kendoGrid")
    var container = grid.editable.element
    var service_container= container.find("[data-container-for=service_id]")
    service_container.append('<span class="k-invalid-msg", data-for="#= field #">')
  },

当存在引用此字段 ( service_id) 的服务器端错误时,我会找到我在edit事件中创建的占位符并将其替换为实际消息,如下所示:

var placeholder = container.find("[data-for=" + field + "].k-invalid-msg")
placeholder .replaceWith(validationMessageTmpl({ field: field, message: errors[field] }))

验证消息模板包含与data-for占位符相同的类和属性。

它在显示 DropDownList 错误时效果很好,但是当我更正错误时(并在同一表单上引入另一个错误,因此弹出窗口保持不变),原始错误不会消失。

那么......如何清除验证工具提示,我需要做什么?在事件中手动清除这个?

4

1 回答 1

0

尝试手动清除下拉更改的错误,例如:

function serviceDropDownEditor(container, options) {
$('<input data-bind="value:' + options.field + '" data-for="' + options.field + '"/>')
  .appendTo(container)
  .kendoDropDownList({
    optionLabel: "--- select a service ---",
    dataTextField: "name",
    dataValueField: "id",
    dataSource: window.services,  // an array I've already fetched from my DB
    select: function (ev) {
       var validatable = container.editable.validatable;
       if (validatable) {
             var dataItem = this.dataItem(ev.item.index());
             if (dataItem === null || dataItem === undefined || dataItem.text == " " || dataItem.text == "&nbsp;") {
                            // force validation is empty (simulate required)
                            validatable.validate();
                        } else {
                        // hide all error messages if not empty
                            validatable.hideMessages();
                        }
                    }
                }
  });

}

于 2013-06-28T11:40:34.443 回答