文档章节

彻底抛弃PeopleEditor,SharePoint中利用Jquery Chosen创建新的人员选择器

 木宛城主
发布于 2015/03/02 19:39
字数 1168
阅读 21
收藏 0
点赞 0
评论 0

基于SharePoint平台开发时,人员选择器使用频率是非常高的,但是原生的人员选择器使用太麻烦,而且非常笨拙,非常不友好,特别是对呆在政府部门的老爷们,要让他们手动输入人员,简直就是痴心妄想。总之一句话,越简单越好。

  为了让客户满意,必须要对人员选择器进行改造,原生的PeopleEditor彻底抛弃。只能另辟蹊径,寻找适合的JQuery插件,创建新的人员选择器,分析了一下需求,可以归纳新的人员选择器必须支持如下情况:

  • 支持人员的多选,比如像会议、通知需要对多人进行发送,当然也要支持删除。
  • 对于单选的人员选择器,可以删除选中的人员。
  • 不管单选还是多选,支持Jquey AutoComplete那样索引功能。

找来找去,发现Jquery Chosen功能十分强大,完全满足我的需求,更多的功能参照Chosen官网:

http://harvesthq.github.io/chosen/

利用Jquery Chosen进行改造

  • 多选的人员选择器

支持多选,点击X即可取消选中,当然还支持索引,如下所示:

  • 配置也是十分简单,首先你的有一个Select,譬如:
<asp:DropDownList runat="server" ClientIDMode="Static" ID="ddlPeopleChosen" data-placeholder="选择与会者..." class="chzn-select" multiple style="width:397px;" ></asp:DropDownList>

注意下:data-placeholder意为着未选人员时的默认文本,multiple意味着支持多选。

接下来,需要对其添加数据源,注意,对于单人员选择器,Chosen作者说如果要显示默认的文本提示,需要加入一个空的Option到Select中(第一个)。

注意:我的人员不是从AD中取出,而是我们有一个存放人员的List(人事档案),为了确保该List的人员都可以登陆OA,特意和Web.AllUser中进行比较,当然也可以不必要,这样做保险点。

public static void GetFromCache(SPWeb _currentWeb)
        {
            #region 从缓存中读
            if (System.Web.HttpContext.Current.Cache["peopleList"] == null)
            {
                //People 集合:将SharePoint中的User作为数据源集合加入DropDownList中
                List<People> peopleList = new List<People>();
                //Note: on single selects, the first element is assumed to be selected by the browser. 
                //To take advantage of the default text support, 
                //you will need to include a blank option as the first element of your select list.
                peopleList.Add(new People());
                People p = null;
                SPList employeeList = _currentWeb.Site.AllWebs["rsgl"].Lists["人事档案"];
                //获取所有可访问站点的用户
                SPUserCollection userCollection = _currentWeb.AllUsers;
                //转换为List集合
                List<SPUser> listUsers = userCollection.Cast<SPUser>().ToList();
                foreach (SPListItem item in employeeList.Items)
                {
                    string displayName = item["Title"].ToStringOrEmpty();
                    //循环便利获取SPUser
                    foreach (SPUser user in listUsers)
                    {
                        if (displayName == user.Name)
                        {
                            string loginName = user.LoginName;
                            p = new People { LoginName = loginName, DisplayName = displayName };
                            peopleList.Add(p);
                        }
                    }
                }

                System.Web.HttpContext.Current.Cache["peopleList"] = peopleList;
            }
            #endregion
       
        }
  • 接下来就是对DropDownList的绑定:
       PeopleHelper.GetFromCache(_currentWeb);
            var peopleListFromCache = (List<People>)System.Web.HttpContext.Current.Cache["peopleList"];
            //与会人
            ddlPeopleChosen.DataSource = peopleListFromCache;
            ddlPeopleChosen.DataTextField = "DisplayName";
            ddlPeopleChosen.DataValueField = "LoginName";
            ddlPeopleChosen.DataBind();
  • 有了数据源之后,在客户端加上Chosen的JS,然后加上如下脚本即可:
var config = {
        '.chzn-select': {},
        '.chzn-select-deselect': { allow_single_deselect: true },
        '.chzn-select-no-single': { disable_search_threshold: 10 },
        '.chzn-select-no-results': { no_results_text: 'Oops, nothing found!' },
        '.chzn-select-width': { width: "95%" }
    }

 $(function(){
        //初始化Dom
        for (var selector in config) {
            $(selector).chosen(config[selector]).change(function(){
                var obj=$(this).next();//div?
                if($("span",obj).length>0){
                    obj.parent().next().css("display","none");//div
                }
            });
          
          }
      
      });
  • 查看Dom,我们可以发现Select如下:

