5

I have a form(HTML) and a directive to do stuff when submit button is clicked.The form has 10 input fields. The requirement is to keep the submit button which is a disabled till the time user enters value in at least one field.

Can anyone please help me. Iam new to angular and could not find much help.

Albert Pinto
  • 392
  • 2
  • 6
  • 17

2 Answers2

8

simply use ng-disabled="true".

declare a function in your controller something like

checkInputFields which return either true or false depending on the form modal.

then use

<md-button ng-disabled="checInputFields()">
  Submit
</md-button>
atinder
  • 2,080
  • 13
  • 15
  • i dont have a controller but the form is sitting in a directive. i tried your suggestion by putting a method in the directive but the directive has to know when a value is entered. – Albert Pinto Aug 20 '15 at 03:40
  • use `bindToController` in your directive and declare your method on the the controller of directive. – atinder Aug 20 '15 at 04:18
5
  <form ng-submit="search()" name="searchSideNav">
    <div layout="column" layout-align="center">
      <md-input-container flex>
        <label>{{::labels.documentName}}</label>
        <input ng-model="searchItems.sDocumentName" ng-required="" name="sDocumentName">
        <div ng-show="searchSideNav.sDocumentName.$invalid && !searchSideNav.sDocumentName.$pristine">
          <p ng-show="searchSideNav.sDocumentName.$error.required" class="help-block">Document is required</p>
        </div>
      </md-input-container>
       <md-button ng-disabled="searchSideNav.$invalid">
         Submit
      </md-button>
    </div>
  </form>
Mohan Singh
  • 883
  • 8
  • 18