How to use jquery chosen to create a new people selector in SharePoint

Source: Internet
Author: User
Tags foreach httpcontext

Based on SharePoint platform development, the people selector usage is very high, but the native staff selector is too cumbersome, and very clumsy, very unfriendly, especially for the old man in the government department, to let them manually input personnel, is simply wishful thinking. In a word, the simpler the better.

In order to make customers satisfied, we must change the personnel selector, the original peopleeditor completely abandoned. Can only find a new way, look for the appropriate jquery plug-ins, create a fresh staff selector, analyze the requirements, can be summed up the new staff selector must support the following:

Support staff, such as meetings, notifications need to send more people, of course, to support the deletion.

For the person selector for the radio, you can delete the selected person.

Regardless of radio or multiple selection, support Jquey autocomplete indexing function.

Find out, find jquery chosen function is very powerful, fully meet my needs, more features refer to chosen official website:

Using jquery chosen to transform

Multiple selection of people selectors

Support multiple selection, click X to uncheck, of course, also support the index, as follows:

Configuration is also very simple, first of all you have a select, such as:

 <asp:dropdownlist runat= "Server" clientidmode= "Static" id= Ddlpeoplechosen "data-placeholder=" Select Attendees ... "class=" Chzn-select "multiple style=" WIDTH:397PX; "></asp:DropDownList>

Note: The data-placeholder means that the default text when the person is not selected, multiple mean support for multiple selections.

Next, you need to add a data source to it, and note that for a single person selector, the chosen author says that if you want to display the default text hint, you need to add an empty option to the select (the first one).

Note: My staff is not taken out of the ad, but we have a store list (personnel file), in order to ensure that the list of personnel can log into OA, deliberately and web.alluser comparison, of course, can also not be necessary to do insurance points.

The public static void Getfromcache (SPWeb _currentweb) {#region read from the cache if (System.Web.HttpCon Text.
                current.cache["peoplelist"] = = null) {//people collection: joins the user in SharePoint as a data source collection in DropDownList
                list<people> peoplelist = new list<people> (); 
                Note:on single Selects, the ' the ' the ' the ' assumed to be selected by the browser. To take advantage of the default text support,//you'll need to include a blank option as the
                Lement of your select list.
                Peoplelist.add (New People ());
                People p = null; SPList employeelist =["Rsgl"].
                Lists["Personnel files"];
                Get all users who can access the site spusercollection usercollection = _currentweb.allusers; Convert to List collection list<spuser> listusers = usercollection.cast<spuser> ().
                ToList (); ForeaCH (splistitem item in Employeelist.items) {string displayName = item["Title"].
                    Tostringorempty (); Recycling facilitates getting SPUser foreach (spuser user in listusers) {if (di Splayname = = user. Name) {string loginName = user.
                            p = New People {LoginName = LoginName, DisplayName = DisplayName};
                        Peoplelist.add (P); }} system.web.httpcontext.current.cache["Peoplelist" = people
            List; } #endregion}

Next is the binding to the 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 ();

After you have the data source, add the chosen JS to the client and add the following script:

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.