如何验证语义UI中的十进制字段?

时间:2018-08-24 07:31:48

标签: javascript validation semantic-ui

在语义UI中,可以验证十进制数字吗? 对于整数,可以轻松设置:

$('.ui.form')
  .form({
    fields: {
     field1: {
       rules: [
          {
            type   : 'integer[1..20]',
          }
       ]
     },
  ....

,并且仅当整数落在指定范围内时才对整数进行验证。 对于十进制输入,我需要做同样的事情(需要落在1.99-100.99的范围内),但是用于整数的相同方法似乎不起作用。
我该如何实现?谢谢。

1 个答案:

答案 0 :(得分:2)

我这样解决了这个问题:

$(document).ready(function() {

  $.fn.form.settings.rules.greaterThan = function (inputValue, validationValue) {
      return inputValue >= validationValue;
  };
  $.fn.form.settings.rules.smallerThan = function (inputValue, validationValue) {
      return inputValue <= validationValue;
  }
  $('.ui.form')
    .form({
      on: 'blur',
      fields: {
        decimal: {
          rules: [
            {
              type   : 'decimal',
              prompt : 'Please enter a decimal number here'
            },
            {
              type: 'greaterThan[1.99]',
              prompt: 'The price should be greater than 1.99',
            },
            {
              type: 'smallerThan[100.99]',
              prompt: 'The price should be less than 100.99',
            },
          ]
        },
      }
    })
  ;
});

通过这种方式,您将验证结合在一起以获得所需结果的三个规则。