Databases
StackOverflow2013
Postsdbo
POunable to get ng-checked property for a radio button to check the button when populating a form
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POunable to get ng-checked property for a radio button to check the button when populating a form
    text
    copied!<p>EDIT: for those of you who don't want to go through the code, I'm basically passing the form a "node" object with node.selectedAnswer = "4,1,4" or some string like that. The form has radio buttons and one of the buttons has a value "4,1,4". the radio button also has ng-checked="node.selectedAnswer" expression. But that doesn't work. I know for sure that node.selectedAnswer has the appropriate value. </p> <p>I have a series of radio button questions that I'm asking the user. I want them to be able to go previous and next. I'm using a stack to store the data retrieved from ajax call, as well as selectedAnswer when they select an option and click next. I've commented the code itself to explain the situation where I can. Everything seems to be working, except ng-checked is just not picking up node.selectedAnswer, even though I can output {{node.selectedAnswer}} properly to the page.</p> <pre class="lang-html prettyprint-override"><code> &lt;div class="container-fluid" ng-app="AccountRequest" ng-controller="GameNode" ng-init="outside={}"&gt; &lt;div class="row-fluid"&gt; &lt;div class="span2"&gt;&lt;/div&gt; &lt;div class="span10"&gt; &lt;form&gt; &lt;!-- node.selectedAnswer displays the selectedAnswer correctly when clicking previous and going back. However, ng-checked is somehow not selecting the appropriate radio button. --&gt; &lt;span&gt;{{node.Question.Text}} selected answer: {{node.selectedAnswer}}&lt;/span&gt; &lt;div class="radio" ng-repeat="answer in node.Answers"&gt; &lt;input type="radio" id="answerGroup" name="answerGroup" ng-checked="node.selectedAnswer" ng-model="outside.selectedAnswer" value="{{answer.BranchId}},{{node.LeafId}},{{answer.Id}}"/&gt; {{answer.Text}} &lt;/div&gt; &lt;div&gt; &lt;input type="button" ng-click="previous()" value="Previous"/&gt; &lt;input type="button" ng-click="next(outside.selectedAnswer)" value="Next"/&gt; &lt;/div&gt; &lt;/form&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>//below is the script</p> <pre class="lang-js prettyprint-override"><code> app.controller('GameNode', function ($scope, $http) { var nodes = []; function load(branchId, leafId, answerId) { $http.get("/AccountRequest/GetNode?branchId=" + branchId + "&amp;leafId=" + leafId + "&amp;answerId=" + answerId) .success(function (data) { //get data and push it in the stack nodes.push(data); $scope.node = data; }); } function populateValues(selectedAnswer) { var answer = null; if (selectedAnswer === undefined || selectedAnswer == null) selectedAnswer = "0,0,0"; //when next is clicked, retrieve the selectedAnswer from form and store it in current node as a property. if (nodes.length &gt; 0) { var curNode = nodes.pop(); curNode.selectedAnswer = selectedAnswer; nodes.push(curNode); } answer = selectedAnswer.split(','); if (answer != null) { load(answer[0], answer[1], answer[2]); } } $scope.next = populateValues; $scope.previous = function () { //when previous is clicked, pop the current node out and throw it away. //then pop the previous node out, read it, and push it back in as current node. if (nodes.length &gt; 1) { nodes.pop(); var prevNode = nodes.pop(); nodes.push(prevNode); $scope.node = prevNode; } }; populateValues(); }); </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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