Come for the products,
stay for the community

The Atlassian Community can help you and your team get more value out of Atlassian products and practices.

Atlassian Community about banner
4,359,750
Community Members
 
Community Events
168
Community Groups

How to call JavaScript from web item link?

I followed online doc added a hyperlink on Jira navigation menu. I am wonder is there any way I can add a onmouseover Event on this hyper link.

2 answers

Hey Qi,

I think the following link could be more helpful for your better understanding

https://mraddon.blog/2017/03/29/jira-scriptrunner-rest-endpoint-web-fragment-example/

0 votes

You would need to add a web resource in ScriptRunner with your Java Script. In your Java Script you would search for the required web item and make changes to the web item (add the onmouseover Event).

@Alexey Matveev _Appfire_

Hey Alexey,

Could you provide me with detail steps on how to do that? 

Thanks

1. Create web item

https://scriptrunner.adaptavist.com/4.3.9/jira/fragments/WebItem.html

2. Write your javascript file.

you have to wait until the document is ready and then to look for the web item and add your code.

You should read a manul about Jquery.

3. add the javascript file as a web resource

https://scriptrunner.adaptavist.com/4.3.1/jira/fragments/WebResource.html

@Alexey Matveev _Appfire_ 

Is there jira build in  tooltip function I can use?  I am looking for tooltip effect, like when we mouseover to Jira navi menu -> Projects, it popup "View recent jira project".

 

And let's way I would like to add a button on the navi area, with a tooltip option. After I choose custom web item, what I need to set in "Condition" and "Do what" input box?

You can find how to make a button here

https://docs.atlassian.com/aui/7.8.0/docs/buttons.html

You can find to make a tooltip here:

https://docs.atlassian.com/aui/7.8.0/docs/tooltips.html

You set your condition, when your web item should be visible, in the Condition part. in the Do what part, if you want to apply java script, then you should use "Do nothing - you will use java script to bind the action".

@Alexey Matveev _Appfire_

Hi Alexey,

Thanks for reply, I need some more help on tooltip:

So I create a custom web item,

key: link-to-google

Menu text: Google

Condition:

Do What: Do nothing - you will use javascript to bind an action

Link: No entry

 

Where and how to add js and html as you mentioned in step 2? In Condition?

Could you give me a full example? Thanks


<a id="simple-tooltip" href="http://google.com/" title="This is a simple tooltip">tooltip</a>

<script>AJS.$("#simple-tooltip").tooltip();</script>

Like alex likes this

I gave you a link. You can find full explanation there

  https://scriptrunner.adaptavist.com/4.3.1/jira/fragments/WebResource.html

Instead of css file put your js file there. If you are not sure about the context, then choose jira.general.

@Alexey Matveev _Appfire_

Alexey I am confused now. So from previous reply, I can use:

 

<a id="simple-tooltip" href="http://google.com/" title="This is a simple tooltip">tooltip</a>

<script>AJS.$("#simple-tooltip").tooltip();</script>

Which is from AUI to achieve tooltip.

If I did create a custom item, then key is  link-to-google. Where I should save those html and js code above? I did read that doc before, which does not help me that much. If you can give me detail steps will help out of this.

First of all you should see your web item in Jira, push F12 and see its id.

Then you need to write your java script file so that it looks for the button and add tooltip functionality.

For example if you want to add a custom function for onclick functionality, it would wirte something like this:

AJS.$("#yourbuttonid").onclick(function () {})

For tooltips you need to figure out yourself. And your script must be executed on document load. For example like this

<script>

(function ($) {

AJS.$("#yourbuttonid").onclick(function () {})

})(AJS.$);

</script>

Kinldy read info on jquery.

You do not have to write any html code. You must change html in your java script file

Suggest an answer

Log in or Sign up to answer
TAGS
Community showcase
Published in Apps & Integrations

Apps for Confluence you won't want to miss: RSVP for September's Appy Hours

Calling all collaborators and Confluence users! Our Appy Hours event on September 29th features 4 presenters demoing functionality to superpower Confluence. Don't miss learning about these apps i...

110 views 0 9
Read article

Atlassian Community Events