ENHANCEMENT HTML titles in TreeDropdownField

HTML in tree nodes is already used to render page icons via SiteTree->TreeTitle.
In order to select the initial value correctly via HTML5 data attributes,
we need to encode any HTML values.

forms/TreeDropdownField.php

@@ -188,6 +188,7 @@ class TreeDropdownField extends FormField {
 			$properties,
 			array(
 				'Title' => $title,
+				'TitleURLEncoded' => rawurlencode($title),
 				'Metadata' => ($metadata) ? Convert::raw2att(Convert::raw2json($metadata)) : null
 			)
 		);

javascript/TreeDropdownField.js

@@ -38,8 +38,7 @@
 			
 				var linkTitle = strings.openLink;
 				if(linkTitle) this.find("treedropdownfield-toggle-panel-link a").attr('title', linkTitle);
-				
-				if(this.data('title')) this.setTitle(this.data('title'));
+				if(this.data('title')) this.setTitle(decodeURIComponent(this.data('title')));
 				
 				this.getPanel().hide();
 				this._super();
@@ -111,8 +110,8 @@
 			setTitle: function(title) {
 				if(!title) title = strings.fieldTitle;
 					
-				this.find('.treedropdownfield-title').text(title);
-				this.data('title', title); // separate view from storage (important for search cancellation)				
+				this.find('.treedropdownfield-title').html(title);
+				this.data('title', encodeURIComponent(title)); // separate view from storage (important for search cancellation)				
 			},
 			getTitle: function() {
 				return this.find('.treedropdownfield-title').text();

templates/forms/TreeDropdownField.ss

@@ -1,7 +1,7 @@
 <div id="TreeDropdownField_$ID"
      class="TreeDropdownField single<% if extraClass %> $extraClass<% end_if %><% if ShowSearch %> searchable<% end_if %>"
      data-url-tree="$Link(tree)"
-     data-title="$Title"
+     data-title="$TitleURLEncoded"
      <% if Description %>title="$Description"<% end_if %>
      <% if Metadata %>data-metadata="$Metadata"<% end_if %>>
 	<input id="$ID" type="hidden" name="$Name" value="$Value" />