4

このエディターでノックアウト検証とTwitterブートストラップを統合しようとしています:http://jsfiddle.net/casudeo/Jbp7y/18

入力エラーにtwitterブートストラップのcssを適用したいのですが。そのためには、どういうわけか、control-group divに「ウォークアップ」し、それに「error」クラスを追加する必要があります。cssファイルを変更せずにこれを実現する方法はありますか?

以下のドミニクのコメントによる追加の説明:1)[追加]ボタンをクリックして、新しいアイテムを追加します。2)空白の値で保存してみてください。3)KO検証は無効な入力をキャッチします。ただし、無効なフィールドを強調表示するために「エラー」cssクラスも適用したいと思います。

4

1 に答える 1

7

更新されたフィドルは次のとおりです:http://jsfiddle.net/jearles/Jbp7y/147/

HTML

<div><button data-bind="click: clickMe">Click Me!</button></div>

JS

var ViewModel = function() {
    var self = this;
    self.clickMe = function(data,event) {
      var target;

      if (event.target) target = event.target;
      else if (event.srcElement) target = event.srcElement;

      if (target.nodeType == 3) // defeat Safari bug
        target = target.parentNode;

      target.parentNode.innerHTML = "something";
    }
}

ko.applyBindings(new ViewModel());

私が変更したもの:

  1. 'validationElement'バインディングをコントロールグループのdivに追加します
  2. エラーが検出されたときに'showAllMessages()'への呼び出しを追加します
  3. errorElementClass構​​成が「error」に設定されていることを確認します
于 2012-09-01T15:07:11.280 に答える