How to set "Hint" on a backend form field in a particular view in Tokyo version

Zivan
Tera Contributor

In Tokyo version, I need to set "Hint" (hover text) on a backend form field only for a particular view.

I tried using "On Load" client script (running in the required view), but it does not appear to work.

The cleaned version of the client script code is:

 

function onLoad() {
	var hintTxt = 'Hint text';
	var fieldElement = g_form.getElement('u_field_name');
	setHoverText(fieldElement, hintTxt);
}

function setHoverText(element, hoverTxt) {
	element.title = hoverTxt;
}

 

I have checked "Isolate script" checkbox on the client script.

I have also tried another suggestion that involves creating a new div element and attaching it to the field element like:

...
function setHoverText(element, hoverTxt) {
	var itemId = element.value;
 	var newDiv = document.createElement("div");
 	var newContent = document.createTextNode(hoverTxt);
 	newDiv.appendChild(newContent);

 	newDiv.style.display = "none";
 	newDiv.style.position = "absolute";
 	newDiv.style.top = "10%";
 	newDiv.style.left = "50%";
 	newDiv.style.height = "40px";
 	newDiv.style.width = "150px";
 	newDiv.style.zIndex = "1060";
 	newDiv.style.padding = "3px;";
 	newDiv.style.backgroundClip = "padding-box";
 	newDiv.style.boxShadow = "0 5px 10px rgba(0, 0, 0, 0.2)";
 	newDiv.style.backgroundColor = "#ffffff";
 	newDiv.style.border = "1px solid #ccc;";
 	newDiv.style.borderRadius = "3px";
 	newDiv.style.textAlign = "center";

 	newDiv.setAttribute("id", itemId);			

 	element.appendChild(newDiv);

 	element.addEventListener("mouseover", function() {
 		element.style.display = "block";
 	});

 	element.addEventListener("mouseleave", function() {
 		element.style.display = "none";
 	});
}

 

but that one did not work either (as it seems that the DOM manipulation does not work).

 

Thank you all very much in advance for your help!

0 REPLIES 0