Just a heads up: On March 24, 2025, starting at 4:30pm CDT / 19:30 UTC, the site will be undergoing scheduled maintenance for a few hours. During this time, the site might be unavailable for a short while. Thanks for your patience.

×
Create
cancel
Showing results for 
Search instead for 
Did you mean: 
Sign up Log in

Calling JavaScript from a Web Item module

Kyle Robinson
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
May 2, 2019

Hello,

I am currently trying to develop a plugin for Jira Cloud.


At this current time, I have a "Web Item" module that I've placed in my Atlassian-connect.json that is shown in the Tools menu when viewing an issue.

From here, I would like to use create a pop-up dialogue that will either directly call js or load a page that will call js.

This is in my Atlassian-connect.json

"webItems": [
{
"url": "/done",
"target": {
"type": "dialog",
"options": {
"height": "100px",
"width": "200px"
}
},
"key": "example-tools-item",
"location": "operations-top-level",
"context": "addon",
"weight": 600,
"name": {
"value": "Estimate Issue"
}
}
]



I've tried to use the JavaScript API but can't seem to get my head around it. I would like to create my own dialogue with different buttons by clicking the "Web Item".

 

I've stumbled along to create this following code, but not quite sure where it should sit and/or how I can get the dialogue to create without the first "predefined" dialogue showing. I try to use an event listener but I'm not sure how to do this without directly loading a new page.

AP.events.on('example-tools-item', function () {} //etc..
function newDia(){
AP.require('dialog', function (dialog) {
var newDialog = dialog.create({
key: 'dialog-module-key1',
width: '500px',
height: '40px',
chrome: true,
header: 'First Dialog',
submitText: 'Enter',
cancelText: 'Close',
"buttons": [
{
"key": "Close",
"identifier": "adgrq",
"text": "adgrq",
"disabled": false
}
],
}, true).on('close', function () {
alert("Close");
});
});
};

 

I'm also not sure what is suitable for Cloud development, e.g. Atlaskit, AUI, etc. I don't think I'll be needing to create a new page, only add modules etc. to current views.


Thanks in advance.

1 answer

0 votes
David Boyd
Atlassian Team
Atlassian Team members are employees working across the company in a wide variety of roles.
May 2, 2019

Hi @Kyle Robinson your descriptor is correct and a dialog launches when I click the web item.

You can dynamically add buttons from the JS code that loads inside your dialog using AP.dialog.createButton

Alternatively in your descriptor you could set chrome: false in the dialog target options and give yourself full control over the header and footer of the dialog

Suggest an answer

Log in or Sign up to answer
TAGS
AUG Leaders

Atlassian Community Events