How to use parsleyjs - 7 common examples

constructor(el) {
    this.el = el;
    // validationでerrorとなったときのイベントハンドラ
    Parsley.on('field:error', (fieldInstance) => {
      if (isSP()) SPParseleyCallback.onError(fieldInstance);
      else PCParsleyCallback.onError(fieldInstance);
    });

    // validationでsuccessとなったときのイベントハンドラ
    Parsley.on('field:success', (fieldInstance) => {
      if (isSP()) SPParseleyCallback.onSuccess(fieldInstance);
      else PCParsleyCallback.onSuccess(fieldInstance);
    });

    // errorとなったときに付与するclass名を指定
    Parsley.options.errorClass = ERROR_CLASS;
    ParsleyWrapper.addCustomValidator();
    ParsleyWrapper.changeErrorMessage();
  }

constructor(el) {
    this.el = el;
    // validationでerrorとなったときのイベントハンドラ
    Parsley.on('field:error', (fieldInstance) => {
      if (isSP()) SPParseleyCallback.onError(fieldInstance);
      else PCParsleyCallback.onError(fieldInstance);
    });

    // validationでsuccessとなったときのイベントハンドラ
    Parsley.on('field:success', (fieldInstance) => {
      if (isSP()) SPParseleyCallback.onSuccess(fieldInstance);
      else PCParsleyCallback.onSuccess(fieldInstance);
    });

    // errorとなったときに付与するclass名を指定
    Parsley.options.errorClass = ERROR_CLASS;
    ParsleyWrapper.addCustomValidator();
    ParsleyWrapper.changeErrorMessage();
  }

constructor(el) {
    this.el = el;
    // validationでerrorとなったときのイベントハンドラ
    Parsley.on('field:error', (fieldInstance) => {
      if (isSP()) SPParseleyCallback.onError(fieldInstance);
      else PCParsleyCallback.onError(fieldInstance);
    });

    // validationでsuccessとなったときのイベントハンドラ
    Parsley.on('field:success', (fieldInstance) => {
      if (isSP()) SPParseleyCallback.onSuccess(fieldInstance);
      else PCParsleyCallback.onSuccess(fieldInstance);
    });

    // errorとなったときに付与するclass名を指定
    Parsley.options.errorClass = ERROR_CLASS;
    ParsleyWrapper.addCustomValidator();
    ParsleyWrapper.changeErrorMessage();
  }

validateNumber: (value, requirement) => value === requirement,
      messages: {
        ja: '%sになるように入力してください',
      },
    });

    Parsley.addValidator('ne', {
      requirementType: 'integer',
      validateNumber: (value, requirement) => value !== requirement,
      messages: {
        ja: '%s以外の数値を入力してください',
      },
    });


    Parsley.addValidator('positiveInteger', {
      requirementType: 'digits',
      validateString: value => parseInteger(value).toString() === value && parseInteger(value) >= 0,
      messages: {
        ja: '不正な数値形式です',
      },
    });
  }

static addCustomValidator() {
    Parsley.addValidator('eq', {
      requirementType: 'integer',
      validateNumber: (value, requirement) => value === requirement,
      messages: {
        ja: '%sになるように入力してください',
      },
    });

    Parsley.addValidator('ne', {
      requirementType: 'integer',
      validateNumber: (value, requirement) => value !== requirement,
      messages: {
        ja: '%s以外の数値を入力してください',
      },
    });

static addCustomValidator() {
    Parsley.addValidator('eq', {
      requirementType: 'integer',
      validateNumber: (value, requirement) => value === requirement,
      messages: {
        ja: '%sになるように入力してください',
      },
    });

    Parsley.addValidator('ne', {
      requirementType: 'integer',
      validateNumber: (value, requirement) => value !== requirement,
      messages: {
        ja: '%s以外の数値を入力してください',
      },
    });


    Parsley.addValidator('positiveInteger', {
      requirementType: 'digits',
      validateString: value => parseInteger(value).toString() === value && parseInteger(value) >= 0,
      messages: {
        ja: '不正な数値形式です',
      },
    });
  }

static changeErrorMessage() {
    Parsley.addMessages('ja', {
      gt: '%sより大きい値を入力してください。',
      gte: '%s以上の値を入力してください。',
      lt: '%sより小さい値を入力してください。',
      lte: '%s以下の値を入力してください。',
    });
  }