$(document).ready(function(){
	$('.j_input').focusin(function(){
		if ($(this).val() == $(this).attr('data-value')) {
			$(this).val('').css({color:'#333333'});
		};
	}).focusout(function(){
		if ($(this).val() == '') {
			$(this).val($(this).attr('data-value')).css({color:'#cccccc'});
		};
	});
	$('#branch_form').submit(function(){
		var _inputs = $('.j_city');
		if (_inputs.val() == _inputs.attr('data-value')) {
			_inputs.val('');
		};
	});
	$('.j_city').click(function(){
		var is_city = $('.j_city_select'),
			_html = '',
			_this_input = $(this);
		is_city.css({left:_this_input.position().left+'px',top:(_this_input.position().top+33)+'px'});
		if (is_city.length > 0 && is_city.is(':hidden')) {
			is_city.show().empty();
			/*_tab_tit = '<div class="tab_tit"><h3>省份</h3><h3>城市</h3><h3>区县</h3></div>';
			_tab_con = '<div class"tab_con"><ul></ul><ul></ul><ul></ul></div>';
			_tab_tit.appendto(is_city);
			_tab_con.appendto(is_city);*/
			var _tab_tit = $('<div class="tab_tit clearfix"></div>'),
				_tab_con = $('<div class="tab_con"></div>'),
				_tab_tit_p = $('<h4 class="province">省份</h4>'),
				_tab_tit_c = $('<h4 class="city">城市</h4>'),
				_tab_tit_a = $('<h4 class="area">区县</h4>'),
				_tab_con_p = $('<ul class="province clearfix"></ul>'),
				_tab_con_c = $('<ul class="city clearfix"></ul>'),
				_tab_con_a = $('<ul class="area clearfix"></ul>');
			_tab_tit.appendto(is_city);
			_tab_con.appendto(is_city);
			_tab_tit_p.appendto(_tab_tit);
			_tab_tit_c.appendto(_tab_tit);
			_tab_tit_a.appendto(_tab_tit);
			_tab_con_p.appendto(_tab_con);
			_tab_con_c.appendto(_tab_con);
			_tab_con_a.appendto(_tab_con);			
			$.ajax({
				type: 'post',
				url: "/form/get_sub_area",
				data: {
					pid: 1
				},
				datatype: "json",
				success: function(data) {
					if(data.length > 0){
						for (var i = 0; i < data.length; i++) {
							_html += '<li><a href="javascript:;" value="'+data[i]['id']+'">' + data[i]['name'] + '</a></li>'
						};
					}
					_tab_con_p.append(_html).show();
					_tab_tit_p.addclass('active');
					_tab_con_p.find('a').click(function(){
						_tab_con_p.find('a').removeclass('active');
						$(this).addclass('active');
						_this_input.val($(this).text()).css({color:'#333333'});;
						var _p_id = $(this).attr('value');
						$.ajax({
							type: 'post',
							url: "/form/get_sub_area",
							data: {
								pid: _p_id
							},
							datatype: "json",
							success: function(data) {
								_html = '';
								if(data.length > 0){
									for (var i = 0; i < data.length; i++) {
										_html += '<li><a href="javascript:;" value="'+data[i]['id']+'">' + data[i]['name'] + '</a></li>'
									};
								}
								_tab_con_c.empty();
								_tab_con_c.append(_html).show().siblings().hide();
								_tab_tit_c.addclass('active').siblings().removeclass('active');
								_tab_con_c.find('a').click(function(){
									_tab_con_c.find('a').removeclass('active');
									$(this).addclass('active');
									_this_input.val(_tab_con_p.find('a.active').text()+'-'+$(this).text());
									var _c_id = $(this).attr('value');
									$.ajax({
										type: 'post',
										url: "/form/get_sub_area",
										data: {
											pid: _c_id
										},
										datatype: "json",
										success: function(data) {
											_html = '';
											if(data.length > 0){
												for (var i = 0; i < data.length; i++) {
													_html += '<li><a href="javascript:;" value="'+data[i]['id']+'">' + data[i]['name'] + '</a></li>'
												};
											}
											_tab_con_a.empty();
											_tab_con_a.append(_html).show().siblings().hide();
											_tab_tit_a.addclass('active').siblings().removeclass('active');
											_tab_con_a.find('a').click(function(){
												_this_input.val(_tab_con_p.find('a.active').text()+'-'+_tab_con_c.find('a.active').text()+'-'+$(this).text());
												is_city.hide();
											});
										}
									});
								});
							}
						});
					});
				}
			});
			_tab_tit.find('h4').click(function(){				
				var _indexx = $(this).index();
				if(_tab_con.find('ul').eq(_indexx).find('li').length > 0){
					_tab_con.find('ul').eq(_indexx).show().siblings().hide();
					$(this).addclass('active').siblings().removeclass('active');
				}				
			});
		}else if(is_city.length > 0 && is_city.is(':visible')){
			is_city.hide();
		}
	});
});