Блог

Я пытаюсь отправить форму, но значения всегда пусты.

мой HTML:

      <form novalidate name="creditCardForm" id="creditCardForm" method="POST">
            <input type="hidden" name="EPS_MERCHANT" value="{{credit.data.merchantId}}">
            <input type="hidden" name="EPS_TIMESTAMP" value="{{credit.data.currentGMTTimestamp}}">
            <input type="hidden" name="EPS_TYPE" value="{{credit.data.epsType}}">

            <div class="text-center">
                <button class="btn btn-primary" ng-click="credit.save()">Save</button>
            </div>
        </form>
  

и моя часть js:

 function save(){
    document.getElementById("creditCardForm").setAttribute("action", this.data.crnUrl)
    document.forms["creditCardForm"].submit()
}
  

и после проверки все эти поля имеют значения

но из запроса все эти поля пусты:

обновите мой вопрос: поскольку это специальная форма post, она будет вызывать api NAB bank для проверки чего-либо, поэтому я не могу поместить каждое поле в объект и выполнить вызов ajax / $resource / $ http. Спасибо

Это не угловой способ отправки формы через атрибут действия. Используйте ng-submit атрибут формы и сделайте $http.post запрос асинхронным.

     <form novalidate name="creditCardForm" id="creditCardForm" 
          ng-submit="saveCredit(creditCardForm)">

        <!-- no input hidden -->

        <div class="text-center">
            <button class="btn btn-primary">Save</button>
        </div>
    </form>
  

И вам не нужны скрытые входные данные таким образом.

Если я правильно понял ваш вопрос и ваше требование. Вы должны использовать следующий способ:

 <form novalidate name="creditCardForm" id="creditCardForm" method="POST">
            <input type="hidden" name="EPS_MERCHANT" ng-model="credit.data.merchantId">
            <input type="hidden" name="EPS_TIMESTAMP" ng-model="credit.data.currentGMTTimestamp">
            <input type="hidden" name="EPS_TYPE" ng-model="credit.data.epsType">

            <div class="text-center">
                <button class="btn btn-primary" ng-click="credit.save(credit.data)">Save</button>
            </div>
        </form>
  

Предполагается, что credit это псевдоним вашего контроллера.

Я попытался сохранить ваши способы ng-click вызова метода на контроллере. Однако с формами в angular вы также можете сделать то же самое с помощью ng-submit директивы.

В вашем контроллере у вас будет что-то вроде:

 $scope.save = function(data){

   //use data here as you like
   //data.merchantId and other fields
}

If you are using alias form, then use:
//vm or any other name you have for your `this` instance
vm.save = function(){

   // use data here as you like
}
  

Я хочу попытаться решить вашу проблему. Первое, что вам нужно сделать, это добавить ng-model и ng-value в вашу форму. Например:

Вид:

 <form novalidate name="creditCardForm" id="creditCardForm" ng-submit="save()">
    <input type="hidden" ng-model="credit_card.eps_merchant" name="eps_timestamp" ng-value="{{credit.data.merchantId}}">
    <input type="hidden" ng-model="credit_card.eps_timestamp" name="eps_timestamp" ng-value="{{credit.data.currentGMTTimestamp}}">
    <input type="hidden" ng-model="credit_card.eps_type" name="eps_type" ng-value="{{credit.data.epsType}}">

    <div class="text-center">
        <button type="submit" class="btn btn-primary">Save</button>
    </div>
</form>
  

Для следующего вы можете создать контроллер. Например:
угловой контроллер:

 angular.module('cartApp')
.controller('AddCreditCartCtrl', [
'$scope',
'$location',
'$http',
function($scope, $location, $http) {
    $scope.credit_card = {};
    $scope.credit.data = {
        merchantId: 'your-merchant-id',
        currentGMTTimestamp: 'your-currentGMTTimestamp',
        epsType: 'your-epsType'
    }

    $scope.save = function () {
        $http.post('/yourUrl', {credit_card: $scope.credit_card}).then(function(res){
            // Successfully create data
        },
        function(response) {
            // Failed to create data
        });
    }
}]);
  

Я надеюсь, что это может вам помочь. 🙂

спасибо каждому телу выше. просто хочу поделиться основной причиной

У меня вызвана директива <credit-card></credit-card> , и внутри этой директивы у меня есть форма с именем и идентификатором creditCardForm , поэтому, когда эта директива используется в нескольких местах и в используемом мной контроллере document.forms["creditCardForm"] , js не знал, какая форма является целевой, и это приводит к пустым значениям в запросе

надеюсь, это может помочь кому-то с такой же проблемой