Сообщение и шаблон проверки столбца Kendogrid

Я очень запутался, что использовать для проверки столбца kendogrid и изменения шаблонов ошибок?

Я хочу показать разные сообщения проверки для разных столбцов. Также хотелось бы изменить пользовательский интерфейс для сообщения об ошибке по умолчанию. Я хочу просто показать сообщение об ошибке красным цветом без цвета фона.

   dataBound: (e: any): void => {
        this.updateValidations(e);
      }

 private updateValidations(event: any): boolean {
    let kendoValidator = $('#grid').kendoValidator().data('kendoValidator');
    let validatorRules = {
      rules: {
        Col1Rule: (input) => {
          if (input.attr('name') === 'Col1') {
            return $.trim(input.val()) !== '';
          }
        },
        Col2Rule: (input) => {
          if (input.attr('name') === 'Col2Rule') {
            return $.trim(input.val()) !== '';
          }
        }
      },
      messages: {
        Col1Rule: this.col1Message,
        Col2Rule: this.col2Message,
      },
      errorTemplate: '<span>#=message#</span>'
    };
    kendoValidator.setOptions(validatorRules);
    return true;
  }

Я пробовал это, это не работает. Я все еще вижу предупреждение о сообщении проверки по умолчанию.

Я также пробовал ниже, но это не работает

   model: {
          fields: {
            col1: {
              type: 'string',
              editable: true,
              nullable: false,
              validation: {
                required: true
                message: this.col1Message
              }
            },
            col2: {
              type: 'string',
              editable: true,
              validation: {
                required: true
                message: this.col2Message
              }
            }
          }
          }

Также попробовал еще одну вещь

 let input = $('<input/>');
        input.attr('name', options.field);
input.attr('data-required-msg', this.col1Message);
        input.width(container.width());
        input.width(container.width());
        input.appendTo(container);

Но это тоже не работает.

Может ли кто-нибудь предложить, как правильно это сделать?


person spidy spidy    schedule 17.07.2018    source источник


Ответы (1)


Чтобы изменить сообщение об ошибке, вы должны установить сообщение как атрибут data-<name of rule>-msg внутри правила:

    model: {
        fields: {
            col1: {
                type: 'string',
                editable: true,
                nullable: false,
                validation: {
                    Col1Rule: (input) => {
                        if (input.attr('name') === 'Col1') {
                            input.attr('data-col1rule-msg', 'your custom message');
                            return $.trim(input.val()) !== '';
                        }
                        return true;
                    },
                }
            },
        }
    }

Если вам нужен совершенно другой пользовательский интерфейс, вы можете поместить span с class="k-invalid-msg" и data-for="Col1" внутри скрытого div. Затем вы можете создать внутри валидатора свой собственный диапазон и добавить его в свою форму.

person CennoxX    schedule 13.12.2019