0

私はグリッドを持っています。そのグリッドには、名前、 qty1、qty2のような 3 つの列があります。

qty1とqty2の両方がNumericText Boxes になります。

ここで私の質問は、qty1 の値を変更すると、この値が qty2 に影響することです。

例：

  1. qty1の最大値は10です。この値に基づいて、qty2は10を超えません 。
  2. qty1 の最大値は 20 です。この値に基づいて、qty2 は 20 を超えません。

ここで検証を行う方法。

4

2 に答える 2

1

kendo バリデータ ウィジェットでカスタム ルール/メッセージを定義して、最初のテキスト ボックスに対して 2 番目のテキスト ボックスに入力された値をチェックする必要があります。

例えば

html:

<div id="form-stuff">
   <input id="Value1" name="Value1" type="number" />
   <div style="clear"></div><br />
   <input id="Value2" name="Value2" type="number" />
   <div style="clear"></div><br />
   <div class="validation-tooltip-wrapper"><span class="k-invalid-msg" data-for="Value2" style="position:relative;"></span></div>
   <div style="clear"></div><br />
   <button id="btn-submit" type="button" class="k-button k-button-icontext"><span class="k-icon k-update"></span>Submit</button>
   <span id="results"></span>
</div>

JS:

$('#Value1').kendoNumericTextBox({
    min: 0,
    max: 10,
    value: 0,
    format: '#'
});

$('#Value2').kendoNumericTextBox({
    value: 0,
    min: 0,
    format: '#'
});

$('#form-stuff').kendoValidator({
   rules: {
      qty2: function(input) {
        if(input.is('[name=Value2]')) {
            var input1 = $('#Value1').data('kendoNumericTextBox'), maxAmount = input1.max();
            return (Number(input.val()) <= maxAmount);
        }
        return true;
      }
   },
   messages: {
      qty2: 'amount exceeded'
   }
});

$('#btn-submit').on('click', function() {
    var validator = $('#form-stuff').data('kendoValidator');
    if(validator.validate()) {
        $('#results').text('Valid!');
    } else {
        $('#results').text('Invalid!');
    }
});

このための jsFiddle は次の場所で確認できます。

http://jsfiddle.net/d6R4X/7/

これが役立つことを願っています...

于 2013-10-15T13:00:23.367 に答える