D
D
Damir Makhmutov2013-12-16 17:37:45
JavaScript
Damir Makhmutov, 2013-12-16 17:37:45

Angularjs and "value" inputs

Hello. I implement payment through the paysto.com service , and the situation is as follows:
Payment in principle is implemented as in many services, you just need to send the form to a specific url, with certain parameters. For example:

<form accept-charset='UTF-8' method='POST' action='https://paysto.com/ru/pay/AuthorizeNet' style="display: none">
    <input type="hidden" name="x_description" value="Покупка мечты" />
    <input type="hidden" name="x_login" ng-model="newPayment.shopId" />
    <input type="hidden" name="x_amount" ng-model="newPayment.amount" />
    ...
</form>

After the user clicks on the "pay" button, a function is called in which:
Payment.reservePayment(function(response) {
     $scope.newPayment = response;
});

The parameters for the payment gateway are returned from the server (paymentId, hash, etc.) and written to a variable that is bound to the form. The problem is this:
ng-model does not put a native value attribute on the input field, and after the form is submitted, empty parameters are sent. This can be seen by doing:
$('#myForm').serialize();

> x_login=&x_amount=&x_currency_code=RUB&x_fp_sequence=&x_fp_timestamp=&x_fp_hash=&x_invoice_num=

Prompt please - how to be, how to force the form to go as it is necessary?
UPD: Solved, the problem was my carelessness :-)

Answer the question

In order to leave comments, you need to log in

2 answer(s)
I
itspers, 2013-12-16
@doodoo

This is precisely because of hidden.
Here, either bind the value to value, like value="{{newPayment.shopId}}"
Or just make type="text" and hide it in CSS, but the first option is correct. Ng-model is needed for binding in two directions - and if the input is hidden - it only works in one direction. Accordingly, he does not need ng-model.
Here: https://github.com/angular/angular.js/pull/2574

Why ng-model as you don't need two way data-binding? if you set value="{{ myModel }}" it works nicely

D
Damir Makhmutov, 2013-12-16
@doodoo

@itspers Weird, it value="{{ newPayment.shopId }}"didn't work either ng-value="newPayment.shopId"..

Payment.reservePayment(function(response) {
     $scope.newPayment = response;
});

Payment is a module service, so everything is done in the angular context, and $apply is definitely not needed..
Now I'll try the second option you suggested

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question