0

プレースホルダーを認識しないブラウザーの場合、input/textarea 値を使用してプレースホルダーを表示するように、プレースホルダーに対して JavaScript の回避策を実行しています。しかし、これは ASP.net MVC アプリでのクライアント側の検証を台無しにします。

私はこのSO 記事を見ましたが、これは私が実装したいものではありません: (1) プレースホルダーを使用するフィールドがいくつかあります。(2) プレースホルダーには、DisplayAttribute または DescriptionAttribute を返す ModelMetaDataprovider を使用します。フィールドの名前 (単語に分割され、適切に大文字と小文字が変換されます)。

今、私もこれを読んで、カスタム検証属性を使用することを提案しています。ただし、私が望んでいたのは別のクライアント側の検証だけだったので、これはやり過ぎだと思います。

4

1 に答える 1

1

あはは！その2番目のリンクをもっとよく読むべきでした。要素のプレースホルダー属性をチェックするように jquery.validate.js を変更することを提案した人がいます。しかし、jquery.validate.js のアップグレードで上書きされる可能性が高いため、これは悪い解決策であると考えました。

しかし、スクリプトで検証メソッドをオーバーライドできることを発見しました。だから私はうまくいくように見えるこれを書いた。基本的にはメソッドをコピーしましたが、以下に示す行を追加しました。

私自身の検証 js に、要素にプレースホルダー属性があるかどうか、およびプレースホルダー テキストと等しいかどうかを確認するための置換チェックを追加しました。

$.validator.addMethod(
    'required',
    function(value, element, param) {
        // check if dependency is met
        if ( !this.depend(param, element) )
            return "dependency-mismatch";
        switch( element.nodeName.toLowerCase() ) {
        case 'select':
            // could be an array for select-multiple or a string, both are fine this way
            var val = $(element).val();
            return val && val.length > 0;
        case 'input':
            if ( this.checkable(element) )
                return this.getLength(value, element) > 0;
        default:
            // REPLACED THIS:
            //return $.trim(value).length > 0;
            // WITH THIS:
            return ($.trim(value).length > 0) && (value != element.getAttribute('placeholder'));
        }
    }, '');

うまくいくようです。スクリプトのデバッグを実行すると、「必須」が置き換えられていることがわかります。

于 2013-10-24T06:26:52.647 に答える