$(document).ready(function() {
	
	$(document).delegate('.treeexpand', 'click', function () {
		$(this).attr('src', '/img/tree/dhxmenu_loader.gif');
		var isLoaded = $(this).attr('data-loaded');
		if (isLoaded == "1") {
			$(this).siblings('ul').css('display', 'list-item');
		} else {
			var geographyId = $(this).attr('data-geographyid');
			loadTree(geographyId, $(this).parent());
			$(this).attr('data-loaded', '1');
		}
		$(this).removeClass('treeexpand');
		$(this).addClass('treecollapse');
		$(this).attr('src', '/img/tree/minus.gif');
	});
	
	$(document).delegate('.treecollapse', 'click', function () {
		$(this).siblings('ul').css('display', 'none');
		$(this).addClass('treeexpand');
		$(this).removeClass('treecollapse');
		$(this).attr('src', '/img/tree/plus.gif');
	});
	
	function getTree(el)
	{
		var id = $(el).attr('data-widgetid');
		var input = $('#' + id);
		var value = jQuery.parseJSON($(input).val());		

		return value.tree;
	}
	
	function loadTree(geographyId, liParent)
	{
		var widgetId = $(liParent).parent().attr('data-widgetid');
		url = '/api/geography/children/' + geographyId;
		$.ajax({
			url: url,
			success: function (data) {
				var ul ='<ul class="treepicker" data-widgetid="' + widgetId + '">';
				for (i=0; i<data.length; i++) {
					var name = data[i].geography;
					var childId = data[i].geographyid;
					var hasChildren = data[i].haschildren;
					
					var expandTag = '';
					
					var attrs = 'data-widgetid="' + widgetId + '" style="cursor:pointer" data-geographyid="' + childId + '" ';
					
					if (hasChildren == "1") {
						expandTag = '<img ' + attrs + ' class="treeexpand" src="/img/tree/plus.gif">';
					} else {
						expandTag = '<img ' + attrs + ' class="treecollapse" src="/img/tree/blank.gif">';
					}
					
					attrs = 
			            'data-haschildren="' + hasChildren + '" ' +
			            'data-loaded="0" ' +
			            'data-state="2" ' +
			            'data-widgetid="' + widgetId + '" ' +
			            'style="cursor:pointer" ' +
			            'class="treeitemselect" ' +
			            'data-geographyid="' + childId + '"';
			            
					var checkTag = '<img ' + attrs + ' src="/img/tree/iconUncheckAll.gif">&nbsp;';
					ul += 
						 '<li>' +
						 expandTag +
						 checkTag +
						 name +
						 '</li>';
				}
				ul += '</ul>';
				$(liParent).append(ul);
			}
		});
	}
});


@@ -267,16 +267,63 @@
 item');%0A
+%09%09%09$(this).attr('src', '/img/tree/minus.gif');%0A
 %09%09%7D else
@@ -325,16 +325,16 @@
  else %7B%0A
-
 %09%09%09var g
@@ -412,25 +412,16 @@
  $(this)
-.parent()
 );%0A%09%09%09$(
@@ -485,32 +485,32 @@
 ('treeexpand');%0A
+
 %09%09$(this).addCla
@@ -533,54 +533,8 @@
 ');%0A
-%09%09$(this).attr('src', '/img/tree/minus.gif');%0A
 %09%7D);
@@ -977,20 +977,66 @@
 Id, 
-liParent)%0A%09%7B
+imageClicked)%0A%09%7B%0A%09%09liParent = $(imageClicked).parent();%0A%09%09
 %0A%09%09v
@@ -2394,16 +2394,72 @@
 nd(ul);%0A
+%09%09%09%09$(imageClicked).attr('src', '/img/tree/minus.gif');%0A
 %09%09%09%7D%0A%09%09%7D

Add spinner widget