質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
AngularJS

AngularJSはオープンソースのJavaScriptフレームワークです。ブラウザ上で動作するウェブアプリケーションの開発にMVCアーキテクチャを取り入れることを目的としています。

Q&A

解決済

1回答

2072閲覧

AngulerJSでのバリデーションでNGが出ていないときに「入力OK」を表示させたい時の処理

p-craft

総合スコア205

AngularJS

AngularJSはオープンソースのJavaScriptフレームワークです。ブラウザ上で動作するウェブアプリケーションの開発にMVCアーキテクチャを取り入れることを目的としています。

0グッド

0クリップ

投稿2016/03/15 03:47

AngulerJSを使って、バリデーションチェックを行っています。

全ての入力条件がOKの時に、「入力OK」と表示を出したいと思っています。

<input ng-model="name" type="text" name="name" ng-maxlength="12" required /> <p ng-show="name!==''&&name!==undefined&&ValiView"> <div input_allready ib">入力OK</div> </p>

現状、このように書くと、項目に何か入力されていると、「入力OK」と出て、未入力の場合に、メッセージを消せますが、maxlengthの12文字を超えていても、「入力OK」と出てしまいます。

これを、バリデーションのエラーが何も無い時に「入力OK]と出るような、そんなやり方は無いでしょうか?

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

今の方法ですと、ngShowの条件バリデーションの内容が密になっているので、以下のようにしてはいかがでしょうか。

html

1<form name="myForm"> 2 <input ng-model="name" type="text" name="myInput" ng-maxlength="12" required /> 3 <p ng-show="myForm.myInput.$valid"> 4 <div input_allready ib">入力OK</div> 5 </p> 6</form>

2016-03-15 修正

html

1<form name="myForm"> 2 <input ng-model="name" type="text" name="myInput" ng-maxlength="12" required /> 3 <div ng-show="myForm.myInput.$valid"> 4 <div>入力OK</div> 5 </div> 6</form>

投稿2016/03/15 04:03

編集2016/03/15 04:21
jcs502ulf

総合スコア307

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

p-craft

2016/03/15 04:13

。。。jsc2ul様 ご回答ありがとうございます。 うーん、書き方が悪いのか、なぜか常に「入力OK」が表示されてしまいます。。。
jcs502ulf

2016/03/15 04:22 編集

すみません、以下のように修正しました。 ・ngShowのpタグをdivに ・メッセージのdiv内の属性を削除
p-craft

2016/03/15 06:58

jcs502uf様 うわぁ!!!うまくいきましたぁ!!!!! ありがとうございましたぁ!!!!!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問