如何在最后一个孩子取消选中后启用父母?

时间:2015-04-20 14:21:16

标签: javascript angularjs kendo-ui

我已经根据用户需求实现了启用/禁用子级和父级的代码,因此我需要一个带有复选框的kendo树视图,其中我在取消选中子项时在代码下面实现了启用父级,这就是它想要做的但问题是如果我检查多个孩子并取消选中其中任何一个孩子的启用父母。我希望在最后一个孩子取消选中时启用父级。

到目前为止看下面的代码......

HTML

<div id="treeViewDisplay4" class="dropdown-menu multi-level" ng-style="nonPersistentProcess.geoLocationStyle">
    <div kendo-tree-view="geoLocationTree" k-data-source="geoLocationDataSource" options="geoLocationTreeOptions" k-on-expand="onGeoExpand(kendoEvent)" k-rebind="nonPersistentProcess.selectedTypeGEO"></div>
</div>

index.js

$scope.updateGeoLoctionList = function(geoLocation){
        var pos = $.inArray(geoLocation.text, selectedGeoLocations);

        if(pos < 0){
            selectedGeoLocations.push(geoLocation.text);
            selectedGeoLocationIds.push(geoLocation.id);
            //if Global is checked disable all parent and children
            if (geoLocation.id === 5657){
              $.each(geoLocation.parent(),function(index,location) {
                if (location.id !== geoLocation.id) {
                  $.each(location._childrenOptions.data.items,function(index,child){
                    var disableChildId = 'disabled' + child.id;
                    var model = $parse(disableChildId);
                      model.assign($scope, true);
                  })
                  var disableItemId = 'disabled' + location.id;
                  // Get the model
                  var model = $parse(disableItemId);
                  // Assigns a value to it
                  model.assign($scope, true);

                }
              });
            }
            // If a child is checked Disable the parents
            try {
                var parent = geoLocation.parent().parent();
                var disableParentId = 'disabled' + parent.id;
                var parentModel = $parse(disableParentId);
                parentModel.assign($scope, true);
            } catch (err) {
           // Ignore since this happens when a node is selected which has no children 
              }
           //Expand tree on parent check so childs can be disabled.
            $scope.geoLocationTree.expand($scope.geoLocationTree.findByText(geoLocation.text));
            //If the parent item is checked, disable all the children
            if(geoLocation.items) {
                $.each(geoLocation.items,function(index,location) {
                  var disableItemId = 'disabled' + location.id;
                  // Get the model
                  var model = $parse(disableItemId);
                  // Assigns a value to it
                  model.assign($scope, true);
                });
            }
        } else {

            selectedGeoLocations.splice(pos,1);
            selectedGeoLocationIds.splice($.inArray(geoLocation.id,selectedGeoLocationIds),1);
            //if Global is uncheck enable all parents and children
            if (geoLocation.id === 5657){
              var getParent = geoLocation.parent();
              $.each(geoLocation.parent(),function(index,location) {
                if (location.id !== geoLocation.id) {
                  $.each(location._childrenOptions.data.items,function(index,child){
                    var disableChildId = 'disabled' + child.id;
                    var model = $parse(disableChildId);
                      model.assign($scope, false);
                  })
                  var disableItemId = 'disabled' + location.id;
                  // Get the model
                  var model = $parse(disableItemId);
                  // Assigns a value to it
                  model.assign($scope, false);
                }
              });
            }
            // If child is unchecked Enable the parent
            try {
                  var parent = geoLocation.parent().parent();
                  $.each(parent._childrenOptions.data.items,function(index,childNode){
                    for(var i=0; i < geoLocation.length; i++){
                    }
                  })
                  var disableParentId = 'disabled' + parent.id;
                  // Get the model
                  var parentModel = $parse(disableParentId);
                  // Assigns a value to it
                  parentModel.assign($scope, false);
            } catch (err) {
              // Ignore since this happens when a node is selected which has no children 
            }
            //If the parent item is unchecked,  enable the childrens
            if(geoLocation.items){
                $.each(geoLocation.items,function(index,location){
                  var disableItemId = 'disabled' + location.id;
                  // Get the model
                  var model = $parse(disableItemId);
                  // Assigns a value to it
                  model.assign($scope, false);
                });
            }
        }
        $scope.nonPersistentProcess.geoLocations = selectedGeoLocations.toString();  
    };

Config.js

geoLocationTreeConfig : {
        template: '{{dataItem.text}}',
        checkboxes: {
            checkChildren: false,
           template: '<input ng-disabled=\'disabled#: item.id #\' type=\'checkbox\' ng-click=\'updateGeoLoctionList(dataItem)\' value=\'true\' />'
        }

1 个答案:

答案 0 :(得分:0)

我将selectedItems []传递给newArray,如果条件我能够在最后一个子节点取消选中后启用父节点。

try {
                      var parent = geoLocation.parent().parent();
                      var checkedChildrens = [];
                      for (var i=0; i<selectedRiskGeoLocations.length; i++){
                        var checkNodes = selectedRiskGeoLocations[i];
                        checkedChildrens.push(checkNodes);
                      }
                      if (checkedChildrens.length === 0){
                        var disableParentId = 'disabled' + parent.id;
                        // Get the model
                        var parentModel = $parse(disableParentId);
                        // Assigns a value to it
                        parentModel.assign($scope, false);
                      };
                }