I am trying to find a way to auto populate some values whenever I detect a change in taxonomy selection (ClientPeoplePicker control), how can I achieve this using jquery?
This is what I currently have:
$("[id*='taxDepartment']").change( function() {
alert('test');
});
When the value in Taxonomy picker control (ScriptForWebTaggingUI) is changed, the event Microsoft.SharePoint.Taxonomy.ScriptForWebTaggingUI.onTextChanged is triggered by default.
This custom event could be registered for Taxonomy picker control as demonstrated below:
function initTaggingControl() {
RTE.CanvasEvents.registerListener(RTE.CanvasEvents.editableRegionChangedEvent, Function.createDelegate(null, onCustomTextChanged));
}
function onCustomTextChanged(sender, args) {
if(args.editableRegion.innerText.length > 0){ //if value is specified?
console.log(args.editableRegion.innerText); //print term label
}
}
ExecuteOrDelayUntilScriptLoaded(initTaggingControl, 'ScriptForWebTaggingUI.js');
In the specified example term label will be printed every time once the term is selected.
You also might be interested to find more details about ScriptForWebTaggingUI control in this post.
Another solution could be override onblur function, this way the code not trigger every keydown. Still, the inserted value is not validated yet.
function initTaggingControl() {
RTE.CanvasEvents.registerListener(RTE.CanvasEvents.editableRegionBlurEvent, Function.createDelegate(null, onCustomBlur));
}
function onCustomBlur(sender, args) {
if (args.oldEditableRegion.parentNode.parentNode.parentNode.FieldName == "FieldName") {
if (args.oldEditableRegion.innerText.length > 0) {
console.log(args.oldEditableRegion.innerText);
}
}
}
As textboxes don´t fire the onchange Event when the values are inserted by script but only by user manually this won´t work.
You will have to attach/overwrite some builtin-Taxonomy scripts to execute your code.
