the fix of 'templateResult' issue, & example change

Author: clivezhg

example/1.png

@@ -57,9 +57,19 @@ <h3>Example 3</h3>
 		ind.inc = [{text:"north", inc:[]}];
 		var inc = ind.inc[0].inc;
 		for (var i = 1; i <= 1500; i++) {
-			inc.push({ id: 1000000+i, text: "india city "+i });
+			inc.push({ id: 10000+i, text: "the city "+i });
 		}
-		$("#sel_3").select2ToTree({treeData: {dataArr: mydata}, maximumSelectionLength: 3});
+		$("#sel_3").select2ToTree({treeData: {dataArr: mydata}, maximumSelectionLength: 3,
+				templateResult: formatState, templateSelection: formatState});
+
+		function formatState (state) {
+			if (state.id >= 1 && state.id <= 3) {
+				return $(
+					'<span><img src="./' + state.element.value.toLowerCase() + '.png" class="img-flag" /> ' + state.text + '</span>'
+				);
+			}
+			else return state.text;
+		};
 	</script>
 </body>
 </html>

example/2.png

@@ -1,5 +1,5 @@
 /*!
- * Select2-to-Tree CSS 1.0.0
+ * Select2-to-Tree CSS 1.1.0
  * https://github.com/clivezhg/select2-to-tree
  */
  .s2-to-tree * {

example/3.png

@@ -1,5 +1,5 @@
 /*!
- * Select2-to-Tree 1.0.0
+ * Select2-to-Tree 1.1.0
  * https://github.com/clivezhg/select2-to-tree
  */
 (function ($) {
@@ -10,8 +10,13 @@
 			buildSelect(opts.treeData, this);
 		}
 
+		opts.tr_old = opts.templateResult;
 		opts.templateResult = function (data, container) {
-			var $iteme = $("<span class='item-label'></span>").text(data.text);
+			var label = data.text;
+			if (typeof opts.tr_old === "function") {
+				label = opts.tr_old(data, container);
+			}
+			var $iteme = $("<span class='item-label'></span>").append(label);
 			if (data.element) {
 				var ele = data.element;
 				container.setAttribute("data-val", ele.value);