0

The angularJS form is given below this question. what i want to do is change the value of #quantity input from 1 to 200 using JavaScript and then click on the Buy button. But after i submit the form by clicking on the Buy button, the value of #quantity input returns to its default value which is 1. The AngularJS form I tried the following code to change the value of #quantity input element:

var qty = document.getElementById('quantity');
var buy = document.querySelector('button.btn.place');
qty.value = "123";  
qty.select();
buy.click();`

But it doesn't work. It always rejects the value. Sorry, i don't have any knowledge about AngluarJS and also it will take a lot of time for me to learn AngularJS.

Here is the code for the QTY input element:

<input type="number" step="1" id="quantity" name="quantity" ng-model="options.quantity" class="input width-100 numeric ng-isolate-scope ng-valid-number ng-valid-checklotsize ng-dirty ng-valid-required ng-valid ng-valid-integer" min="1" checklotsize="1" integer="" esc-key="" esc-key-action="close()" ng-disabled="!uiConstraints.quantity" required="">

and the BUY button:

<button type="submit" class="btn place btn-blue" ng-class="options.transaction_type == 'BUY' ? 'btn-blue' : 'btn-orange'" ng-disabled="buysellform.$invalid || order_status === true">
<span class="spinner icon ng-hide" ng-show="order_status === true">
    <span class="icon icon-spinner animate-spin"></span>
</span>
<span class="icon ng-hide" ng-show="order_status !== true &amp;&amp; execution_type == 'MODIFY'">MODIFY</span>
<span class="icon ng-binding" ng-show="order_status !== true &amp;&amp; execution_type == 'PLACE'">BUY</span></button>
kryptokinght
  • 539
  • 5
  • 12
  • 3
    Don't modify the DOM. Modify the scope variables and let Angular update the DOM. (So in this case you'd just change the value of `options.quantity` and Angular will update the form fields for you.) – Daniel Beck Jan 25 '18 at 18:08
  • 3
    (Angular works *very* differently from jQuery. They don't mix well. If you're going to be doing any amount of work in angular I'd strongly suggest working your way through some tutorials and intros first, it's not easy to learn by doing.) – Daniel Beck Jan 25 '18 at 18:09
  • Well, i think you are right. I need to learn Angular first! – kryptokinght Jan 25 '18 at 18:11
  • This question here solves my problem https://stackoverflow.com/questions/13743058/how-do-i-access-the-scope-variable-in-browsers-console-using-angularjs – kryptokinght Jan 27 '18 at 10:49

1 Answers1

-1

please try this

var model =  angular.element(document.getElementById('quantity')).data('$ngModelController')
model.$setViewValue('123')
document.querySelector('button.btn.place').click();

this is the dirty way of changing the angular model in javascript.

Shekhar
  • 416
  • 2
  • 5
  • 13
  • I would strongly recommend to avoid dom manipulation directly in angular's controller. Write the business logic only in your controllers – Shekhar Jan 25 '18 at 18:21