Skip to content

Instantly share code, notes, and snippets.

@eninja
Last active October 18, 2018 08:54
Show Gist options
  • Select an option

  • Save eninja/f830bd9b052c65764a27392f19874e21 to your computer and use it in GitHub Desktop.

Select an option

Save eninja/f830bd9b052c65764a27392f19874e21 to your computer and use it in GitHub Desktop.
I had script which replace Edit Icon with custom image, but it didn't work in SharePoint until group is expanded (html of tbody is loaded after it), so I need to use MutationObserver and create it's weaker version for this browsers which didnt support it.
var siteUrl = "http://www.example.com/";
function SetEditFieldIcon() {
var imageUrl = siteUrl + 'styles/img/edit.png';
$("img[src*='edititem.gif'][alt='edit']").attr('src', imageUrl);
}
function createObserverForBrowser() {
if (IsBrowserSupportMutationObserver()) {
ObserverEditFieldIconForModernBrowsers();
} else {
ObserverEditFieldIconForIE();
}
}
function ObserverEditFieldIconForModernBrowsers() {
var targetNode = document.getElementById('contentBox');
var config = {
attributes: true,
childList: false,
subtree: true,
attributeOldValue: true,
attributeFilter: ["isloaded"]
};
var callback = function(mutationsList) {
for (var i = 0; i < mutationsList.length; i++) {
var mutation = mutationsList[i];
if (mutation.oldValue === 'false') {
SetEditFieldIcon();
}
}
};
var observer = new MutationObserver(callback);
observer.observe(targetNode, config);
}
function IsBrowserSupportMutationObserver() {
return !!window.MutationObserver;
}
function ObserverEditFieldIconForIE() {
var elementsTbody = $('tbody[isLoaded="false"]');
var inputList = Array.prototype.slice.call(elementsTbody);
for (var i = 0; i < inputList.length; ++i) {
var e = inputList[i];
$(e).parent().on("DOMAttrModified", function(event) {
if (event.originalEvent.attrName === "isLoaded") {
SetEditFieldIcon();
}
});
};
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment