Skip to content

Instantly share code, notes, and snippets.

@CameronWills
Created March 26, 2017 08:28
Show Gist options
  • Save CameronWills/130f4362bccd8774e8380952a530523f to your computer and use it in GitHub Desktop.
Save CameronWills/130f4362bccd8774e8380952a530523f to your computer and use it in GitHub Desktop.
EpiServer v10 all properties view - Add a red star (*) to required properties / field labels
/* Add a required star (*) to fields marked as required */
.Sleek .epi-form-container__section__row label span.edit-required {
font-weight: bold;
color: red;
}
// Add star (*) after required property labels
require(["dojo/topic"], function(topic){
topic.subscribe("/dojo/io/stop", function() {
var elems = document.querySelectorAll(".Sleek .epi-form-container__section__row *[aria-required='true']");
for (var i = 0; i < elems.length; i++) {
var getParent = function(elem, cls) {
if (elem) return (elem.classList.contains(cls)) ? elem : getParent(elem.parentElement, cls);
}
var row = getParent(elems[i], 'epi-form-container__section__row');
if (row && !row.getAttribute('data-required')) {
row.setAttribute('data-required', '1')
var label = row.querySelector('label');
var span = document.createElement('span')
span.className = 'edit-required';
span.title = 'Required';
span.innerHTML = ' *';
label.appendChild(span);
}
}
});
});
<?xml version="1.0" encoding="utf-8"?>
<module>
<clientResources>
<add name="epi-cms.widgets.base" path="ClientResources/Styles/edit-mode.css" resourceType="Style"/>
<add name="epi-cms.widgets.base" path="ClientResources/Scripts/edit-mode.js" resourceType="Script"/>
</clientResources>
<clientModule>
<moduleDependencies>
<add dependency="CMS" type="RunAfter" />
</moduleDependencies>
</clientModule>
<dojo>
<paths>
<add name="events" path="Scripts" />
</paths>
</dojo>
</module>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment