Sharepoint PeopleEditor control is not rendering as expected

[Arthur]

 

Sharepoint PeopleEditor control is not rendering properly if it is placed within the RadTabStripà RadTab controls (see sample screenshot from this link). We checked it within FireFox fire bug as you can see below the control type is set to hidden. Is there something that we need to set in the attributes of the Rad controls?

 

Rendered in FireFox

<input id="ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01_hiddenSpanData" type="hidden" name="ctl00$PlaceHolderMain$CollaborationTab$pplAssistantName$ctl01$hiddenSpanData"/>

<input id="ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01_OriginalEntities" type="hidden" value="<Entities><Entity Key="DS\francis.a.b.rosos" DisplayText="Rosos, Francis A. B." IsResolved="True" Description="DS\francis.a.b.rosos">

 

When we changed the type attribute value from hidden to text we can see the expected value e.g. Rosos, Francis A. B.

 

<input id="ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01_hiddenSpanData" type="text" name="ctl00$PlaceHolderMain$CollaborationTab$pplAssistantName$ctl01$hiddenSpanData"/>

<input id="ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01_OriginalEntities" type="text" value="<Entities><Entity Key="DS\francis.a.b.rosos" DisplayText="Rosos, Francis A. B." IsResolved="True" Description="DS\francis.a.b.rosos">

 

Html representation

<wssawc:PeopleEditor     AllowEmpty="true"     ValidatorEnabled="true"     id="pplEditorMyBackup"     AllowTypeIn="false"     runat="server"     SelectionSet="User,SecGroup,SPGroup,DL"     width="350px"     visible="true"     MultiSelect="true"     EnableViewState="true"          onkeydown="javascript:AllowDeleteOnly(event);"     onkeypress="javascript:AllowDeleteOnly(event);"     />

 

Source view in FireFox

<span id="ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01" style="display: inline-block; width: 350px;" eeaftercallbackclientscript="" showentitydisplaytextintextbox="0" allowempty="1" value="true" removetext="Remove" moreitemstext="More Names..." nomatchestext="<No Matching Names>"> <input id="ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01_hiddenSpanData" type="hidden" name="ctl00$PlaceHolderMain$CollaborationTab$pplAssistantName$ctl01$hiddenSpanData"/> <input id="ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01_OriginalEntities" type="hidden" value="<Entities><Entity Key="DS\francis.a.b.rosos" DisplayText="Rosos, Francis A. B." IsResolved="True" Description="DS\francis.a.b.rosos"><ExtraData><ArrayOfDictionaryEntry xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema"><DictionaryEntry><Key xsi:type="xsd:string">DisplayName</Key><Value xsi:type="xsd:string">Rosos, Francis A. B.</Value></DictionaryEntry><DictionaryEntry><Key xsi:type="xsd:string">Email</Key><Value xsi:type="xsd:string">[e-mail]</Value></DictionaryEntry><DictionaryEntry><Key xsi:type="xsd:string">SPUserID</Key><Value xsi:type="xsd:string">8</Value></DictionaryEntry><DictionaryEntry><Key xsi:type="xsd:string">Title</Key><Value xsi:type="xsd:string">Programmer</Value></DictionaryEntry><DictionaryEntry><Key xsi:type="xsd:string">PrincipalType</Key><Value xsi:type="xsd:string">User</Value></DictionaryEntry></ArrayOfDictionaryEntry></ExtraData></Entity></Entities>" name="ctl00$PlaceHolderMain$CollaborationTab$pplAssistantName$ctl01$OriginalEntities"/> <input id="ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01_HiddenEntityKey" type="hidden" name="ctl00$PlaceHolderMain$CollaborationTab$pplAssistantName$ctl01$HiddenEntityKey"/> <input id="ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01_HiddenEntityDisplayText" type="hidden" name="ctl00$PlaceHolderMain$CollaborationTab$pplAssistantName$ctl01$HiddenEntityDisplayText"/> <table id="ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01_OuterTable" class="ms-usereditor" cellspacing="0" cellpadding="0" border="0" style="width: 350px; border-collapse: collapse;"> <tbody> <tr> <td valign="top"> <table cellspacing="0" cellpadding="0" border="0" style="width: 100%; table-layout: fixed;"> <tbody> <tr> <td> <div id="ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01_upLevelDiv" class="ms-inputuserfield" autopostback="0" style="display: none; position: absolute;" tabindex="0" name="upLevelDiv"/> <textarea id="ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01_downlevelTextBox" class="ms-input" style="width: 100%;" autopostback="0" title="People Picker" onkeyup="onKeyUpRw('ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01');" onkeydown="return onKeyDownRw(this, 'ctl00_PlaceHolderMain_CollaborationTab_pplAssistantName_ctl01', 3, false, event);" cols="20" rows="3" name="ctl00$PlaceHolderMain$CollaborationTab$pplAssistantName$ctl01$downlevelTextBox"/> </td> </tr> </tbody> </table> </td> </tr> <tr> </tr> <tr style="padding-top: 2px;"> </tr> </tbody> </table> </span>

 