接下来的事就简单了,我这边为了统一,将SharePoint中的人员Type还是Person Or Group,所以可以EnsureUser()将其转化为SPUser对象。

注意:EnsureUser方法,你可以EnsureUser(DisplayName),还可以EnsureUser(LoginName),我在此是提交了LoginName,如下所示,因为LoginName是唯一的,DisplayName未免野马了些,但你用DisplayName会非常方便,如果你确定了人员的DisplayName是不会重名的话。

 

  • 接下来对LoginName进行处理保存到List中。
var peopleSelect = System.Web.HttpContext.Current.Request["hidPeopleSelect"];
                        string[] peopleArr=null;
                        if (!string.IsNullOrEmpty(peopleSelect))
                        {
                            peopleSelect = peopleSelect.Trim(';');
                            peopleArr = peopleSelect.Split(';');
                            SPFieldUserValueCollection userColl = new SPFieldUserValueCollection();
                            foreach (string people in peopleArr)
                            {
                                SPUser spUser = _currentWeb.EnsureUser(people);
                                SPFieldUserValue userValue = new SPFieldUserValue(_currentWeb, spUser.ID, spUser.LoginName);
                                userColl.Add(userValue);
                                
                            }
                            hyitem["Participant"] = userColl;
                        }

单选的人员选择器

  • 单个选择的人员选择器用到的情况也是十分多的,特别是选择领导时,利用Chosen改造如下效果:

  • 配置也是十分简单的:
<asp:DropDownList  data-placeholder="请选择办公室主任" ID="ddlPeopleLevelOne" runat="server" ClientIDMode="Static" class="chzn-select-deselect" style="width:168px;"></asp:DropDownList>

注意Class=chzn-select-deselect意味着你可以点击X取消选择,不同的Class会有不同的效果,如:class=chzn-select

<asp:DropDownList  data-placeholder="选择会议负责人" ID="ddlConferenceCharge" runat="server" ClientIDMode="Static" class="chzn-select" style="width:168px;"></asp:DropDownList>

这样的人员选择器,一旦选择了就不能取消了,一般可以用来作为必选情况:

总结

Chosen是一个非常强大的 JQuery插件,利用Chosen完全可以让我们抛弃传统的PeopleEditor。更多Chosen的功能可以参看它的官方网站 http://harvesthq.github.io/chosen/

© 著作权归作者所有

共有 人打赏支持
粉丝 2
博文 222
码字总数 199010
作品 0
黄浦
规划安装部署SharePoint Server 2007精解(上)

规划安装部署SharePoint Server 2007精解 几个月前,在我的博文<>中看到现在中小企业面临的问题及利用EIP(Enterprise Information Portal)系统解决当前问题。而在本方案中谈到了SharePoin...

技术小胖子 ⋅ 2017/11/16 ⋅ 0

《sharepoint 2010云计算解决方案》使用SQL Azure 的BI 解决方案

