Community
Products
Jira
Questions
Dialog2 box not getting triggered on issues search view from More dropdown item

Dialog2 box not getting triggered on issues search view from More dropdown item

Hi Friends,

This is in continuation with my question 695430#M227429, I am able to create a dialog2 modal box from the more section link with the steps mentioned in the prev question, but it is not working in the issue search view.

My javascript will look like :

(function ($) {
$(document).ready(function () {
// step 1. put dialog HTML at the end of <body> element

$('body').append(...);

// step 2. set click handler to your web-item, using AJS.dialog2
actionButtons();
// step 3. remove the href of link item from More dropdown
$('#custom-link').removeAttr('href');
});
});

With my javascript, I am not able to remove the href of $('#custom-link') and it always gets redirected to home page. But the same works for Issues page. Any hint why this behavior?

Thanks in advance!

Regards,
Arun

1 answer

1 accepted

1 vote

Answer accepted

Hi Arun,

I'm not sure if the code you copied above is the exact code you're using, but there are some holes that need filling if we're to guess at why it's not working.

What does "actionButtons();" do?
Where is the "actionButtons" function defined?
How are you adding event handlers to the link that's meant to open the dialog?
Are you passing a value for "$" in to your immediately-executing function? In the code snippet you provided, the value for $ would be undefined, so I'd have to assume you are if you say it's working on another page...
Are there any javascript errors that occur on the page, either before or when you click on the link? You could check this in your browser's developer tools by preserving the console log messages when the page is changed.

My guess at this stage is that the code that's meant to register the event handlers on your button aren't actually being registered.

Clicking any element that's configured as a dialog trigger should prevent the default behaviour of that link, as is demonstrated on the AUI documentation page for dialog2: https://docs.atlassian.com/aui/latest/docs/dialog2.html

If it works on one page, but not on the issue search page, some additional thoughts on what might be going wrong:

Where are you rendering the link? Is it inside the view issue panel?
Again, how are you binding the event handlers to the link that's meant to open the dialog?

The issue search page re-renders the issue panel whenever the user browses to a new issue. If you're registering your event handlers by explicitly finding and binding events to the element itself, that element will be destroyed when the view issue panel re-renders. It would be much better to use delegate event handlers on the document instead; that way it won't matter whether the panel is re-rendered, the handlers will still work.

Some other suggestions:

Does your "#custom-link" element have to be a hyperlink? If it were, for instance, a <button type="button"> element instead, there would be no need to remove a href from it, since it would only ever handle clicks in the way you told it to.
Also, as a tip, you'll find a whole lot more developers working on their own plugins in the developer forums; my understanding is that community.atlassian.com is more geared toward product usage rather than alteration.

You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.

Comment

Hi Chris,

Thanks for your reply. I got the mistake. I was not passing value for "$" into my function. Now it works perfectly in Issue view, Issue search screen and partially on the scrum boards.

I am rendering the link inside the issue view as a new web-item in More drop-down list.

For registering the event handlers, I am using functions like
AJS.$(document).on("click", "#custom-link", function (e) {
e.preventDefault();
AJS.dialog2("#my-dialog").show();
});

But now when i go through the scrum board (ie, In scrum board - > select any issue to see preview mode . Then Select 3dots (. . .) on the right top corner of the issue preview - > select More Actions -> select the same web item from the drop down.) Dialog2 box not rendering

How can I bind the event handlers here?

Thanks once again for your help.

Regards,
Arun

You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.

Comment

Glad to hear you fixed the problem :)

As for the dropdown on agile boards, do you know if the ID is being added to your link there?

If I recall correctly, ID values aren't rendered for dropdown items. I may be wrong, though.

Perhaps try changing your event binding strategy. Instead of binding to the `linkId`, add a `styleClass` value like `js-myplugin-custom-link`, and bind your JS to the resulting CSS class instead of the ID.

You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.

Comment

Thanks Chris!

You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.

Forums

Product Q&A

Community resources

Support

Top groups

Community resources

Support

Learn

Community resources

Support

Events

Community resources

Support

Dialog2 box not getting triggered on issues search view from More dropdown item

1 answer

1 accepted

Suggest an answer

Was this helpful?

Thanks!

TAGS

Community showcase

Atlassian Community Events

Forums

Product Q&A

Community resources

Support

Top groups

Community resources

Support

Learn

Community resources

Support

Events

Community resources

Support

Dialog2 box not getting triggered on issues search view from More dropdown item

1 answer

1 accepted

Suggest an answer

Was this helpful?

Thanks!

TAGS

Community showcase

Atlassian Community Events

Welcome to the new Atlassian Community