2017-07-14 10 views
0

フォーム要素に結び付けられていない、カスタムまたはその他のバリデーションを注入する方法はありますか?同様に、いくつかの条件が満たされていることを検証しますが、標準のAngularJS検証で動作しますか?AngularJS - フォーム要素に基づいていない妥当性確認

更新:

は、ここで私が達成しようとしているものです:

私は、フォームはセクションのリストが含まれています。各セクションはチェックボックスで制御され、チェックボックスをオンにするとセクションに(ng-ifで)表示されます。

各セクション内では、ボタンクリックによってアクティブ化されるポップアップモーダルでアイテムを選択する機会があります。そのセクションでアイテムが選択されるまで、フォームは無効にする必要があります。項目が選択されると、がチェックされた選択ごとにが有効になる必要があります。

フォームの下部にng-disabled = "frm。$ invalid"というボタンがあります。私はチェックされている各セクションがモーダルで選択された項目を含むまで無効にしておきたい。

アップデート2:ここでは

は、いくつかのサンプルコードです:フォームには必要がないので、この場合には、あなたを助けにはなりません有効であるかどう

+0

あなたはモーダルが閉じる前に検証しようとしていますか?あなたが指示を探しているように聞こえます。 '

'のようなもので、指示文ではinnerHTMLをチェックすることができます。に入れば、値 – Ero

+0

を確認できます。具体的に何をしようとしていますか?いくつかのコードがなければ、私たちがあなたを助けるのは簡単ではありません。 – lealceldeiro

+0

@Ero:モーダル終了後に検証したい –

答えて

0

<form class="form-horizontal" role="form" name="frm" novalidate> 
 
    <label>Name: </label> 
 
    <input type="text" ng-model="name" required/> 
 

 
    <div ng-repeat="orderItem in orderItems"> 
 
    <input type="checkbox" name="items[]" ng-model="orderItem.selected"/> 
 
    <div ng-if="orderItem.selected"> 
 
     ... bunch of form fields 
 
     <button ng-click="openExchangeSelectionModal(orderItem)">Select Item</button> 
 
     <div ng-show="orderItem.exchange_item"> 
 
     Selected Item: {{orderItem.exchange_item.name}} - ${{orderItem.exchange_item.price | number: 2}} 
 
     </div> 
 
    </div> 
 
    </div> 
 

 
    <button ng-disabled="frm.$invalid" ng-click="submitOrder">Submit</button> 
 
</form>
をチェックします満たされていない入力。
無効にするボタンは、チェックボックスの数と選択されたアイテムの数についていくつかのロジックを作成し、ボタンの状態を返す関数を呼び出すことです(無効の場合はtrue、それ以外の場合はfalse)。

あなたが我慢するコード例:私はFRMを変更したこと

//some html tags... 

    <button ng-disabled="checkValid()" ng-click="submitOrder">Submit</button> 
</form> 

お知らせお使いのコントローラ上で定義されていて、むしろ決定したい任意のロジックはあなたの提出を示して実行できる機能ですcheckValid機能、に$無効。ボタンかどうかを確認します。

+0

アイテムが選択されるまでフォームが無効であることを確認する方法はありますか? –

+0

そのロジックは "checkValid"関数で実装する必要があります –

+0

Gotcha - ネイティブAngularJSを使用する方法はありませんか? –

関連する問題