example image of current state and ideal state
I am trying to edit the hover text that is generated on a survey question in SharePoint 2013. The question is a Choice type with 3 answer choices displayed as Checkboxes. At present, when you hover your mouse over the respective answers, the hover text mirrors the answer text. I would like to display a list of information in this hover text field (or tooltip field, or whatever it is correctly called) that gives more information to the user.
To clarify, the question is: "Please indicate if you would be interested in training in any of the topics below:"
Answers consist of:
1.0 Art
2.0 Programming
3.0 Sports
If you hover over 1.0 Art, the text in the hover box is "1.0 Art" but I would like it to read:
Consists of the following topics:
1.1 Painting
1.2 Sculpture
1.3 Graphic Design
(All on separate lines, if possible)
and 2.0 Programming would be:
Consists of the following topics:
2.1 Python
2.2 Java
2.3 C++
And answer 3.0 Sports would be:
Consists of the following topics:
3.1 Baseball
3.2 Hockey
3.3 Swimming
I have tried the following two different code snippets with no change to the hover text:
1:
<script type="text/javascript" language="javascript">
$(function(){$("span.ms-RadioText label:contains('1.0 Art')").parent().find('input').attr('title','Consists of the following topics:1.1 Painting1.2 Sculpture1.3 Graphic Design');
$("span.ms-RadioText label:contains('2.0 Programming')").parent().find('input').attr('title','Consists of the following topics:2.1 Python2.2 Java2.3 C++');
$("span.ms-RadioText label:contains('3.0 Sports')").parent().find('input').attr('title','Consists of the following topics:3.1 Baseball3.2 Hockey3.3 Swimming'); });</script>
2:
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script><script type="text/javascript">
$(function () {
$('span[title="1.0 Art"]').tooltip({
content: "Consists of the following topics: 1.1 Painting1.2 Sculpture1.3 Graphic Design" });
$('span[title="2.0 Programming"]').tooltip({
content: "Consists of the following topics: 2.1 Python2.2 Java2.3 C++" });
$('span[title="3.0 Sports"]').tooltip({
content: "Consists of the following topics: 3.1 Baseball3.2 Hockey3.3 Swimming" }); }) </script>
I feel like I'm looking at the wrong fields but I cannot find references to the correct fields. Any help would be greatly appreciated!
This is just an example to illustrate the concept, as my real list is 50+ items, and I've been instructed to keep it as one question, so I can't break it up into separate questions.
(I also do not have access to SharePoint Designer)
Sorry for the poor formatting and thanks!