none
Javascript: Clean people picker RRS feed

  • Question

  • Hi everyone,

    I'm a total newbie in javascript and for our Project server 2016, I found a script on internet (Here) which allows to transform a single line of text into people picker, everything works fine except if I removed a previous user and then I saved my field, when I refresh the page, the previous value is still there

    I tried this script on edge and there, everything works perfectly Any idea of what I could do?

    Here the script I found on internet (I did some modifications on it)

    <script>
    var targetFields = ['Project Sponsor'];
    if (typeof jQuery == 'undefined') {
        var s = document.createElement("script");
        s.src = '//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js';
        if (s.addEventListener) {
            s.addEventListener("load", function () { myJQueryCode() }, false);
        } else if (s.readyState) {
            s.onreadystatechange = function () { myJQueryCode() };
        }
        document.getElementsByTagName('head')[0].appendChild(s);
    } else {
        myJQueryCode();
    }
    function myJQueryCode() {
        $(document).ready(function () {
            var scriptRoot = _spPageContextInfo.siteAbsoluteUrl + '/_layouts/15/';
            $.when(
                    $.getScript(scriptRoot + "clienttemplates.js"),
                    $.getScript(scriptRoot + "clientforms.js"),
                    $.getScript(scriptRoot + "clientpeoplepicker.js"),
                    $.getScript(scriptRoot + "autofill.js")
                )
                .done(function () {
                    window.console && console.log('Scripts loaded');
                    renderPeoplePickers();
                })
                .fail(function (message) {
                    window.console && console.error('Loading scripts failed: ' + message);
                });
        });
    }
    function renderPeoplePickers() {
        for (fieldIndex = 0; fieldIndex < targetFields.length; fieldIndex++) {
            $("input[type='text'][title='" + targetFields[fieldIndex] + "']").each(function () {
                this.style.color = "green";
                renderPeoplePicker(this);
                window.console && console.log('PeoplePicker rendered: ' + targetFields[fieldIndex]);
            });
        }
    }
    function renderPeoplePicker(targetInput) {
        var divPeoplePicker = document.createElement('div');
        var idPeoplePicker = targetInput.id + '_PeoplePicker';
        var targetValue = $(targetInput).attr('value');
        divPeoplePicker.id = idPeoplePicker;
        $(targetInput).parent().append(divPeoplePicker);
        initializePeoplePicker(idPeoplePicker);
        var newPeoplePicker = this.SPClientPeoplePicker.SPClientPeoplePickerDict[idPeoplePicker + '_TopSpan'];
        $(targetInput).hide();
        if (typeof targetValue !== "undefined") {
            newPeoplePicker.AddUnresolvedUser({
                Key: targetValue,
                DisplayText: targetValue
            }, true);
        }
        newPeoplePicker.OnControlResolvedUserChanged = function () {
            if (this.TotalUserCount > 0) {
                var resolvedUser = this.GetAllUserInfo()[0];
                $('input#' + (this.TopLevelElementId.split("_PeoplePicker_TopSpan")[0])).attr('value', resolvedUser.DisplayText);
                if ($('input#' + (this.TopLevelElementId.split("_PeoplePicker_TopSpan")[0])).attr('origvalue') !== $('input#' + (this.TopLevelElementId.split("_PeoplePicker_TopSpan")[0])).attr('value')) {
                    WPDPParts[0].IsDirty = true;
                }
            } else {
                $('input#' + (this.TopLevelElementId.split("_PeoplePicker_TopSpan")[0])).attr('value', '');
            }
        }
    }
    function initializePeoplePicker(peoplePickerElementId, defaultValue) {
        var users;
        if ((defaultValue != undefined) && (defaultValue != "")) {
            users = new Array(1);
            var defaultUser = new Object();
            defaultUser.AutoFillDisplayText = defaultValue;
            defaultUser.AutoFillKey = defaultValue;
            defaultUser.DisplayText = defaultValue;
            defaultUser.EntityType = "User";
            defaultUser.IsResolved = false;
            defaultUser.Key = defaultValue;
            defaultUser.Resolved = false;
            users[0] = defaultUser;
        } else {
            users = null;
        }
        var schema = {};
        schema['PrincipalAccountType'] = 'User';
        schema['SearchPrincipalSource'] = 15;
        schema['ResolvePrincipalSource'] = 15;
        schema['AllowMultipleValues'] = true;
        schema['MaximumEntitySuggestions'] = 50;
        schema['Width'] = '360px';
        this.SPClientPeoplePicker_InitStandaloneControlWrapper(peoplePickerElementId, users, schema);
    }
    </script>

    Thank you for your help :)

    Wednesday, September 2, 2020 7:14 PM