Merge pull request #752 from AllenBW/bug/#751-unsafe-links

fix(pfFilter): unsafe:javascript:void(0) redirect when clearing filters

Author: dtaylor113

src/filters/filter-panel/filter-panel-results-component.js

@@ -57,8 +57,9 @@ angular.module('patternfly.filters').component('pfFilterPanelResults', {
       }
     }
 
-    function clearFilter (filter, value) {
+    function clearFilter (evt, filter, value) {
       var changedFilterId = filter.id;
+      evt.preventDefault();
 
       _.pull(filter.values, value);
 
@@ -71,7 +72,9 @@ angular.module('patternfly.filters').component('pfFilterPanelResults', {
       }
     }
 
-    function clearAllFilters () {
+    function clearAllFilters (evt) {
+      evt.preventDefault();
+
       ctrl.config.appliedFilters = [];
 
       if (ctrl.config.onFilterChange) {

src/filters/filter-panel/filter-panel-results.html

@@ -13,13 +13,13 @@ <h5>
         <ul class="list-inline filter-pf-category-values">
           <li ng-repeat="value in filter.values">
             <span class="label label-info">{{value}}
-              <a href="javascript:void(0);"><span ng-click="$ctrl.clearFilter(filter, value)" class="pficon pficon-close"></span></a>
+              <a href="#"><span ng-click="$ctrl.clearFilter($event, filter, value)" class="pficon pficon-close"></span></a>
             </span>
           </li>
         </ul>
       </span>
       </li>
     </ul>
-    <p><a href="javascript:void(0);" ng-click="$ctrl.clearAllFilters()" ng-if="$ctrl.config.appliedFilters.length > 0">Clear All Filters</a></p>
+    <p><a href="#" ng-click="$ctrl.clearAllFilters($event)" ng-if="$ctrl.config.appliedFilters.length > 0">Clear All Filters</a></p>
   </div>
 </div>

src/filters/simple-filter/filter-results-component.js

@@ -71,8 +71,10 @@ angular.module('patternfly.filters').component('pfFilterResults', {
       ctrl.config.itemsLabelPlural = ctrl.config.itemsLabelPlural || 'Results';
     }
 
-    function clearFilter (item) {
+    function clearFilter (evt, item) {
       var newFilters = [];
+      evt.preventDefault();
+
       ctrl.config.appliedFilters.forEach(function (filter) {
         if (item.title !== filter.title || item.value !== filter.value) {
           newFilters.push(filter);
@@ -85,7 +87,9 @@ angular.module('patternfly.filters').component('pfFilterResults', {
       }
     }
 
-    function clearAllFilters () {
+    function clearAllFilters (evt) {
+      evt.preventDefault();
+
       ctrl.config.appliedFilters = [];
 
       if (ctrl.config.onFilterChange) {

src/filters/simple-filter/filter-results.html

@@ -13,11 +13,11 @@ <h5 ng-if="$ctrl.config.totalCount !== 1">{{$ctrl.config.resultsCount}} of {{$ct
       <li ng-repeat="filter in $ctrl.config.appliedFilters">
       <span class="active-filter label label-info">
         {{filter.title}}: {{((filter.value.filterCategory.title || filter.value.filterCategory) + filter.value.filterDelimiter + (filter.value.filterValue.title || filter.value.filterValue)) || filter.value.title || filter.value}}
-        <a href="javascript:void(0);"><span class="pficon pficon-close" ng-click="$ctrl.clearFilter(filter)"></span></a>
+        <a href="#"><span class="pficon pficon-close" ng-click="$ctrl.clearFilter($event, filter)"></span></a>
       </span>
       </li>
     </ul>
-    <p><a href="javascript:void(0);" class="clear-filters" ng-click="$ctrl.clearAllFilters()" ng-if="$ctrl.config.appliedFilters.length > 0">Clear All Filters</a></p>
+    <p><a href="#" class="clear-filters" ng-click="$ctrl.clearAllFilters($event)" ng-if="$ctrl.config.appliedFilters.length > 0">Clear All Filters</a></p>
     <div ng-if="$ctrl.config.selectedCount !== undefined && $ctrl.config.totalCount !== undefined" class="pf-table-view-selected-label">
       <strong>{{$ctrl.config.selectedCount}}</strong> of <strong>{{$ctrl.config.totalCount}}</strong> selected
     </div>

src/select/select.component.js

@@ -33,7 +33,9 @@ angular.module('patternfly.select').component('pfSelect', {
       return value;
     }
 
-    function selectItem (item) {
+    function selectItem (evt, item) {
+      evt.preventDefault();
+
       ctrl.selected = item;
       if (angular.isFunction(ctrl.onSelect)) {
         ctrl.onSelect(item);

src/select/select.html

@@ -5,12 +5,12 @@
   </button>
   <ul uib-dropdown-menu>
     <li ng-if="$ctrl.emptyValue" ng-class="{'selected': !$ctrl.selected}">
-      <a href="javascript:void(0);" role="menuitem" tabindex="-1" ng-click="$ctrl.selectItem()">
+      <a href="#" role="menuitem" tabindex="-1" ng-click="$ctrl.selectItem($event)">
         {{$ctrl.emptyValue}}
       </a>
     </li>
     <li ng-repeat="item in $ctrl.options" ng-class="{'selected': item === $ctrl.selected}">
-      <a href="javascript:void(0);" role="menuitem" tabindex="-1" ng-click="$ctrl.selectItem(item)">
+      <a href="#" role="menuitem" tabindex="-1" ng-click="$ctrl.selectItem($event, item)">
         {{$ctrl.getDisplayValue(item)}}
       </a>
     </li>

src/sort/sort-component.js

@@ -58,7 +58,9 @@ angular.module('patternfly.sort').component('pfSort', {
       }
     }
 
-    function selectField (field) {
+    function selectField (evt, field) {
+      evt.preventDefault();
+
       ctrl.config.currentField = field;
 
       if (ctrl.config.onSortChange) {

src/sort/sort.html

@@ -6,7 +6,7 @@
     </button>
     <ul uib-dropdown-menu>
       <li ng-repeat="item in $ctrl.config.fields" ng-class="{'selected': item === $ctrl.config.currentField}">
-        <a href="javascript:void(0);" class="sort-field" role="menuitem" tabindex="-1" ng-click="$ctrl.selectField(item)">
+        <a href="#" class="sort-field" role="menuitem" tabindex="-1" ng-click="$ctrl.selectField($event, item)">
           {{item.title}}
         </a>
       </li>