count duplicate values in array using angularjs

Question

I have a form with 5 questions and 3 different answers for each question.

e.g. q1. whats is your favorite color?

radio button-1. value blue radio button-2. value red radio button-3. value grey

most of these questions have the same value (blue, red, grey), which is what I want, however, I'm trying to add all the values together at the end of the form so I can determine if the person filling out the form equals one of the values (blue, red, or grey).

I'm building this form with angularjs and this is what i have so far.

 <label>Q1. what is your favorite color?</label>
    <div class="form-group">
        <div class="radio">
            <label>
          <input type="radio" ng-model="formData.color" value="blue">
              blue
            </label>
        </div>
        <div class="radio">
            <label>
           <input type="radio" ng-model="formData.color" value="red">
                red
            </label>
        </div>
        <div class="radio">
            <label>
          <input type="radio" ng-model="formData.color" value="grey">
               grey
            </label>
        </div>

this bit of code only works if I have the values already entered into the variable

$scope.formData = { };
$scope.formData = [];
$scope.formData.sort();
var current = null;
var cnt = 0;
for (var i = 0; i < $scope.formData.length; i++) {
    if ($scope.formData[i] != current) {
        if (cnt > 0) {
            console.log(current + ' shows ' + cnt + ' times');
        }
        current = $scope.formData[i];
        cnt = 1;
    } else {
        cnt++;
    }
}
if (cnt > 0) {
   console.log(current + ' shows ' + cnt + ' times');
}

based on your ng-model ... formdata is an object with one property color. Objects aren't sortable so your controller code is a bit confusing. Can you create a demo with a couple of questions so we can see your code context more — charlietfl
– charlietfl, Commented Jan 23, 2015 at 2:51
the results page would show the color that best represents that person based on the answers selected. does that makes sense? I'm prolly doing it wrong... plnkr.co/edit/FtL8arjcHPUEbs4r1BJS — Society43
– Society43, Commented Jan 23, 2015 at 3:50
handy trick to make data readable using angular json filter ..{{ formData |json }} — charlietfl
– charlietfl, Commented Jan 23, 2015 at 3:56
so can see that you have an object in your data print. Since not array it has no length. Can loop over properties though and create another object that has colors as keys and counts as value. See if this helps jsfiddle.net/8eq0mnbL — charlietfl
– charlietfl, Commented Jan 23, 2015 at 4:03
would this help plnkr.co/edit/SXJaFH0EfbClLuyHI7vY?p=preview ? — klode
– klode, Commented Jan 23, 2015 at 4:05

klode · Accepted Answer · 2015-01-23 14:51:59Z

1

Here is an example solution plunker. Would it work?

controller

  $scope.questions = [
    'Q1. what is your favorite color?',
    'Q2. what color is your car?',
    'Q3. what color best represents you?'
  ];
  $scope.formData = [];

  $scope.stats = function() {
    $scope.results = {};
    for (var i = 0; i < $scope.formData.length; i++) {
      var color = $scope.formData[i];
      if(color) {
        if ($scope.results.hasOwnProperty(color)) {
          $scope.results[color]++;
        } else {
          $scope.results[color] = 1;
        }
      }
    }
  };

template

<div class="form-group" ng-repeat="q in questions">
  <label>{{q}}</label>
  <div class="radio">
    <label>
      <input type="radio" ng-model="formData[$index]" value="blue">blue
    </label>
  </div>
  <div class="radio">
    <label>
      <input type="radio" ng-model="formData[$index]" value="red">red
    </label>
  </div>
  <div class="radio">
    <label>
      <input type="radio" ng-model="formData[$index]" value="grey">grey
    </label>
  </div>
</div>

<button ng-click="stats()">show results</button>

<ul>
<li ng-repeat="(c, n) in results"> {{c}} shows {{n}} times</li>
</ul>

edited Jan 23, 2015 at 14:51

answered Jan 23, 2015 at 14:00

klode

11.1k6 gold badges38 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Society43 Over a year ago

So instead of repeating the radio labels "blue, red, grey" for each question in the ng-repeat, I would need to have different answers for each question, while still keep the values the same.

klode Over a year ago

one approach can be to start thinking what is the data structure for your answers. For example [{value11: label11, value12: label12, ....}, {value21: label21, value22: label22,...} ...] and next figure out how to code them in your controllers and templates

klode Over a year ago

answers[1] = {value11: label11, value12: label12, ....}; answers[2]={value21: label21, value22: label22,...}

klode Over a year ago

@Society43 could you vote/accept the answer if you find it useful?

Collectives™ on Stack Overflow

count duplicate values in array using angularjs

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related