Sometimes SharePoint PeopleEditor WebControl need to be initialized on the client side.
Initialize People Editor control
|
//Init People Picker |
|
//peoplePickerId – SharePoint People Editor ClientID |
|
//pickerEntityXml – PickerEntity in xml (see method ToXmlData for class PickerEntity) |
|
function initPeoplePickerBox(peoplePickerId, pickerEntityXml) { |
|
var $pe = $("#" + peoplePickerId); |
|
|
|
|
|
var entityProps = {LoginName: pickerEntityXml.attr("Key"), |
|
UserName: pickerEntityXml.attr("DisplayText"), |
|
Description: pickerEntityXml.attr("Description")}; |
|
|
|
var entityExtendedProps = pickerEntityXml.find("ArrayOfDictionaryEntry"); |
|
|
|
|
|
var $peData = $pe.find("input[id$='hiddenSpanData']"); |
|
var $peDisplayArea = $pe.find("div[id$='_upLevelDiv']"); |
|
|
|
var displayData = "<span id='span{LoginName}' iscontenttype='true' tabindex='-1' class='ms-entity-resolved' contenteditable='false' title='{LoginName}'>" + |
|
" <div style='display:none;' id='divEntityData' key='{LoginName}' displaytext='{UserName}' isresolved='True' description='{LoginName}'>" + |
|
" <div data='{PickerEntityData}'></div>" + |
|
" </div>" + |
|
" <span id='content' tabindex='-1' contenteditable='false' onmousedown='onMouseDownRw(event);' oncontextmenu='onContextMenuSpnRw(event,ctx);'>{UserName}</span>" + |
|
"</span>"; |
|
|
|
var pickerEntityData = convertFromXML(entityExtendedProps[0]); |
|
|
|
displayData = displayData.replace(/{LoginName}/g, entityProps.LoginName); |
|
displayData = displayData.replace(/{UserName}/g, entityProps.UserName); |
|
displayData = displayData.replace('{PickerEntityData}', pickerEntityData); |
|
|
|
$peDisplayArea.append(displayData); |
|
$peData.val(displayData); |
|
|
|
} |
Clear People Editor control
|
//Clear People Picker |
|
//peoplePickerId – SharePoint People Editor ClientID |
|
function clearPeoplePickerBox(peoplePickerId) { |
|
var $pe = $("#" + peoplePickerId); |
|
var $peData = $pe.find("input[id$='hiddenSpanData']"); |
|
var $peDisplayArea = $pe.find("div[id$='_upLevelDiv']"); |
|
$peDisplayArea.children().remove(); |
|
$peData.val(""); |
|
} |
Like this:
Like Loading...
Related
Pingback: Different ways of extending People Editor in the client side (SharePoint 2010) | Yet Another SharePoint Blog