SQL Azure 是云端的关系数据库,代表了管理组织机构中数据的一个起始点。然而,管理关系数据仅是BI 解决方案的一个方面;BI 解决方案的第二个同样至关重要的方面是,以一种有意义并且相关的(...

louise ⋅ 2012/09/18 ⋅ 0

再谈 SharePoint 大局观

前言 我对SharePoint这个产品很有感情,因为曾经有相当长一段时间,在很多个夜深人静、月黑风高的晚上,我都是在和它形影不离,在一个一个项目实践中相爱相杀。今天这个产品早已经不是我最初...

CSharpKit ⋅ 2017/12/23 ⋅ 0

SharePoint 2013常用开发工具分享

众所周知,一款好的开发工具不仅能提高项目开发效率,而且能够协助开发人员简化开发流程。本文汇总几款SharePoint 2013开发常用开发工具,希望能够对大家有所帮助。如果您有更好的工具,没有...

冷秋寒 ⋅ 2014/04/01 ⋅ 0

Sharepiont之页面模型

本文主要包括以下几方面内容: 1.页面布局和母版页 2.页面布局模型 3.页面模型 4.字段控件和控件模板 5.页面处理模型 1.页面布局和母版页 母版页和页面布局是MOSS2007中最基本的两个模板模型...

zting科技 ⋅ 2017/01/10 ⋅ 0

Sharepoint2013权限管理之老王乱弹一

最近和一些搞SharePoint的朋友在一起交流了一些关于SharePoint2013权限控制的东西,发现很多朋友对于SharePoint的权限控制,认识的不是很清晰,比如说如何通过SharePoint实现,用户可以查看但...

科技小能手 ⋅ 2017/11/12 ⋅ 0

Visual Studio 2010 专业版下载(电驴)

Microsoft Visual Studio 2010 Professional 是供开发人员执行基本开发任务的重要工具。可简化在各种平台(包括 SharePoint 和云)上创建、调试和开发应用程序的过程。Visual Studio 2010 Pr...

红薯 ⋅ 2010/04/14 ⋅ 20

Office 365 安全和合规性管理平台为企业数据安全管理保驾护航

如今,一些法律和商业人士都面临很多挑战,他们需要确保合规,确保文件安全、轻松地共享给团队人员和客户,他们希望技术人员提供的技术解决方案能cover文档安全性和合规,同时在必要的情况下...

Shelley0415 ⋅ 04/11 ⋅ 0

SharePoint 2007中的工作流概览

SharePoint 2007中的一个重要的特性就是对工作流的支持,SharePoint2007中的工作流是基于WF3.x的,要想深入SharePoint 2007中的工作流开发,了解WF是必须的,关于WF3.x的相关知识可以参考我写...

科技小毛 ⋅ 2017/10/10 ⋅ 0

Visual Studio 11开发指南(6)Visual Studio 11平台改进

特定于特定的平台技术。无论正在构建Windows 8、 Windows Phone、 Windows Azure、Microsoft Office、或之外的应用程序, Visual Studio 提供了特定于平台的工具来形成最佳体验。 DirectX 视...

junwong ⋅ 2012/03/09 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

tcp/ip详解-链路层

简介 设计链路层的目的: 为IP模块发送和接收IP数据报 为ARP模块发送ARP请求和接收ARP应答 为RARP模块发送RARP请求和接收RARP应答 TCP/IP支持多种链路层协议,如以太网、令牌环往、FDDI、RS-...

loda0128 ⋅ 今天 ⋅ 0

spring.net aop代码例子

https://www.cnblogs.com/haogj/archive/2011/10/12/2207916.html

whoisliang ⋅ 今天 ⋅ 0

发送短信如何限制1小时内最多发送11条短信

发送短信如何限制1小时内最多发送11条短信 场景: 发送短信属于付费业务,有时为了防止短信攻击,需要限制发送短信的频率,例如在1个小时之内最多发送11条短信. 如何实现呢? 思路有两个 截至到当...

黄威 ⋅ 昨天 ⋅ 0

mysql5.7系列修改root默认密码

操作系统为centos7 64 1、修改 /etc/my.cnf,在 [mysqld] 小节下添加一行:skip-grant-tables=1 这一行配置让 mysqld 启动时不对密码进行验证 2、重启 mysqld 服务:systemctl restart mysql...

sskill ⋅ 昨天 ⋅ 0

Intellij IDEA神器常用技巧六-Debug详解

在调试代码的时候,你的项目得debug模式启动,也就是点那个绿色的甲虫启动服务器,然后,就可以在代码里面断点调试啦。下面不要在意,这个快捷键具体是啥,因为,这个keymap是可以自己配置的...

Mkeeper ⋅ 昨天 ⋅ 0

zip压缩工具、tar打包、打包并压缩

zip 支持压缩目录 1.在/tmp/目录下创建目录(study_zip)及文件 root@yolks1 study_zip]# !treetree 11└── 2 └── 3 └── test_zip.txt2 directories, 1 file 2.yum...

蛋黄Yolks ⋅ 昨天 ⋅ 0

聊聊HystrixThreadPool

序 本文主要研究一下HystrixThreadPool HystrixThreadPool hystrix-core-1.5.12-sources.jar!/com/netflix/hystrix/HystrixThreadPool.java /** * ThreadPool used to executed {@link Hys......

go4it ⋅ 昨天 ⋅ 0

容器之上传镜像到Docker hub

Docker hub在国内可以访问,首先要创建一个账号,这个后面会用到,我是用126邮箱注册的。 1. docker login List-1 Username不能使用你注册的邮箱,要用使用注册时用的username;要输入密码 ...

汉斯-冯-拉特 ⋅ 昨天 ⋅ 0

SpringBoot简单使用ehcache

1,SpringBoot版本 2.0.3.RELEASE ①,pom.xml <parent><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-parent</artifactId><version>2.0.3.RELE......

暗中观察 ⋅ 昨天 ⋅ 0

Spring源码解析(八)——实例创建(下)

前言 来到实例创建的最后一节,前面已经将一个实例通过不同方式(工厂方法、构造器注入、默认构造器)给创建出来了,下面我们要对创建出来的实例进行一些“加工”处理。 源码解读 回顾下之前...

MarvelCode ⋅ 昨天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部