diff --git a/public/app/features/panel/metrics_ds_selector.ts b/public/app/features/panel/metrics_ds_selector.ts
index d925977dd89..c541297a963 100644
--- a/public/app/features/panel/metrics_ds_selector.ts
+++ b/public/app/features/panel/metrics_ds_selector.ts
@@ -17,7 +17,7 @@ var template = `
       </label>
 
       <metric-segment segment="ctrl.dsSegment"
-                      get-options="ctrl.getOptions()"
+                      get-options="ctrl.getOptions(true)"
                       on-change="ctrl.datasourceChanged()"></metric-segment>
     </div>
 
@@ -28,15 +28,9 @@ var template = `
       </button>
 
       <div class="dropdown" ng-if="ctrl.current.meta.mixed">
-        <button class="btn btn-inverse dropdown-toggle gf-form-btn" data-toggle="dropdown">
-          Add Query&nbsp;<span class="fa fa-caret-down"></span>
-        </button>
-
-        <ul class="dropdown-menu" role="menu">
-          <li ng-repeat="datasource in ctrl.datasources" role="menuitem" ng-hide="datasource.meta.builtIn">
-            <a ng-click="ctrl.addDataQuery(datasource);">{{datasource.name}}</a>
-          </li>
-        </ul>
+        <metric-segment segment="ctrl.mixedDsSegment"
+                        get-options="ctrl.getOptions(false)"
+                        on-change="ctrl.mixedDatasourceChanged()"></metric-segment>
       </div>
     </div>
   </div>
@@ -46,6 +40,7 @@ var template = `
 
 export class MetricsDsSelectorCtrl {
   dsSegment: any;
+  mixedDsSegment: any;
   dsName: string;
   panelCtrl: any;
   datasources: any[];
@@ -68,10 +63,13 @@ export class MetricsDsSelectorCtrl {
     }
 
     this.dsSegment = uiSegmentSrv.newSegment({value: this.current.name, selectMode: true});
+    this.mixedDsSegment = uiSegmentSrv.newSegment({value: 'Add query', selectMode: true});
   }
 
-  getOptions() {
-    return Promise.resolve(this.datasources.map(value => {
+  getOptions(includeBuiltin) {
+    return Promise.resolve(this.datasources.filter(value => {
+      return includeBuiltin || !value.meta.builtIn;
+    }).map(value => {
       return this.uiSegmentSrv.newSegment(value.name);
     }));
   }
@@ -84,13 +82,18 @@ export class MetricsDsSelectorCtrl {
     }
   }
 
-  addDataQuery(datasource) {
+  mixedDatasourceChanged() {
     var target: any = {isNew: true};
-
-    if (datasource) {
-      target.datasource = datasource.name;
+    var ds = _.find(this.datasources, {name: this.mixedDsSegment.value});
+    if (ds) {
+      target.datasource = ds.name;
+      this.panelCtrl.panel.targets.push(target);
+      this.mixedDsSegment.value = '';
     }
+  }
 
+  addDataQuery() {
+    var target: any = {isNew: true};
     this.panelCtrl.panel.targets.push(target);
   }
 }