fixed entering the edit mode by clicking on a search parameter, fixed #3 #14 #21

Author: dnauck

CHANGELOG.md

@@ -5,6 +5,7 @@
 * Hide in use search parameter suggestions, fixed issue #8
 * correctly handle isolation scope of 'placeholder' attribute, fixed #15
 * revert change for issue #3, click on container element enables focus, fixed #14
+* fixed entering the edit mode by clicking on a search parameter, fixed #3 #14 #21
 * fixed browser back behaviour when removing queries, pull request #23
 * add option to configure the suggested parameter label text
 

src/angular-advanced-searchbox.html

@@ -8,15 +8,15 @@
             <a ng-href="" ng-click="removeSearchParam($index)" role="button">
                 <span class="remove glyphicon glyphicon-trash"></span>
             </a>
-            <div class="key">{{searchParam.name}}:</div>
+            <div class="key" ng-click="enterEditMode($event, $index)">{{searchParam.name}}:</div>
             <div class="value">
-                <span ng-if="!searchParam.editMode" ng-click="enterEditMode($index)">{{searchParam.value}}</span>
+                <span ng-if="!searchParam.editMode" ng-click="enterEditMode($event, $index)">{{searchParam.value}}</span>
                 <input name="value"
                        type="text"
                        nit-auto-size-input
                        nit-set-focus="searchParam.editMode"
                        ng-keydown="keydown($event, $index)"
-                       ng-blur="leaveEditMode($index)"
+                       ng-blur="leaveEditMode($event, $index)"
                        ng-if="searchParam.editMode"
                        ng-change="searchParamValueChanged(searchParam)"
                        ng-model="searchParam.value"

src/angular-advanced-searchbox.js

@@ -72,15 +72,18 @@ angular.module('angular-advanced-searchbox', [])
                         updateModel('change', 'query', query);
                     };
 
-                    $scope.enterEditMode = function(index) {
+                    $scope.enterEditMode = function(e, index) {
+                        if(e !== undefined)
+                            e.stopPropagation();
+
                         if (index === undefined)
                             return;
 
                         var searchParam = $scope.searchParams[index];
                         searchParam.editMode = true;
                     };
 
-                    $scope.leaveEditMode = function(index) {
+                    $scope.leaveEditMode = function(e, index) {
                         if (index === undefined)
                             return;
 
@@ -141,25 +144,25 @@ angular.module('angular-advanced-searchbox', [])
 
                     $scope.editPrevious = function(currentIndex) {
                         if (currentIndex !== undefined)
-                            $scope.leaveEditMode(currentIndex);
+                            $scope.leaveEditMode(undefined, currentIndex);
 
                         //TODO: check if index == 0 -> what then?
                         if (currentIndex > 0) {
-                            $scope.enterEditMode(currentIndex - 1);
+                            $scope.enterEditMode(undefined, currentIndex - 1);
                         } else if ($scope.searchParams.length > 0) {
-                            $scope.enterEditMode($scope.searchParams.length - 1);
+                            $scope.enterEditMode(undefined, $scope.searchParams.length - 1);
                         }
                     };
 
                     $scope.editNext = function(currentIndex) {
                         if (currentIndex === undefined)
                             return;
 
-                        $scope.leaveEditMode(currentIndex);
+                        $scope.leaveEditMode(undefined, currentIndex);
 
                         //TODO: check if index == array length - 1 -> what then?
                         if (currentIndex < $scope.searchParams.length - 1) {
-                            $scope.enterEditMode(currentIndex + 1);
+                            $scope.enterEditMode(undefined, currentIndex + 1);
                         } else {
                             $scope.setSearchFocus = true;
                         }