0

I have to provide mandatory fields validation in my ionic app. But, i am not being able to get the default angular form validation working. I used ng-submit but in ionic that's not even firing the submit. Is there a directive that i can use

<ion-view title="Dashboard">
  <ion-content class="has-header padding">
    <form name="myForm" ng-controller="DashCtrl">
      <input type="radio" ng-model="color" value="red" required>  Red <br/>
      <input type="radio" ng-model="color" value="green" required> Green <br/>
      <input type="radio" ng-model="color" value="blue" required> Blue <br/>
      <tt>color = {{color | json}}</tt><br/>
      <button type="submit" ng-click="submitForm()">Submit</button>
    </form>
  </ion-content>
</ion-view>

But, if its an AngularJS app, its working as expected

AngularJS Plunkr : https://plnkr.co/edit/EdItU2IIkO1KIsC052Xx?p=preview

IONIC Plunkr : https://plnkr.co/edit/tr7btg7mr0SHhbOB?p=preview

georgeawg
  • 48,608
  • 13
  • 72
  • 95
Sourav Das
  • 982
  • 1
  • 15
  • 40
  • In the IONIC, the code uses the `ng-click` directive on the submit button. In the AngularJS, the code uses the `ng-submit` directive on the `
    ` element. The IONIC uses `required`; the AngularJS uses `ng-required`. Apples to oranges.
     – georgeawg Sep 22 '19 at 07:06

1 Answers1

0

For HTML5 not working in Ionic check maybe this answer from html5 validation in Ionic

But, you can do this as well:

change your submit with ng-click="submitForm(myForm)"

and your submit function like this 

   $scope.submitForm = function(form) {
     if (form.$valid == true){
       console.log('yay')
     } else {
       console.log('Nyay')
     }
    };

forked your plnkr with this changes, check it HERE

Hope it helps!

georgeawg
  • 48,608
  • 13
  • 72
  • 95
Cristian Cimuca
  • 177
  • 1
  • 8
  • [Avoid uninformative links](http://stephanieleary.com/2015/05/why-click-here-is-a-terrible-link-and-what-to-write-instead/) – georgeawg Sep 22 '19 at 03:23