More work on tags in variable dropdown, now the actual tag values query is hooked up and works, #2080

public/app/directives/variableValueSelect.js

@@ -13,7 +13,7 @@ function (angular, app, _) {
       var vm = this;
 
       vm.show = function() {
-        vm.oldCurrentText = vm.variable.current.text;
+        vm.oldLinkText = vm.variable.current.text;
         vm.highlightIndex = -1;
 
         var currentValues = vm.variable.current.value;
@@ -44,6 +44,9 @@ function (angular, app, _) {
 
       vm.updateLinkText = function() {
         vm.linkText = vm.variable.current.text;
+        if (vm.oldLinkText && vm.oldLinkText !== vm.linkText) {
+          vm.onUpdated();
+        }
       };
 
       vm.clearSelections = function() {

public/app/features/dashboard/submenuCtrl.js

@@ -18,9 +18,7 @@ function (angular, _) {
       $scope.panel = $scope.pulldown;
       $scope.row = $scope.pulldown;
       $scope.annotations = $scope.dashboard.templating.list;
-      $scope.variables = _.map($scope.dashboard.templating.list, function(variable) {
-        return variable;
-      });
+      $scope.variables = $scope.dashboard.templating.list;
     };
 
     $scope.disableAnnotation = function (annotation) {
@@ -28,8 +26,8 @@ function (angular, _) {
       $rootScope.$broadcast('refresh');
     };
 
-    $scope.getValuesForTag = function() {
-      return $q.when(['backend_01', 'backend_02']);
+    $scope.getValuesForTag = function(variable, tagKey) {
+      return templateValuesSrv.getValuesForTag(variable, tagKey);
     };
 
     $scope.variableUpdated = function(variable) {

public/app/features/templating/partials/editor.html

@@ -228,25 +228,25 @@
 
 			<div class="editor-row" ng-if="current.type === 'query'">
 				<div class="tight-form-section">
-					<h5>value groups/tags</h5>
-					<div class="tight-form" ng-if="current.usetags">
+					<h5>Value groups/tags</h5>
+					<div class="tight-form" ng-if="current.useTags">
 						<ul class="tight-form-list">
-							<li class="tight-form-item" style="width: 115px">
-								tags query
+							<li class="tight-form-item" style="width: 135px">
+								Tags query
 							</li>
 							<li>
-								<input type="text" style="width: 588px" class="input-xxlarge tight-form-input last" ng-model='current.tagsquery' placeholder="metric name or tags query" ng-model-onblur ng-change="runquery()"></input>
+								<input type="text" style="width: 588px" class="input-xxlarge tight-form-input last" ng-model='current.tagsQuery' placeholder="metric name or tags query" ng-model-onblur></input>
 							</li>
 						</ul>
 						<div class="clearfix"></div>
 					</div>
-					<div class="tight-form" ng-if="current.usetags">
+					<div class="tight-form" ng-if="current.useTags">
 						<ul class="tight-form-list">
-							<li class="tight-form-item" style="width: 115px;">
-								tags values query
+							<li class="tight-form-item" style="width: 135px;">
+								Tag values query
 							</li>
 							<li>
-								<input type="text" style="width: 588px" class="input tight-form-input last" ng-model='current.tagvaluesquery' placeholder="apps.$__tag.*" ng-model-onblur ng-change="runquery()"></input>
+								<input type="text" style="width: 588px" class="input tight-form-input last" ng-model='current.tagValuesQuery' placeholder="apps.$__tag.*" ng-model-onblur></input>
 							</li>
 						</ul>
 						<div class="clearfix"></div>
@@ -254,7 +254,7 @@
 					<div class="tight-form">
 						<ul class="tight-form-list">
 							<li class="tight-form-item last">
-								<editor-checkbox text="enable" model="current.usetags" change="runquery()"></editor-checkbox>
+								<editor-checkbox text="Enable" model="current.useTags" change="runQuery()"></editor-checkbox>
 							</li>
 						</ul>
 						<div class="clearfix"></div>

public/app/features/templating/templateValuesSrv.js

@@ -154,6 +154,17 @@ function (angular, _, kbn) {
       });
     };
 
+    this.getValuesForTag = function(variable, tagKey) {
+      return datasourceSrv.get(variable.datasource).then(function(datasource) {
+        var query = variable.tagValuesQuery.replace('$tag', tagKey);
+        return datasource.metricFindQuery(query).then(function (results) {
+          return _.map(results, function(value) {
+            return value.text;
+          });
+        });
+      });
+    };
+
     this.metricNamesToVariableValues = function(variable, metricNames) {
       var regex, options, i, matches;
       options = {}; // use object hash to remove duplicates

public/app/partials/submenu.html

@@ -6,7 +6,7 @@
 				<span class="template-variable tight-form-item" ng-show="!variable.hideLabel" style="padding-right: 5px">
 					{{variable.label || variable.name}}:
 				</span>
-				<variable-value-select variable="variable" on-updated="variableUpdated(variable)" get-values-for-tag="getValuesForTag(tagKey)"></variable-value-select>
+				<variable-value-select variable="variable" on-updated="variableUpdated(variable)" get-values-for-tag="getValuesForTag(variable, tagKey)"></variable-value-select>
 			</li>
 		</ul>