From ac42f335c2d3b54596510122cbe3e970aefd03ba Mon Sep 17 00:00:00 2001
From: Sebastiaan Janssen <sebastiaan@umbraco.com>
Date: Mon, 6 Nov 2017 12:33:12 +0100
Subject: [PATCH] Fix U4-4889 checkbox in template

---
 .../overlays/insertfield/insertfield.html     | 23 +++++++++++--------
 1 file changed, 14 insertions(+), 9 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/insertfield/insertfield.html b/src/Umbraco.Web.UI.Client/src/views/common/overlays/insertfield/insertfield.html
index ce522ec910..3218b44dd8 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/insertfield/insertfield.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/insertfield/insertfield.html
@@ -31,7 +31,7 @@
                 <div class="umb-el-wrap">
                     <label class="control-label" for="altField"><localize key="templateEditor_fallbackField">Fallback field</localize></label>
                     <div class="controls">
-                        <select ng-model="vm.altField" >
+                        <select ng-model="vm.altField" id="altField">
                             <optgroup localize="label" label="@templateEditor_customFields">
                                 <option ng-repeat="(key, value) in vm.properties" value="{{value}}">{{value}}</option>
                             </optgroup>
@@ -43,6 +43,7 @@
                 </div>
             </div>
         </div>
+        </div>
 
         <!-- Default value -->
         <div>
@@ -55,7 +56,7 @@
                 <div class="umb-el-wrap">
                     <label class="control-label" for="altText"><localize key="templateEditor_defaultValue">Default value</localize></label>
                     <div class="controls">
-                        <input type="text" name="altText" ng-model="vm.altText" umb-auto-focus>
+                        <input type="text" id="altText" name="altText" ng-model="vm.altText" umb-auto-focus>
                     </div>
                 </div>
             </div>
@@ -65,11 +66,13 @@
         <div class="control-group umb-control-group">
             <div class="umb-el-wrap">
                 <div class="controls">
-                    <label class="control-label" for="recursive">
+                    <label class="control-label" >
                         <localize key="templateEditor_recursive">Recursive</localize>
                     </label>
-                    <input type="checkbox" name="recursive" ng-model="vm.recursive">
-                    <localize key="templateEditor_recursiveDescr">Yes, make it recursive</localize>
+                    <label for="recursive"> 
+                        <input id="recursive" type="checkbox" name="recursive" ng-model="vm.recursive">
+                        <localize key="templateEditor_recursiveDescr">Yes, make it recursive</localize>
+                    </label>
                 </div>
             </div>
         </div>
@@ -134,7 +137,7 @@
                     <small><localize key="templateEditor_insertedBefore">Will be inserted before the field value</localize></small>
                 </label>
                 <div class="controls">
-                    <input type="text" name="insertBefore" class="-full-width-input" ng-model="vm.insertBefore">
+                    <input type="text" id="insertBefore" name="insertBefore" class="-full-width-input" ng-model="vm.insertBefore">
                 </div>
             </div>
         </div>
@@ -147,7 +150,7 @@
                     <small><localize key="templateEditor_insertedAfter">Will be inserted after the field value</localize></small>
                 </label>
                 <div class="controls">
-                    <input type="text" name="insertAfter" class="-full-width-input" ng-model="vm.insertAfter">
+                    <input type="text" id="insertAfter" name="insertAfter" class="-full-width-input" ng-model="vm.insertAfter">
                 </div>
             </div>
         </div>
@@ -162,8 +165,10 @@
                             <small><localize key="templateEditor_convertLineBreaksHelp">Replaces line breaks with break html tag</localize></small>
                         </label>
                     </div>
-                    <input type="checkbox" name="linebreaks" ng-model="vm.convertLinebreaks">
-                    <localize key="templateEditor_convertLineBreaksDescription">Yes, convert line breaks</localize>
+                    <label for="linebreaks">
+                      <input type="checkbox" id="linebreaks" name="linebreaks" ng-model="vm.convertLinebreaks">
+                      <localize key="templateEditor_convertLineBreaksDescription">Yes, convert line breaks</localize>
+                    </label>
                 </div>
             </div>
         </div>