sr-iHealthApp/html/js/select-committee.js

//选择居委会   jwcode为基卫
//调用语句
//<input id="committee" data-jwcode="" data-code="" value="" type="text" readonly="readonly" placeholder="请选择您的所属居委会"/>

function selectCommittee(){
	var content = '<div id="sheet" class="mui-popover mui-popover-bottom mui-popover-action">\
        <div id="sheet_committee" style="height:314px;background-color: #fff;position: relative;">\
            <div class="md-title">所属社区</div><div class="md-bttn-true">确定</div><div class="md-bttn-false">取消</div>\
            <ul class="md-tag" id="showTitle"></ul>\
            <div id="district" class="mui-scroll-wrapper md-wrapper">\
                <div class="mui-scroll" style="width:100%!important"><ul class="mui-table-view"></ul></div>\
            </div>\
            <div id="town" class="mui-scroll-wrapper md-wrapper c-hide">\
                <div class="mui-scroll" style="width:100%!important"><ul class="mui-table-view"></ul></div>\
            </div>\
            <div id="village" class="mui-scroll-wrapper md-wrapper c-hide">\
            	<div class="mui-scroll" style="width:100%!important"><ul class="mui-table-view"></ul></div>\
            </div>\
        </div> \
    </div>';
    $('body').append(content)
    nextWork()
    
    function nextWork(){
    	var $tit = $('#showTitle'),
	    	$sel0 = '<li class="active">请选择</li>',
	    	$sel1='',
	    	$sel2='',
	    	$list = $('.md-wrapper'),
	    	$true = $('.md-bttn-true'),
	    	$false = $('.md-bttn-false');
	    var countryCode,
	    	jwcountryCode,
	    	countryName;
	    $('#selectType').click(function(){
	    	mui('#sheet').popover('show');
	    	if(!$tit.text().trim()){
	    		$tit.html($sel0);
	    		var data={};
				sendPost('doctor/sign/getTownList', data, queryAddrFailed ,function(res){
					if(res.status == 200){
						var list="";
						$.map(res.data,function(item,index){
							list +='<li data-code='+item.code+'>'+item.name+'</li>';
						})
						$('#district').find('ul').empty().append(list);
					}else{
						queryAddrFailed(res);
					}
				})
	    	}
	    	$true.hide();
	    	$false.show();
	    })
	    
	    //请求数据
	    function queryAddrFailed(res) {
			if (res && res.msg) {
				mui.toast(res.msg);
			} else {
				mui.toast('数据加载失败');
			}
		}
	    
	    mui('#village').scroll({
	    	bounce: false //是否启用回弹
	    }).scrollTo(0,0,100);
	    mui('#district').scroll({
	    	bounce: false //是否启用回弹
	    })
	    mui('#town').scroll({
	    	bounce: false //是否启用回弹
	    }).scrollTo(0,0,100);
	    
	    //区
	    $('#district').on('click','li',function(){
	    	var $this = $(this);
	    	changeList($('#town'),$this); 
	    	$true.hide();
	    	$false.show();
	    	$sel1 = '<li>'+$this.text()+'</li>';
	    	$tit.html($sel1+$sel0);
	    	var data={
	    		town:$this.data('code')
	    	};
			sendPost('doctor/sign/getStreetListByTown', data, queryAddrFailed ,function(res){
				if(res.status == 200){
					var list="";
					$.map(res.data,function(item,index){
						list +='<li data-code='+item.code+'>'+item.name+'</li>';
					})
					$('#town').find('ul').empty().append(list);
				}else{
					queryAddrFailed(res);
				}
			})
	    })
	    //街道
	    $('#town').on('click','li',function(){
	    	var $this = $(this);
	    	changeList($('#village'),$this);
	    	$true.hide();
	    	$false.show();
	    	$sel2 = '<li>'+$this.text()+'</li>';
	    	$tit.html($sel1+$sel2+$sel0);
	    	var data={
	    		street:$this.data('code')
	    	};
			sendPost('doctor/sign/getCountryListByStreet', data,queryAddrFailed ,function(res){
				if(res.status == 200){
					var list="";
					if(res.data.length>0){
						$.map(res.data,function(item,index){
							list +='<li data-jwcode="'+item.jwCode+'" data-code="'+item.code+'">'+item.name+'</li>';
						})
					}else{
						
					}
					$('#village').find('ul').empty().append(list);
				}else{
					queryAddrFailed(res);
				}
			})
	    })
	    //居委会
	    $('#village').on('click','li',function(){
	    	var $this = $(this);
	    	changeList($('#village'),$this); 
	    	jwcountryCode = $this.attr('data-jwcode');
	    	countryCode = $this.attr('data-code');
	    	countryName = $this.text();
	    	$true.show();
	    	$false.hide();
	    })
	    
	    $tit.on('click','li',function(){
	    	var $this = $(this);
	    	if(! $this.hasClass('active')){
	    		$this.addClass('active').siblings().removeClass('active');
	    		$list.hide();
	    		$list.eq($this.index()).show();
	    	}
	    })
	    //取消
	    $false.click(function(){
	    	mui('#sheet').popover('hide');
	    })
	    //确定
	    $true.click(function(){
	    	mui('#sheet').popover('hide');
			$('#committee').val(countryName);
			$('#committee').attr('data-jwcode',jwcountryCode);
			$('#committee').attr('data-code',countryCode);
	    })
	    
	    function changeList($next,$li){
	    	$li.addClass('active').siblings().removeClass('active');
	    	$list.hide();
	    	$next.show();	
	    }
    }
}