未套程序的源代码:

链接:http://pan.baidu.com/s/1nuHbxhf 密码:4aw2

已套程序的源代码:

css样式:

/*发布邮件  选择领导弹窗*/
.xuandao{
display: none;
}
.xuandao_1{
position: fixed;
z-index:;
top:;
left:;
width: 100%;
height: 100%;
background:rgba(0,0,0,0.2) none repeat scroll !important; /*实现FF背景透明,文字不透明*/
background:#000; filter:Alpha(opacity=20);/*实现IE背景透明*/
}
.xuandao_2{
width: 600px;
top: 15%;
left: 50%;
margin-left: -10%;
background-color: #fff;
position: absolute;
z-index:; }
.content_wrap{
height: 400px;
overflow: auto;
}
.xuandao_3{
text-align: center;
padding: 5px;
}
.xuandao_3 a{
padding: 5px 18px;
background-color: #5cb85c;
border: 1px solid #e5e5e5;
color: #fff;
}
.xuandao_3 .xuandao_3_1{
background-color: #ffffff;
color: #000;
}
.xuandao_3 a:hover {
background: #3D43FF;
}

HTML模板:

<div class="xiexin_2 xuanzedao">

                </div>
<div class="xiexin_2">
<a href="javascript:;" class="xiexin_bot">确定发布</a>
<a href="javascript:;" class="fanhui">返回</a>
<a href="javascript:;" class="xuanlingdao">选择领导</a>
</div> //弹窗:
<div class="xuandao">
<div class="xuandao_1"></div>
<div class="xuandao_2">
<div class="content_wrap">
<div class="zTreeDemoBackground left">
<ul id="treeDemo" class="ztree">
</ul>
</div>
</div>
<div class="xuandao_3">
<a href="javascript:;" class="queding">确定</a>
<a href="javascript:;" class="xuandao_3_1">取消</a>
</div>
</div>
</div>
<input type="hidden" id="tempVal"> <script>
$('.queding').click(function(){
var id = $('#tempVal').val();
var $val = $('#tempVal').val();
if($val == ''){
layer.msg('您没有选择给指定领导,请选择,也可多选', 1, 0);
}
$.get("{:U('Index/xuanren')}",{id:id},function(v){
$('.xuandao').hide();
var html = '';
var data = v.list;
html += '<div class="xiexin_2_1">已选择领导:';
for(var i=0;i<data.length;i++){
html+= '<b>'+data[i]['name']+'</b><input type="hidden" name="ren[]" value="'+data[i]['id']+'">';
}
html += '</div>';
$('.xuanzedao').html(html);
})
}) //var zNodes=[];
$('.xuanlingdao').click(function(){
// $('.xuandao').show();
var url="{:U('Index/ajax_ren')}";
var $val = {$uid};
$.get(url,{uid:$val},function(v){
$('.xuandao').show();
var tArr = [];
$.each(v.list,function(index,ele){
var obj = { id:ele.id, pId:ele.pId, name:ele.name, open:true, dataVal:ele.id};
tArr.push(obj);
})
var zNodes = tArr;
var setting = {
check: {
enable: true,
chkStyle : "checkbox",
chkboxType: { "Y": "s", "N": "s" },
nocheckInherit: false
},
data: {
simpleData: {
enable: true
}
},
callback:{
onCheck:onCheck
}
};
$.fn.zTree.init($("#treeDemo"), setting, zNodes);
})
}) //获取选择的值
function onCheck(e,treeId,treeNode){
var treeObj=$.fn.zTree.getZTreeObj("treeDemo"),
nodes=treeObj.getCheckedNodes(true),
v="";
for(var i=0;i<nodes.length;i++){
if(nodes[i].pId != '0' && nodes[i].pId != null){
v+=nodes[i].dataVal + ",";
} }
console.log(v);
$('#tempVal').val(v);
} //点击取消隐藏弹窗
$('.xuandao_3_1').click(function(){
$('.xuandao').hide();
})
</script>

thinkphp控制器:

前台需要的数据类型,