[Atanas Korchev]

Hi Francis Rosos,

 By default the RadPageView control does not change any attributes of its child control. By the way those inputs (the hidden ones) seem to not be the textbox itself - from the screenshot it seems that the textbox is rendered in both cases. Perhaps the PeopleEditor control cannot initialize itself properly if placed in a hidden html element (style="display:none") as the RadPageView. Does it work when the pageview where the PeopleEditor control is placed is selected by default?

Regards,
Albert
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Arthur]

i guess you are right. The PeopleEditor is not rendering when its container is initially hidden. When I set the container to be displayed by default, the values are rendered in the control. Can you suggest for a way to work around this? Basically, we need to hide the table (where the PeopleEditor is contained) during page load so the users won't see it. When he/she clicks on an Edit button, that is the only time the table with the PeopleEditor is displayed, prepopulated with the values that stored before.

Your suggestions will be of big help. Thanks in advance.

Regards,
Arthur

[Atanas Korchev]

Hello Arthur,

Since I am not aware of the implementation of the PeopleEditor control I would suggest something generic. You can wrap the control inside some hidden element <div style="visibility:hidden">. Then you can show it via javascript by setting the visibility to "visible".

Regards,
Albert
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Arthur]

On my further investigation I found out that the values in the PeopleEditor is not dislpaying after the postback, not really because of the hiding/displaying of its container.

What I did is I displayed everything on page load (I removed all the manipulation on the visibility) and tried if the values will still be there after a postback. On page load, everything was ok. When I clicked a button that triggered the post back, the values in the textboxes were still there but the values inside the PeopleEditor were gone.

I am not sure what's causing this because all I am doing in Page Load is prepopulate all the controls (Textboxes and PeopleEditor). I tried repopulating it after postback but it doesn't work. I read about the PeoplePicker's usage of the client callback and I am thinking if this has anything to do with the PeoplePicker not rendering after postback.

Please advice.


Regards,
Arthur

[Atanas Korchev]

Hello Arthur,

Unfortunately we cannot assist you further. The problem you are experiencing seems related with the PeopleEditor control which we are not familiar with. I suggest you ask your questions in some SharePoint related forum.

Regards,
Albert
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Robin Davies]

I had similar issue with this but it only happens when the people editor control is placed inside an Ajax panel. Do you happen to place your control inside an Ajax panel? For me, as soon as I disabled AJAX, the people editor control persists its value correctly after postback.

[Jason Lee]

I have the same issue. The SharePoint PeopleEditor control works fine in Telerik container controls until I AJAX-enable the container controls (using the RadAjaxManager). At this point, the PeopleEditor stops persisting data over postbacks/callbacks.

Anyone found a workaround for this?

[Jayesh]

even i am facing same issue with telerik 2011 version. is there any work around?

[Maria Ilieva]

Hi,

Nite that ajaxifying the telerik controls that are positioned within a user controls works somewhat differently from the scenario when they are loaded directly on a web form. Also note that RadAjaxPanel shoud not be used in SP environment.
In you case, you need to place the RadAjaxManager control to the web part class, create it there and add it to the Controls collection of the web part as follows:

private RadAjaxManager _ajaxManager;

protected override void OnInit(EventArgs e)
{
    base.OnInit(e);

    SetUpAjaxManagerOnPage();

    EnsureChildControls();
}


protected void SetUpAjaxManagerOnPage()
{
    RadAjaxManager currentAjaxManager = RadAjaxManager.GetCurrent(Page);

    if (currentAjaxManager == null)
    {
        Page.Form.Controls.AddAt(0, AjaxManager);
        Page.Items.Add(typeof(RadAjaxManager), AjaxManager);
    }
}

protected virtual RadAjaxManager AjaxManager
{
    get
    {
        if (_ajaxManager == null)
        {
            _ajaxManager = RadAjaxManager.GetCurrent(Page);

            if (_ajaxManager == null)
            {
                _ajaxManager = new RadAjaxManager() { ID = "RadAjaxManager1" };
            }
        }

        return _ajaxManager;
    }
}

Then in the OnLoad event of the web part, get the RadAjaxManager as follows:

RadAjaxManager _manager = RadAjaxManager.GetCurrent(Page);

and add your ajax settings programmatically. Beforehand, you should have the user control in the CreateChildControls method of the web part and there through FindControl you should retrieve the controls to ajaxify. Keep them in a private variable local to the web part class and use that in the OnLoad event to dynamically add the ajax settings.


Hope this information will prove helpful.

Regards,
Maria Ilieva
Telerik