0

3 つの個別の目標を達成する必要があるセットアップがあります。

  1. クライアント側の検証 (これは jQuery Validate プラグインを使用して行われます)
  2. きちんとした数値フォーマット (これは jQuery autoNumeric プラグインを使用して行われます)
  3. 数値のみのフィールドで iPad/iPhone キーボードがポップアップする (これは、input 要素の pattern="[0-9]*" 属性を使用して行われます - autoNumeric プラグインがサポートしていないため、HTML5 type="number" は使用できません) .

問題は、検証プラグインが動作している間、浮動小数点値 ( Invalid format ) のエラーが発生することです。これは、小数点区切り記号が pattern="[0-9]*" regexp と一致しないためです。以下に入力フィールドの例を示します。

<input type="text" id="acme" name="acme" size="4" 
 data-autonumeric="{vMin: '0.00'}" class="required number autoNumeric" 
 min="0.0" step="0.01" pattern="[0-9*]">

すべての検証済みフィールドに対して、またはフィールドごとに、パターン検証を無効にする方法はありますか? または、おそらく type="number" または pattern="[0-9*]" を意味しない、iPad/iPhone で数字キーパッドを強制する別の方法がありますか?

編集:

この問題を回避する方法を見つけました。以下の回答を参照してください。誰かがより良いアイデアを持っている場合は、共有してください。ありがとうございました。

4

1 に答える 1

1

jQuery Validate でパターン検証メソッドをオーバーライドする方法を見つけました。誰かがより良い解決策を知っている場合は、コメントしてください。

これがコードです。jQuery.validator.addMethod("pattern"... を追加して動作します (\d* を無視します - iOS で数字キーボードを表示するには、pattern 属性の値を "[0-9] " または "に設定します)。 \d "、これを使用します (ソースhttp://developer.apple.com/library/ios/#documentation/StringsTextFonts/Conceptual/TextAndWebiPhoneOS/KeyboardManagement/KeyboardManagement.html )。その行をコメントアウトして、実際の問題を確認します。

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/jquery.validate.min.js"></script>
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/additional-methods.min.js"></script>
<script type="text/javascript" src="jquery.metadata.js"></script>
<script type="text/javascript" src="autoNumeric-1.7.4.js"></script>
<form id="test">
<input type="text" id="acme" name="acme" size="4" data-autonumeric="{vMin: '0.00'}"
    class="required number autoNumeric" min="0.0" step="0.01" pattern="\d*" value="1.00">
</form>
<script type="text/javascript">
    $(document).ready(function () {
        $("#test").validate();
    });

    // This overrides the additional-methods.min.js implementation to ignore pattern="\d*" validation
    jQuery.validator.addMethod("pattern", function (e, t, n) {
        return this.optional(t) || n == "\\d*" ? !0 : (typeof n == "string" && (n = new RegExp("^(?:" + n + ")$")), n.test(e))
    }, "Invalid format.");
</script>
于 2013-02-20T08:34:49.037 に答える