OnChange Listener in Create Issue screen

akunnari January 22, 2021

Hello,

 

I would like to show a link to my customers based on an input in a dropdown-list, before they create the issue. Obviously an OnChange-Listener in JavaScript comes to mind and I've already managed to do this with the Message Field by Jibrok: https://marketplace.atlassian.com/apps/1219615/message-field?hosting=server&tab=overview

But it leaves an ugly mess on the view screen on the customer side.

 

Is there any different way to easily add a listener onto the create issue screen?

1 answer

0 votes
JiBrok
Marketplace Partner
Marketplace Partners provide apps and integrations available on the Atlassian Marketplace that extend the power of Atlassian products.
January 22, 2021

Hi! Could you please write to us in support about the problem "ugly mess on the view screen on the customer side".

1) In the field settings, you can specify which screens to display the message on. This is an option for the case when you need to use 1 screen on different issue contexts(create,view...), but you only need a message on one of them.

Conditions for displaying message

2) You can describe your case and support will help you to implement it :)

https://jibrok.atlassian.net/servicedesk/customer/portals

akunnari January 25, 2021

Following is my code:

HTML:

<p1>Please download the following document:</p1>
<br>
<a id="text" href="https://www.website.de">[YOUR DOWNLOADLINK WILL BE SHOWN HERE AFTER SELECTING A MODULE]</a>
<br>
<p2> and attach it to your issue.</p2>

 

JS:

if(JIBROK_MESSAGE_FIELD_CONTEXT == "CREATE_SD"){
require(['jquery'], function($) {

$('#customfield_10406').on('change', function(){

meineFunktion();
})

function meineFunktion(){
var v = document.getElementById("customfield_10406");
var strUser = v.options[v.selectedIndex].text;
var str = strUser.replace(" ", "_");
str = str.replace("/", "_");

$('#text').attr("href", "https://www.website.de/downloads/dokumente/" + str);
$('#text').text("https://www.website.de/downloads/dokumente/" + str);
}
})
} else if(JIBROK_MESSAGE_FIELD_CONTEXT == "VIEW_SD"){

} else {

}

 

As follows are the visual effects of the field: 

 

Creating issue(the Downloadlink field):

This is when the screen loads:

image.png

This is when you change the input in "Modulauswahl":

image.pngSo the Function is as wished to this point. The Problem occures in the "view issue screen" on the customer side:

Initially, there is only a subtle change in the spacing between the fields, where one could expect the messagefield:

image.pngBut after anything is done to the issue (eg. commented or statuschange from the customer view screen, following happens, even though I tried specifying in the code, that nothing is to happen on the "view issue" screen:

else if(JIBROK_MESSAGE_FIELD_CONTEXT == "VIEW_SD"){

} else {

 image.png

I tried it also just without the else, if in the code but it didn't change anything.

 

Thanks if you can help me

Like JiBrok likes this
JiBrok
Marketplace Partner
Marketplace Partners provide apps and integrations available on the Atlassian Marketplace that extend the power of Atlassian products.
January 25, 2021

Please tell me which version of the plugin are you using?

  • For service desk, I recommend using the latest version 4.3.1.

 

Also by the screenshot, you are using Refined for Jira.

 

"Create issue" screen - you really need to track the change event. But the portal has a problem that stands above - the initialization of your js.

The latest version of the plugin allows you to implement such dynamics without writing JavaScript at all: https://jibrok.com/docs/message-field/dynamic-templates/

 

#set($cfSelect = 10302)
#set($text = "[YOUR DOWNLOADLINK WILL BE SHOWN HERE AFTER SELECTING A MODULE]")#set($href = "https://www.website")

#if($cfValues.getFromForm($cfSelect))
#set($text = "https://www.website/downloads/dokumente/" + $cfValues.getFromForm($cfSelect).value.replace(" ", "_").replace("/", "_"))
#set($href = "https://www.website/downloads/dokumente/" + $cfValues.getFromForm($cfSelect).value.replace(" ", "_").replace("/", "_"))
#end

<p1>Please download the following document:</p1>
<br>
<a id="text" href="$href">$text</a>
<br>
<p2> and attach it to your issue.</p2>

 

Screenshot how to set up. Note that you can manage the terms here: On which screens to display.

 

screencapture-localhost-2990-jira-secure-admin-jibrokMessageFieldSettingScheme-default-jspa-2021-01-25-12_10_43.png

And some final screenshots.

Create:

screencapture-localhost-2990-jira-plugins-servlet-desk-portal-1-create-1-2021-01-25-12_20_37.png

screencapture-localhost-2990-jira-plugins-servlet-desk-portal-1-create-1-2021-01-25-12_20_48.png

View:

screencapture-localhost-2990-jira-plugins-servlet-desk-portal-1-TEST-26-2021-01-25-12_21_27.png

Suggest an answer

Log in or Sign up to answer
TAGS
AUG Leaders

Atlassian Community Events