0

I want to check checkbox based on selection. Suppose in this example i have four logical operation want to do in dynamically.

  1. If Show All selected(checked) remaining all need to select automatically.

  2. If Show All unchecked i have to remove all checked to unchecked.
    If Show Activated & Show In

  3. Activated selected(checked) - Show All should automatically get select.

  4. If any one removed(unchecked - either show activated or show in activated) - Show All should automatically get deselect.

Note : by default show all selected

Here the source code attached.

$scope.objectTypes = ['Show Activated', 'Show InActivated', 'Show All'];    
$scope.selected = ['Show All'];   
$scope.objectSelection = function objectSelection(objectType) {
         var idx = $scope.selected.indexOf(objectType);  


          // is currently selected
         for(var i=0; i<$scope.objectTypes.length;i++) {
         if (idx > -1) {
                if($scope.objectTypes[i]==objectType) {
                      $scope.selected.splice(idx, 1);
                      $scope.selected.splice(1, 1); 
                  }          
         }       
         else if($scope.selected!=0) {      
                if($scope.objectTypes[i]==$scope.selected) {
                      $scope.selected.push(objectType);
                      if(!$scope.selected["Show All"])
                      $scope.selected.push("Show All");
                }            
           } 
          else {
              $scope.selected.push(objectType);
              break;
           }
         }
    };

HTML Code:

<div class="row">
    <div class="col-sm-6">
        <div class="panel panel-primary">
            <div class="panel-heading">Object Information</div>
            <div class="panel-body col-sm-offset-2">
                <div class="form-group">
                    <div class="row">
                        <label for="objectName" class="col-sm-3">Select Object
                            Types</label>
                        <div class="col-sm-4">
                            <ul class="list-unstyled">
                                <li ng-repeat="objectType in objectTypes">
                                        <div class="checkbox">
                                          <label>
                                            <input type="checkbox" name="selectedObjectTypes[]" value="{{objectType}}" ng-checked="selected.indexOf(objectType) > -1" ng-click="objectSelection(objectType)"> {{objectType}}
                                          </label>
                                        </div>
                                    </li>
                            </ul>
                            <button class="k-button" ng-click="objectFilterSubmit()">OK</button>
                            <button class="k-button" ng-click="objectFilterCancel()">Cancel</button>
                             <br>Selected: <b>{{ selected | json }}</b>
                        </div>                      
                    </div>                  
                </div>
            </div>
        </div>
    </div>
</div>

As per the link - http://plnkr.co/edit/eCRsfwMEEYX5iGsraqjd?p=preview
It's working now. Thank you very much.

Now i have another requirement based on this.

How to get the selected values in array and need to perform filtration, below the source code for each selected value i am checking manually but i need to check dynamically.
Please any one help to achieve this.

$scope.objectFilterSubmit = function () {    
         $scope.selectedObject = [];
        if($scope.selected.length>1) {
             $scope.IsActive = "";
             $scope.selectedObjectDatas = $scope.getCustomObjectsBasedOnObjectTypeSelection($scope.IsActive);
             clearPartialElement();
             $scope.objectCreationPage();
        } else {
            angular.forEach($scope.selected, function(value,key){
                if(angular.equals(value, "Show Activated")) {   
                   $scope.IsActive = "true";   
                   $scope.selectedObjectDatas = $scope.getCustomObjectsBasedOnObjectTypeSelection($scope.IsActive);
                   clearPartialElement();
                   $scope.objectCreationPage();  
                }   
                else if(angular.equals(value, "Show InActivated")) {    
                     $scope.IsActive = "false";              
                     $scope.selectedObjectDatas = $scope.getCustomObjectsBasedOnObjectTypeSelection($scope.IsActive);
                     clearPartialElement();
                     $scope.objectCreationPage();   
                }
                else {
                     $scope.IsActive = "";
                     $scope.selectedObjectDatas = $scope.getCustomObjectsBasedOnObjectTypeSelection($scope.IsActive);
                     clearPartialElement();
                     $scope.objectCreationPage();
                }
            });
       }
      };
bagya
  • 51
  • 10

0 Answers0