Can I trigger a form submit from a controller?

Can I trigger a form submit from a controller?

I'd like to do a traditional form submit from within a controller. The scenario is that I want to hit a route on my web server and redirect to its response, which I can do with a regular form in HTML, but I also want to do some validation on its fields when the submit button is pressed, and if the validation fails, I don't want to do the route.

I'm aware of ng-valid, but I only want the validation to take place when the button is hit.

Is there a way to conditionally do a form submit from within a controller?

Answer by jpmorin for Can I trigger a form submit from a controller?

Did you try to use the ng-submit directive on your form? You may return true/false after your validation.

Controller

app.controller('MainCtrl', ['$location', function($scope, $location) {    $scope.submit = function(user) {      var isvalid = true;      // validation       if (isvalid) {          $http.get('api/check_something', {}).then(function(result) {              $location.path(result.data);          });          return true;      }      return false; //failed    }  });  

Html (you must not have an action attribute)

Answer by Thom Porter for Can I trigger a form submit from a controller?

How about just out-right disabling the submit button until the form is valid:

Take a look at this similar question I had: AngularJS Form Validation with Directives - "myform.$valid" not quite right for me

Answer by ReklatsMasters for Can I trigger a form submit from a controller?

You can add submit method to a FormController. I did so:

              
    .directive("ngFormCommit", [function(){      return {          require:"form",          link: function($scope, $el, $attr, $form) {              $form.commit = function() {                  $el[0].submit();              };          }      };  }])    .controller("AwesomeCtrl", ["$scope", function($scope){     $scope.save = function($form) {       if ($form.$valid) {           $form.commit();       }     };  }])  

Answer by James Berlin for Can I trigger a form submit from a controller?

This is 'not the Angular' way to do it but you can submit the form using vanilla javascript. For example you can give the form an id and do:

document.getElementById('myForm').submit()

or if you have a submit button you can click it:

document.getElementById('myForm-submit').click()

I found that the first one did not keep the data bindings (I was using it on a project with a JQuery widget that had no Angular alternative), but the second one kept the bindings. I assume this has to do with how the JQuery widget was written.

You can see more about triggering forms with vanilla JS here:

How to submit a form using javascript?

Answer by Rosdi Kasim for Can I trigger a form submit from a controller?

Expanding from @ReklatsMasters's answer, if you want to change a value before submitting the form, you could do like so...

              
    .directive("ngFormCommit", [function(){      return {          require:"form",          link: function($scope, $el, $attr, $form) {              $form.commit = function($newCurrency) {                  $el[0].querySelector('#currency_code').value = $newCurrency;                  $el[0].submit();              };          }      };  }])    .controller("AwesomeCtrl", ["$scope", function($scope){     $scope.save = function($newCurrency, $form) {       if ($form.$valid) {           $form.commit($newCurrency);       }     };  }])  

Fatal error: Call to a member function getElementsByTagName() on a non-object in D:\XAMPP INSTALLASTION\xampp\htdocs\endunpratama9i\www-stackoverflow-info-proses.php on line 72