var zNodes =[
{ id:, pId:, name:"随意勾选 1", open:true, dataVal:''},
{ id:, pId:, name:"随意勾选 1-1", open:true, dataVal:''},
{ id:, pId:, name:"checkbox 1-1-1", dataVal:''},
{ id:, pId:, name:"随意勾选 1-1-2", dataVal:''},
{ id:, pId:, name:"checkbox 1-2", open:true},
{ id:, pId:, name:"无 checkbox 1-2-1"},
{ id:, pId:, name:"无 checkbox 1-2-2"},
{ id:, pId:, name:"随意勾选 2", open:true},
{ id:, pId:, name:"随意勾选 2-1"},
{ id:, pId:, name:"随意勾选 2-2", open:true},
{ id:, pId:, name:"随意勾选 2-2-1", },
{ id:, pId:, name:"随意勾选 2-2-2"},
{ id:, pId:, name:"随意勾选 2-3"}
];
//点击【选择领导】按钮,找出所有分分组,按照树状图显示出来,并且排除当前登录的人  我传过来了当前登录者的id
public function ajax_ren(){
$data = array();
$arr = array();
$arruser = array();
$user_a = M('linzi_user_a')->select();//一级分类
foreach($user_a as $k=>$r){
$arr[$k]['id'] = $r['a_id'];
$arr[$k]['pId'] = 0;
$arr[$k]['name'] = $r['title'];
}
$user_abc = M('linzi_user_abc')->select();//无限极分类
foreach($user_abc as $kk=>$v){
$data[$kk]['id'] = $v['id'];
if($v['sji_id'] != null){//看这个判断
$shangji = $v['sji_id'];
}else{
$shangji = $v['a_id'];
}
$data[$kk]['pId'] = $shangji;
$data[$kk]['name'] = $v['title'];
}
$uid['id'] = array('neq',I('uid'));
$user = M('linzi_user')->where($uid)->select();//无限极分类下的人员
foreach($user as $key=>$vv){
$arruser[$key]['id'] = 'a'.$vv['id'];
$arruser[$key]['pId'] = $vv['abc_id'];
$arruser[$key]['name'] = $vv['name'];
}
foreach($arr as $v){
$data[] = $v;
}
foreach($arruser as $v){
$data[] = $v;
}
// dump($arruser);die();
// dump($data);die();
$info['status']=1;
$info['list']=$data;
$this->ajaxReturn($info);
} //点击确定按钮选择的谁
public function xuanren(){
// dump($_GET);die();
$id = explode(',',I('id'));
$ids=array();
foreach($id as $k=>$v){
if(strpos($v,'a')!==false){
$ids[$k]=$v;
}
}
$user_id = array();
foreach($ids as $kk=>$vv){
$user_id[$kk] = substr($vv,1);
}
$data['id'] = array('in',$user_id);
$name = array();
$user = M('linzi_user')->where($data)->select();
foreach($user as $k=>$v){
$abc = M('linzi_user_abc')->where(array('id'=>$v['abc_id']))->getField('title');
$name[$k]['id'] = $v['id'];
$name[$k]['name'] = $abc .'——'. $v['name'];
}
$show['status'] = 1;
$show['list'] = $user;
$this->ajaxReturn($show);
}

