2012-12-03 6 views
19

MVC、ノックアウト、ノックアウト検証を使用してビューモデルを検証しています。ノックアウト検証では、すぐに負荷が評価されます

私は、ビューモデルプロパティの検証がロード直後に開始される問題に取り掛かりました。つまり、ユーザーが値を変更しようとする前に、「このフィールドは必須です」という入力が自分の入力の横に表示されます。

この問題は、特にドロップダウン(選択)コントロールで発生しています。

これは、私が何らかの形で意図せずに変更した/アクセスしている/私のjavascriptコードの別の部分でのオブザベーブルを変更することによって作成した問題だと思います。しかし、私はこれを追跡する方法を知らない。

ノックアウト検証で検証の原因となる火事でも、何とか登録または追跡できる方法はありますか?私はちょうどそれがなぜそれが発砲しているのかを知る必要があります。私はかなりisValid()関数の値が一貫してfalseであると確信しています。

ここに私のHTMLは、ページのロードのセットアップ、セーフであるかのサンプルです:私は自分でこの問題を考え出し

<select class="highlightable validationElement" name="obsstate" data-bind="value: standardAnswers.ans106_1.value" required="true"> 
    <option value="">-- Select -- </option> 
     <option value="AK">AK</option> 
     <option value="AL">AL</option> 
     etc... 

</select> 

As displayed on my local machine

答えて

7

が。

選択肢のテンプレートを作成して、後で選択した要素の値をKnockoutにバインドするという問題があります。

デフォルト値である選択ボックスにユーザー入力値がないにもかかわらず、 "--select--"には実際に値が含まれていますが、私の場合、それは空の文字列でした。したがって、ノックアウトバインディングを適用すると、viewmodelプロパティが空の文字列値で「更新」され、検証が実行されました。

私の場合、これを回避するために、私のモデルのデフォルト値を空の文字列に設定しました。したがって、バインディングが適用されるとき、ノックアウト観測値に発生するvalueHasMutatedイベントは存在しないため、検証は行われません。 KOページを引用

+0

を作る私は空の文字列にモデルを設定するが、そのはまだ負荷に発砲します。私が気づいたことの1つはoptionsCaptionsです: '選択...'はアイテムに入れますが、値は値= ""ではありません。<オプション値>選択... – jmogera

+0

私のために働いた。 –

9

....(http://knockoutjs.com/documentation/options-binding.html

KOは、テキスト「...項目を選択」を表示し、未定義の値を持つものと項目のリストの前に付けます。したがって、myChosenValueが未定義の値を保持している場合(デフォルトでは観測可能)、ダミーオプションが選択されます。 optionsCaptionパラメータがobservableの場合、observableの値が変更されると、最初の項目のテキストが更新されます。 viewmodelのバインディングを適用した後、これが助け

self.myProperty = ko.observable(undefined).extend({ 
    required : {"Field Required"} 
}); 

希望...

20

だから、私は、プロパティを定義する場合、以下の例を参照してください「未定義」に設定することによってそれを解決しました。そして、そのためのviewmodel showAllMessages

falseとして

YourViewmodelname.errors.showAllMessages(false); 
+5

私の状況で役に立ちそうな構文が少し異なります: 'ko.validation.group(viewModel())。showAllMessages(false);' –

+0

@JonathanStrate私の場合はviewmodel.errorsが定義されておらず、 。 – Peanut

+0

ko.applyBindings(...)の後にエラーをグループ化し、メソッドを呼び出します。 ko.validation.group(yourViewModel、{deep:true})。showAllMessages(false); – goamn

関連する問題