Note that there are some explanatory texts on larger screens.

plurals
  1. POangular.js scope variable is updating but view is not
    text
    copied!<p>i am using angular.js with rails as my backend and i am encountering problem while updating the value of a scope variable inside the view. here i am trying to create a shopping cart kind of a thing. </p> <p>html code</p> <pre><code>&lt;div class="modal hide fade" id="orderForm"&gt; &lt;div class="modal-header"&gt; &lt;h3&gt; Please enter your location details &lt;button type="button" class="close" data-dismiss="modal" aria-hidden="true"&gt;&amp;times;&lt;/button&gt; &lt;/h3&gt; &lt;/div&gt; &lt;div class="modal-body scrollable"&gt; &lt;form accept-charset="UTF-8" class="simple_form form-horizontal" name="orderForm" novalidate="novalidate" ng-submit="validateAndSubmit(orderForm)" id="order_form"&gt; &lt;div class="control-group string optional order_full_name"&gt; &lt;label class="string optional control-label" for="order_full_name"&gt;Full name&lt;/label&gt; &lt;div class="controls"&gt; &lt;input class="string optional required " id="order_full_name" name="full_name" ng-model="full_name" placeholder="eg. Kapil Sharma" size="50" type="text" value=""&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="modal-footer"&gt; &lt;a href="" data-dismiss="modal" aria-hidden="true" class="btn"&gt; Close &lt;/a&gt; &lt;button type="submit" class="btn btn-success"&gt; &lt;i class="icon-ok"&gt;&lt;/i&gt;&amp;nbsp;Place order&lt;/button&gt; &lt;%# end %&gt; &lt;/form&gt; &lt;/div&gt; </code></pre> <p></p> <p>this is a bootstrap modal and is called with <code>$('#orderForm').modal('show');</code></p> <p>here is my javascript angular code.</p> <pre><code>$scope.validateAndSubmit = function(form){ if(form.$valid){ var formData = $('#order_form').serializeObject();; $http.post('/create_order',{'order': formData}) .success(function(data,status){ $scope.currentOrder = data; $('#orderForm').modal('hide'); $scope.currentOrder = []; }).error(function(data,status){ //show error alert("error"); }); } else{ alert("invalid form"); } </code></pre> <p>}</p> <p>the problem is with my scope variable <code>$scope.currentOrder</code>, in all other functions its working fine but in validateAndSubmit method its not updating the view as required i have checked the value of the scope variable by using the javascript <code>setInterval</code> method</p> <pre><code> setInterval(function(){ alert($scope.currentOrder); } , 5000); </code></pre> <p>the updated value is fine in alert but the view is not updating the value, please help. Thanks in advance.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload