From 5ecc8a171f6503cde295087653769e8a682495d8 Mon Sep 17 00:00:00 2001
From: Daniel Lee <dan.limerick@gmail.com>
Date: Mon, 20 Mar 2017 22:51:55 +0100
Subject: [PATCH] template: fix validation for required selects

Since upgrading to Angular 1.6.1, selects with a default empty option
no longer show a popup with an error on submit. This fix adds an
empty option that is then removed with ng-if. Having the default
option set to null or undefined seems to be the cause of the bug.

The list of changes in 1.6 is here but could not find any obvious
cause for this bug:

https://docs.angularjs.org/guide/migration#migrating-from-1-5-to-1-6
---
 public/app/features/templating/partials/editor.html | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/public/app/features/templating/partials/editor.html b/public/app/features/templating/partials/editor.html
index 2d514060cb7..a0683debc5c 100644
--- a/public/app/features/templating/partials/editor.html
+++ b/public/app/features/templating/partials/editor.html
@@ -159,7 +159,9 @@
           <div class="gf-form max-width-21">
             <span class="gf-form-label width-7">Data source</span>
             <div class="gf-form-select-wrapper max-width-14">
-              <select class="gf-form-input" ng-model="current.datasource" ng-options="f.value as f.name for f in datasources" required></select>
+              <select class="gf-form-input" ng-model="current.datasource" ng-options="f.value as f.name for f in datasources" required>
+                <option value="" ng-if="false"></option>
+              </select>
             </div>
           </div>
           <div class="gf-form max-width-21">
@@ -230,7 +232,9 @@
         <div class="gf-form max-width-21">
           <span class="gf-form-label width-8">Data source</span>
           <div class="gf-form-select-wrapper max-width-14">
-            <select class="gf-form-input" ng-model="current.datasource" ng-options="f.value as f.name for f in datasources" required ng-change="validate()"></select>
+            <select class="gf-form-input" ng-model="current.datasource" ng-options="f.value as f.name for f in datasources" required ng-change="validate()">
+              <option value="" ng-if="false"></option>
+            </select>
           </div>
         </div>
       </div>