角型検証$無効になっています

フィールドが空の場合、送信ボタンを無効にしようとしていました。しかし、それは動作しません。それがなぜ機能しないのか分からない。多くのブログを見ましたが、問題は何かを理解できませんでした。

<form name="createForm"> 
    <div class="form-group col-md-6"> 
     <label for="createName">Student</label> 
     <select class="form-control" name="student" id="createName" ng- 
     model="createStudent.studentId" ng-options="item.name for item in 
     allStudent" required> 
     <option value="" selected disabled>Select</option> 
    </select> 
    </div> 
    <div class="form-group col-md-6"> 
    <label for="createClass">Class</label> 
    <select class="form-control" name="class" id="createClass" ng- 
    model="createStudent.classId" ng-options="item.number for item in 
    allClass" required> 
     <option value="" selected disabled>Select</option> 
    </select> 
    </div> 
</div> 
    <div class="form-group col-md-6 text-md-center"> 
    <label for="createCategory">Type of Category</label> 
    <select class="form-control" name="category" id="createCategory" 
    ng-model="createStudent.type" ng-options="item.category_type for 
     item in allcategoriestypes" required> 
     <option value="" selected disabled>Select</option> 
    </select> 
    </div> 
</div> 
<div class="row align-items-end justify-content-center"> 
    <div class="form-group col-md-6 text-md-center"> 
    <label for="createTeacherName">Teacher Name</label> 
    <input type="text" class="form-control" name="teacher" 
    id="createTeacherName" ng-model="createStudent.name" 
    placeholder="Enter Teacher Name" required> 
    </div> 
</div> 
</div> 
<div class="text-center pt-1"> 
<button type="submit" class="btn btn-info px-5" ng- 
    click="create(createStudent)" ng- 
    disabled="createForm.$invalid">Save</button> 
</div> 
</form>

出典

2017-07-28 Nagesh

下記の私の回答にplunkerをチェックしてください – Deepa

私のプロジェクトでは動作していないことを確認しました。 – Nagesh

何が問題なのですか？ – Deepa

あなたのコードの作業plunkerを見つけてください：

http://plnkr.co/edit/H1LOahFNWRXYHWTVmrcW?p=preview

<form name="createForm"> 
    <div class="form-group col-md-6"> 
     <label for="createName">Student</label> 
     <select class="form-control" name="student" id="createName" ng- 
     model="createStudent.studentId" required> 
     <option value="studentValue">Student Name</option> 
    </select> 
    </div><br/> 
    <div class="form-group col-md-6"> 
    <label for="createClass">Class</label> 
    <select class="form-control" name="class" id="createClass" ng- 
    model="createStudent.classId" required> 
     <option value="classValue">Class</option> 
    </select> 
    </div><br/> 
    <div class="form-group col-md-6 text-md-center"> 
    <label for="createCategory">Type of Category</label> 
    <select class="form-control" name="category" id="createCategory" 
    ng-model="createStudent.type" required> 
     <option value="typeValue">Category</option> 
    </select> 
    </div><br/> 
<div class="row align-items-end justify-content-center"> 
    <div class="form-group col-md-6 text-md-center"> 
    <label for="createTeacherName">Teacher Name</label> 
    <input type="text" class="form-control" name="teacher" 
    id="createTeacherName" ng-model="createStudent.name" 
    placeholder="Enter Teacher Name" required> 
    </div> 
</div><br/> 
<div class="text-center pt-1"> 
<label>Value returned for $invalid :: {{createForm.$invalid}}</label><br/><br/> 
<button type="submit" class="btn btn-info px-5" ng-click="create(createStudent)" ng-disabled="createForm.$invalid">Save</button> 
</div> 
</form>

は、すべてのタグが正しく閉じて、あなたの分野のどれもが空にされていないことを確認してください。

出典

2017-07-28 05:32:11 Deepa

フィールドが空の場合、送信ボタンを無効にしています。

<!DOCTYPE html> 
 
<html> 
 

 
<body> 
 
<form name="createForm"> 
 
    <div class="form-group col-md-6"> 
 
     <label for="createName">Student</label> 
 
     <select class="form-control" name="student" id="createName" ng- 
 
     model="createStudent.studentId" ng-options="item.name for item in 
 
     allStudent" required> 
 
     <option value="" selected disabled>Select</option> 
 
    </select> 
 
    </div> 
 
    <div class="form-group col-md-6"> 
 
    <label for="createClass">Class</label> 
 
    <select class="form-control" name="class" id="createClass" ng- 
 
    model="createStudent.classId" ng-options="item.number for item in 
 
    allClass" required> 
 
     <option value="" selected disabled>Select</option> 
 
    </select> 
 
    </div> 
 
</div> 
 
    <div class="form-group col-md-6 text-md-center"> 
 
    <label for="createCategory">Type of Category</label> 
 
    <select class="form-control" name="category" id="createCategory" 
 
    ng-model="createStudent.type" ng-options="item.category_type for 
 
     item in allcategoriestypes" required> 
 
     <option value="" selected disabled>Select</option> 
 
    </select> 
 
    </div> 
 
</div> 
 
<div class="row align-items-end justify-content-center"> 
 
    <div class="form-group col-md-6 text-md-center"> 
 
    <label for="createTeacherName">Teacher Name</label> 
 
    <input type="text" class="form-control" name="teacher" 
 
    id="createTeacherName" ng-model="createStudent.name" 
 
    placeholder="Enter Teacher Name" required> 
 
    </div> 
 
</div> 
 
</div> 
 
<div class="text-center pt-1"> 
 
<button type="submit" class="btn btn-info px-5" ng- 
 
    click="create(createStudent)" ng- 
 
    disabled="createForm.$invalid">Save</button> 
 
</div> 
 
</form> 
 
</body> 
 

 
</html>

出典

2017-07-28 05:07:55 Balasubramanian

実際には、私はプロジェクトを実行するとき、それは動作しません。 – Nagesh

は今働いていますか？ – Balasubramanian

いいえなぜそれが動作しているのかわかりません。他のページではその作業。 – Nagesh

角型検証$無効になっています

答えて

関連する問題