How do you properly use JavaScript in Text Gadget?

[Jorge Baranda]

Hey there,

I'm trying to add more content to my JIRA dashboard by using the HTML capabilities of the "Text Gadget". Things seem to run great the first time, but I get an "Unknown error occurred rendering this gadget" if I try to edit the gadget's content.

Here's the specific JS I'm adding:

<h3><div id=”milestone_countdown”></div> days left!</h3>

<script>
today=new Date();
var next_milestone=new Date(today.getFullYear(), 10, 12);
var one_day=1000*60*60*24;
document.getElementById("milestone_countdown").innerHTML = Math.ceil((next_milestone.getTime()-today.getTime())/(one_day));
</script>

And the error I'm getting when I inspect the element in the page:

Uncaught TypeError: Cannot set property 'innerHTML' of null
Error rendering gadget with id '15053': Cannot set property 'innerHTML' of null TypeError: Cannot set property 'innerHTML' of null

What am I doing wrong and how can I fix this?  Thanks!

[Murakami [Atlassian Support]]

Hi Jorge,

Seems that you are using an invalid double-quote character for the div id:

<h3><div id=”milestone_countdown”></div> days left!</h3>

Using the correct one as:

<h3><div id="milestone_countdown"></div> days left!</h3>

<script>
today=new Date();
var next_milestone=new Date(today.getFullYear(), 10, 12);
var one_day=1000*60*60*24;
document.getElementById("milestone_countdown").innerHTML = Math.ceil((next_milestone.getTime()-today.getTime())/(one_day));
</script>

It worked fine. 

The result presented was:

140

days left!