Skip to content

Instantly share code, notes, and snippets.

@AlexeyShevchenko
Created July 6, 2017 09:11
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save AlexeyShevchenko/8ab1950e4ec57e095a866827602e6862 to your computer and use it in GitHub Desktop.
Save AlexeyShevchenko/8ab1950e4ec57e095a866827602e6862 to your computer and use it in GitHub Desktop.
How to make a rendering refresh after an Experience Editor Button has been used
@using Sitecore.Data.Fields
@using Sitecore.Data
@{
var textOfTagFieldName = "Text of Tag";
var tagsFieldRawId = "34EE4D2C-F028-4901-8CFC-96B6D521B646";
var tagsFieldId = new ID(tagsFieldRawId);
var tagsField = new MultilistField(Sitecore.Context.Item.Fields[tagsFieldId]);
var tags = tagsField.TargetIDs.Select(id => Sitecore.Context.Database.GetItem(id));
var regex = "/" + tagsFieldRawId.Replace("-", string.Empty) + "/";
}
<div id="tags-source-container">
<p>Tags:</p>
<div id="tags">
@foreach (var tag in tags)
{
@tag[textOfTagFieldName]
<br />
}
</div>
</div>
<script>
var intervId;
var currentTagsIds;
var getJSON = function (url) {
return new Promise(function (resolve, reject) {
var xhr = new XMLHttpRequest();
xhr.open('get', url, true);
xhr.responseType = 'json';
xhr.onload = function () {
var status = xhr.status;
if (status == 200) {
resolve(xhr.response);
} else {
reject(status);
}
};
xhr.send();
});
};
window.onload = function () {
initInterval();
};
function initInterval() {
intervId = setInterval(updateTagsAsNeeded, 1000);
}
function updateTagsAsNeeded() {
var scFieldValuesElement = getScFieldValuesElement()
if (scFieldValuesElement == null) {
return;
}
var hiddenInputAssociatedWithTagsField = getHiddenInputAssociatedWithTagsField(scFieldValuesElement);
if (hiddenInputAssociatedWithTagsField == null) {
return;
}
var tagsIds = getTagsIds(hiddenInputAssociatedWithTagsField);
if (tagsIds == currentTagsIds) {
return;
}
currentTagsIds = tagsIds;
updateTags(currentTagsIds);
}
function getScFieldValuesElement() {
return document.getElementById('scFieldValues');
}
// go through hidden inputs within <div id="scFieldValues">
// using regex search for input which id contains 'Tags' field's id
// value attribute of necessary input contains ids of just selected tags
function getHiddenInputAssociatedWithTagsField(scFieldValuesElement) {
var regex = @regex;
for (i = 0; i < scFieldValuesElement.children.length; i++) {
var hiddenInput = scFieldValuesElement.children[i];
if (regex.test(hiddenInput.id)) {
return hiddenInput;
}
}
return null;
}
function getTagsIds(hiddenInputAssociatedWithTagsField) {
return hiddenInputAssociatedWithTagsField.getAttribute("value");
}
function updateTags(tagsIds) {
var tags = document.getElementById("tags");
if (tagsIds.length == 0) {
tags.innerHTML = '';
return;
}
var ids = tagsIds.split('|');
var output = '';
var arrayOfPromises = [];
for (i = 0; i < ids.length; i++) {
var tagId = ids[i];
// use The ItemService API
var url = "/sitecore/api/ssc/item/" + tagId + "?fields=" + "@textOfTagFieldName";
arrayOfPromises.push(getJSON(url));
}
Promise.all(arrayOfPromises)
.then(function (res) {
res.forEach(function (item, index, array) {
var textOfTag = item["@textOfTagFieldName"];
output += (textOfTag + '<br />');
tags.innerHTML = output;
});
})
.catch(function (err) {
console.error(err);
});
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment