1

私はie8用の検証とjqueryプレースホルダープラグインでknockout.jsを使用しています。ノックアウト バインディング:

    ko.bindingHandlers.placeholder = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        ko.applyBindingsToNode(element, { attr: { placeholder: valueAccessor() } });

        $(element).placeholder();
        $(element).focus();
        $(element).blur();
    }
}

利用方法：

 <div>
     <input type="text" data-bind="placeholder: 'Product name...', value: productName, valueUpdate: 'afterkeydown'" />
     <span data-bind="visible: productName.isValid" class="validationMessageValid">Ok.</span>
     <span data-bind="validationMessage: productName" class="validationMessage"></span>
 </div>

ビューモデルで：

...
    self.productName = ko.observable('').extend({ required: { params: true, message: 'Name of the product cannot be empty.' } });
...

これが問題です。テキスト入力がクリアされると、プラグインはプレースホルダー値を設定します。ノックアウト検証は、空の文字列ではなくこの値を読み取るため、検証が正しく機能せず、プレースホルダー値のために「OK」と表示されます。
入力からテキストが削除された後、2 つの検証チェックが行われます。最初は空の文字列で、2 番目はプレースホルダー文字列です。textarea 要素の場合に興味深いのは、最初の 1 つだけで、すべてが正常に機能することです。
私の考えは、値がプレースホルダーと同じかどうかを確認し、空の文字列を検証に転送することです。ノックアウト検証プラグインは既にデフォルトの「値」バインディングをオーバーライドし、valueAccessor を「validationCore」と呼ばれる別のバインディングに送信します。私がやりたいのは、この 1 つの条件を valueAccessor に挿入することです。
多分もっと簡単な解決策がありますか？どんなアイデアでも大歓迎です。

knockout.js 2.3、jquery 1.10.2、プレースホルダー プラグイン 2.0.7

4

0 に答える 0