Tooltips from Sharepoint List

[Ian Patrick]

Hi Alexander,
Instead of typing the tooltips into the DFFS form directly I want to be able to have a list that will contain the tooltips, read them into the tooltip fields of the target list. This is so that I can allow another user to edit the tooltips without giving them access to DFFS to edit the tooltips directly. The idea is to create another list in sharepoint to contain the tooltips referenced by field name row by row. I can read the list using JQuery no problem, what I can’t work out is how to write them into the tooltip fields inside DFFS using JS. Can you help?
Kind regards
Ian

[Alexander Bautz]

This example uses a custom list called “CustomDFFSTooltip”, with the “tooltip ID” in the Title field, and a multiline plain text field for the tooltip text.

Add this in the “Field tooltip” tab for the field you want the tooltip for:

<img onload="getMyCustomTooltip(this,'Tip1')" src="/_layouts/15/images/loadingcirclests16.gif" />

“Tip1” is the “tooltip ID” found in the Title field in the custom tooltip list. The spinner image is the SP2013 one – change the link to any image you like.

Then add this to the Custom JS textarea in the “Field table, Custom JS and CSS” tab:

function getMyCustomTooltip(img,id){
	var res = spjs.utility.queryItems({"listName":"CustomDFFSTooltip","query":"<Where><Eq><FieldRef Name='Title' /><Value Type='Text'>"+id+"</Value></Eq></Where>","viewFields":["Tooltip"]});
	if(res.count > 0){
		spjs.$(img).replaceWith(res.items[0].Tooltip);
	}else{
		spjs.$(img).replaceWith("No tooltip found");
	}
}

This will query the list when you hover over the “help icon” and replace the “spinner image” from your tooltip with the text from the custom list.

Let me know how it works out.

Alexander

[Ian Patrick]

Hi Alexander,

Thank you for posting your solution it works perfectly.

Kind regards

Ian

[Author]

Posts