javascript - Show "All", "Multiple" or "one" based on number of dropdown selections in Angularjs -
i have checkbox list of locations comes in pop-up allowing them select one,multiple or location. default label of dropwdown "select locations".
how handle following scenarios:
display "all" in dropdown selection if user selects "select all" list.
display "multiple" if user selects more one location.
display "location name" if user selects only one location.
here code using create dropdown , pop-up list.but displays "select location(s)" no matter user selects dropdown.
<div class="dropdown cp-dropdown"> <div class="btn btn-default" data-toggle="dropdown"> <!-- {{homectrl.newactivityselectedlocation === '' ? 'select location' : homectrl.newactivityselectedlocation.name}}--> select location(s) <span class="pull-right caret"></span> </div> <div id="location-list" class="dropdown-menu cp-checkbox-dropdown menu-container" role="menu" ng-click="$event.stoppropagation();"> <div> <input type="text" ng-model="homectrl.newactivitysearchlocation" /> </div> <div id="location-list-container"> <div class="row" ng-if="homectrl.newactivitylocationlist.length > 0"> <label class="cp-checkbox"> <input value="all" type="checkbox" id="select_all_locpop" ng-model="homectrl.newactivitylocationselectall" ng-click="homectrl.newactivitylocationfilter('all', homectrl.newactivitylocationselectall)" /> <span></span>select </label> </div> <div id="location-list-pop"> <div class="row" data-ng-repeat="location in homectrl.newactivitylocationlist | filter: {'name':homectrl.newactivitysearchlocation}"> <label class="cp-checkbox"> <input value="{{location.id}}" type="checkbox" ng-click="homectrl.updateactivitygrid('location-list-pop','select_all_locpop')" /><span></span> {{location.name}} </label> </div> </div> </div> </div> </div> </div>
store clicks in temp list , update label depending on status between main list , temp.
var updatelocationdisplay = function(){ if(templist.length === mainlist.length){ $scope.locationlabel = "all"; }else if(templist.length > 1){ $scope.locationlabel = "multiple"; }else if(templist.length === 1){ $scope.locationlabel = templist[0]; }else{ $scope.locationlabel = "select location"; } }; $scope.locationclick = function(name){ var index = templist.indexof(name); if(index > 0){ // remove templist.splice(index, 1); } else{ // add templist.push(name); } updatelocationdisplay(); };
}
Comments
Post a Comment