0

hat is how I have multiple values which I will send to continue to like the customer can create user.

I found it here: https://stackoverflow.com/a/14520103/7180653 (With an object array as input data)

I take based on his code and that is how I should only have the values of the knowledge which is true.

When I look at my button. so I get this error:

Array[0]

TypeError: Cannot read property 'map' of undefined

html - view:

<ul style="list-style-type:none;">
    <li class="col-md-4" ng-repeat="Value in ColorAddUppers">
        <img ng-src="{{Value.Image}}" class="img-responsive img-rounded mb-lg" />
        <p class="label label-lg label-primary full-width">
            <input type="checkbox"
                    ng-model="Value.selected"
                    name="selectedColorUppers[]"
                    value="{{Value.IDColor}}" />
            {{Value.Text}}
        </p>
    </li>
</ul>

CreateUser.js

var url = "/JsonClass/ColorAddToUppers";
$http.get(url).success(function (response) {
    $scope.ColorAddUppers = response;
});


//Overdel
$scope.NextLvlThree = function () {
    //Check Color Values

    $scope.selectionColorUppersView = [];
    $scope.selectedColorUppers = function selectedColorUppers() {
        return filterFilter($scope.ColorAddUppers, { selected: true });
    };
    $scope.$watch('fruits|filter:{selected:true}', function (nv) {
        $scope.selectionColorUppersView = nv.map(function (ColorNameUppersText) {
            return ColorNameUppersText.Text;
        });
    }, true);

    console.log($scope.selectionColorUppersView);
}

EIDT (Update)

enter image description here

As I look at this picture, it's like it does not get my values.

I have used this in the code:

$scope.selectedTextValuesByWatch = [];

    $scope.$watchCollection('ColorAddUppers|filter:{selected:true}', function (nv, ov) {
        $scope.selectedTextValuesByWatch = nv.filter(function (value) {
            return value.selected;
        }).map(function (value) {
            return value.Text;
        });
    }, true);

    $scope.getSelectedTextValues = function () {
        return $scope.ColorAddUppers.filter(function (value) {
            return value.selected;
        }).map(function (value) {
            return value.Text;
        });
    }

    console.log($scope.selectedTextValuesByWatch);

    if($scope.selectedTextValuesByWatch.length >= 1)
    {
        console.log("check");
    }
    else
    {
        console.log("error");
    }
Community
  • 1
  • 1
Jesper P
  • 7
  • 3

1 Answers1

0

I'm not sure when you call NextLvlThree() function, but the declaration of the $watch should be at the controller level and not inside this function to avoid multiple declarations.

Anyway, there are several ways to get the selected values in a list:

Use a dynamic filter in the view, e.g. shall display the select values as json:

 <pre>{ColorAddUppers|filter:{selected:true}|json}}</pre>

Use a watch that will update the selected list that contains only the Text of each value:

$scope.$watchCollection('ColorAddUppers|filter:{selected:true}', function (nv, ov) {
   $scope.selectedTextValuesByWatch = nv.filter(function (value) {
      return value.selected;
   }).map(function(value) {
      return value.Text;
   });
}, true);

Or just use a function that does the same filtering as the watch but when the user click on some button:

$scope.getSelectedTextValues = function() {
    return $scope.ColorAddUppers.filter(function(value) {
       return value.selected;
    }).map(function(value) {
       return value.Text;
    });
}

See all 3 in action in this plunker here.

T.Gounelle
  • 5,953
  • 1
  • 22
  • 32
  • That's how I think it should be. Thanks for the help. and I have several questions I will come straight back otherwise I create a new one. good day to you – Jesper P Dec 15 '16 at 16:18