ztree 文件夹类型的 树状图的更多相关文章

  1. ArcGIS教程:树状图

    摘要 构造可显示特征文件里连续合并类之间的属性距离的树示意图(树状图). 使用方法 · 输入特征文件必须採用预定的特征文件格式. 特征文件可使用 Iso 聚类或创建特征工具来创建.该文件必须至少包括两 ...

  2. 用D3.js画树状图

    做项目遇到一个需求,将具有层级关系的词语用树状图的形式展示它们之间的关系,像这样: 或者是这样: 上面的图片只是样例,跟我下面的代码里面用的数据不同 网上有很多这种数据可视化展示的js控件,我这里选择 ...

  3. ztree 树状图——例

    效果: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta ...

  4. 树状图展示终端目录内容-tree

    以树状图列出目录的内容,让你一目了然 执行 tree 指令,它会列出指定目录下的所有文件,包括子目录里的文件. 安装 我们通过包管理工具可以方便的安装它 mac - brew install tree ...

  5. bzoj 4871: [Shoi2017]摧毁“树状图”

    4871: [Shoi2017]摧毁“树状图” Time Limit: 25 Sec  Memory Limit: 512 MBSubmit: 53  Solved: 9[Submit][Status ...

  6. Highcharts 树状图(Treemap)

    Highcharts 树状图(Treemap) 树状图 series 配置 设置 series 的 type 属性为 treemap ,series.type 描述了数据列类型.默认值为 " ...

  7. D3.js系列——布局:弦图和集群图/树状图

    一.弦图 1.弦图是什么 弦图(Chord),主要用于表示两个节点之间的联系的图表.两点之间的连线,表示谁和谁具有联系. 2.数据 初始数据为: var city_name = [ "北京& ...

  8. python爬取股票最新数据并用excel绘制树状图

    大家好,最近大A的白马股们简直 跌妈不认,作为重仓了抱团白马股基金的养鸡少年,每日那是一个以泪洗面啊. 不过从金融界最近一个交易日的大盘云图来看,其实很多中小股还是红色滴,绿的都是白马股们. 以下截图 ...

  9. 使用ECharts绘制网址径向树状图

    an.rustfisher.com有很多内容,很多页面.如果用一个树状图把所有页面展示出来会是什么效果? 第一时间想到了ECharts. 最后效果: https://an.rustfisher.com ...

随机推荐

  1. JmsTemplate sendAndReceive 设置超时

    通过调用sendAndReceive方法,实现发送消息之后可以同步接收返回信息. Message replyMsg = this.jmsQueueTemplate.sendAndReceive(new ...

  2. Spring MVC实现上传文件报错解决方案

    报错代码: org.springframework.beans.BeanInstantiationException: Could not instantiate bean class [org.sp ...

  3. CAP Twelve Years Later: How the "Rules" Have Changed

    The CAP theorem asserts that any net­worked shared-data system can have only two of three desirable ...

  4. s3cmd用法总结

    概述 S3是亚马逊AWS提供的简单存储服务(可以理解为有公网域名的大容量高可用存储) S3配合CloudFront服务可作为CDN使用,它提供多节点全球发布 安装 方法一: yum install s ...

  5. C++11 并发指南四(<future> 详解三 std::future & std::shared_future)

    上一讲<C++11 并发指南四(<future> 详解二 std::packaged_task 介绍)>主要介绍了 <future> 头文件中的 std::pack ...

  6. Nginx 功能模块

    一.Nginx 核心功能模块 Nginx 核心功能模块负责 Nginx 的全局应用,主要对应主配置文件的 Main 区块和 Events 区块,这里有很多 Nginx 必须的全局参数配置. Nginx ...

  7. SNF开发平台WinForm-平板拍照及扫描二维码功能

    在我们做项目的时候,经常会有移动平板处理检验,审核等,方便移动办公.这时就需要在现场拍照上传问题,把当场问题进行上传,也有已经拍完照的图片或加工过的图片进行上传.还有在车间现场一体机,工控机 这种产物 ...

  8. U盘安装CentOS 7卡住在 mounting configuration file system

    使用UltraISO PE 9.6.0.3000刻录CentOS 7.2到U盘之后,在PC机上安装,一直卡住在此界面 网上各路大神各显神通,提供了各种各样的办法,后来根据一位网友的说法,顺利安装完成 ...

  9. Atitit 视图参数解决方案 oracle版和mysql版本 attilax总结.docx

    Atitit 视图参数解决方案 oracle版和mysql版本 attilax总结.docx 1.1. Package机制1 1.2. 全局变量机制1 1.3. 临时表模式,oracle mysql都 ...

  10. linux每日命令(31):tar命令

    tar命令可以为linux的文件和目录创建档案.利用tar,可以为某一特定文件创建档案(备份文件),也可以在档案中改变文件,或者向档案中加入新的文件.tar最初被用来在磁带上创建档案,现在,用户可以在 ...