CODEWITHSUNDEEP
javascriptangularjs
Programador Adagal
Programador Adagal

Reputation: 780

AngularJS Force submit doesn't send some hidden input values

I have a page with an angular app. Everything goes fine, the final PHP catches all the values from the inputs except the 'prods' field which is empty

HTML Code

<form name="goToPaymentForm" id="goToPaymentForm" ng-form-commit action="payment.php" method="POST">
      <input type="hidden" id="payment_method" name="payment_method" ng-value="payment" />
      <input type="hidden" id="prods" name="prods" ng-value="prods" />
      <input type="hidden" id="terms" name="terms" ng-value="legalTermsAccepted" />
    </form>

Angular Code

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

$scope.goToPayment = function($form){
    $scope.prods = JSON.stringify($scope.cart);
    $form.commit();
}

In console I catch this text:

Resource interpreted as Document but transferred with MIME type application/json

Why I don't use AJAX for sending? I submit the form because I have a controller which will redirect the browser to the proper secure payment platform (the user cannot interact with this, despite of JavaScript redirection methods). What am I doing wrong? Why does my prods hidden field have an empty value?

Final PHP Result

{
    payment_method: "paypal",
    prods: "",
    terms: "true"
}

Upvotes: 0

Views: 83

Answers (1)

Mehdi Benmoha
Mehdi Benmoha

Reputation: 3945

I think you should bind the prods with the ng-model directive so that you can get it's value in AngularJS. Like this:

<input type="hidden" ng-model="prods" id="prods" name="prods" ng-value="prods" />

And here's the documentation about this directive: https://docs.angularjs.org/api/ng/directive/ngModel

Upvotes: 1

Related Questions