CODEWITHSUNDEEP
htmlangularjs
srsxyz
srsxyz

Reputation: 231

Disabled submit button for incomplete form not working

I have a form where you can add a person to a list. However there must be text in the input box in order for you to be able to press the "submit" button. However this is not working. I was hoping someone could tell me what I did wrong. Thanks.

<nav class = "main-navigation" role='navigation'>
      <form name = "addForm">
      <ul>
        <li style= "font-size: 20px;">Name</li>
        <input type = "text" name = "Name" size = "40" class = "box1" ng-model = "input" required/>

        <li style= "font-size: 20px;">Number</li>
        <input type = "text" name = "Number" size = "40" class = "box2" ng-model = "input2" required/>

        <li style= "font-size: 20px;">Appointment Date</li>
        <input type = "text" name = "Date" size = "40" class = "box3" ng-model = "input3" required/>

        <li ><a href = '#' style = "text-decoration: none; color: inherit;" class = "button" ng-disabled="addForm.$invalid" ng-click = "addName()" >Submit</a>
          <a href = '#' style = "text-decoration: none; color: inherit;" class = "cancel">Cancel</a>
        </li>
      </ul>
    </form>

    </nav>

Upvotes: 1

Views: 618

Answers (1)

Matheno
Matheno

Reputation: 4142

There is no disabled attribute for hyperlinks. You can do this:

.disabled {
  cursor: not-allowed;
}

<a ng-click="disabled()" ng-class="{disabled: addName()}">Add</a>

$scope.disabled = function() {
  if($scope.addName) { return false;}
}

Upvotes: 1

Related Questions