J tricks - Little JIRA Tricks
  • Home
  • Plugins ↓
    • JQL Tricks Plugin
      • JQL Tricks Plugin - Cloud
        • JQLT Cloud Installation
        • JQLT Cloud Configuration
        • JQLT Cloud Usage
        • JQLT Cloud License
        • JQLT Cloud FAQ
      • JQL Tricks Plugin - DC
        • JQLT DC Installation
        • JQLT DC Configuration
        • JQLT DC Usage
          • JQLT Issue Functions
          • JQLT Subtask Functions
          • JQLT Links Functions
          • JQLT Development Functions
          • JQLT Worklog Functions
          • JQLT Project Functions
          • JQLT Component Functions
          • JQLT Version Functions
          • JQLT Group Functions
          • JQLT User Functions
          • JQLT Date Functions
        • JQLT DC License
        • JQLT DC FAQ
        • JQLT DC Known Issues
        • JQLT DC Performance
      • JQL Tricks Cloud Migration
    • Simplified Planner
      • J-Planner Installation
      • J-Planner Configuration
      • J-Planner Usage
        • Creating a plan
        • Editing a plan
        • Deleting a plan
        • Viewing a plan
        • Modifying a plan
      • J-Planner FAQ
    • Atla-Search Plugin
      • Atla-Search Installation
      • Atla-Search Configuration
      • Atla-Search Usage
      • Atla-Search License
      • Atla-Search FAQ
    • Copy to subtask Plugin
    • All Plugins
  • Tutorials
  • The Book
  • Contact Us
  • Home
  • Plugins ↓
    • JQL Tricks Plugin
      • JQL Tricks Plugin - Cloud
        • JQLT Cloud Installation
        • JQLT Cloud Configuration
        • JQLT Cloud Usage
        • JQLT Cloud License
        • JQLT Cloud FAQ
      • JQL Tricks Plugin - DC
        • JQLT DC Installation
        • JQLT DC Configuration
        • JQLT DC Usage
          • JQLT Issue Functions
          • JQLT Subtask Functions
          • JQLT Links Functions
          • JQLT Development Functions
          • JQLT Worklog Functions
          • JQLT Project Functions
          • JQLT Component Functions
          • JQLT Version Functions
          • JQLT Group Functions
          • JQLT User Functions
          • JQLT Date Functions
        • JQLT DC License
        • JQLT DC FAQ
        • JQLT DC Known Issues
        • JQLT DC Performance
      • JQL Tricks Cloud Migration
    • Simplified Planner
      • J-Planner Installation
      • J-Planner Configuration
      • J-Planner Usage
        • Creating a plan
        • Editing a plan
        • Deleting a plan
        • Viewing a plan
        • Modifying a plan
      • J-Planner FAQ
    • Atla-Search Plugin
      • Atla-Search Installation
      • Atla-Search Configuration
      • Atla-Search Usage
      • Atla-Search License
      • Atla-Search FAQ
    • Copy to subtask Plugin
    • All Plugins
  • Tutorials
  • The Book
  • Contact Us

Silly Javascript hacks! or is it?

9/3/2012

40 Comments

 
Recently I came across a simple requirement and saw an exaggerated estimate for that. Well, it isn't all that rare but I was amused how a different line of thought can make all the difference in the world!

Requirement : Make a field mandatory in the workflow screen and make sure the mandatory icon is present on screen.

Now the first part is pretty easy. Write a workflow validator which makes the field required. Actually, I just bluffed! You don't even need to write one because the JIRA Suite Utilities plugin already boasts of one, with a number of additional useful stuff. I will use that, any day of the week!

The second part, to show the mandatory icon, is what prompted me to write this. I saw a few number of hours estimated alongside this and I knew immediately that it was a mistake. Because it is cases like this that makes the javascript hacks "worth a hack"!

Few minutes later, the screen that looked like this:
Picture
looked like this:
Picture
And all that was needed was this simple javascript:

<script type="text/javascript">
AJS.$("#customfield_11300").parent().children('label').append('<span class="aui-icon icon-required"></span>');
</script>

And then, I searched the forum to answer a question that was asked in the past about this, only to realize that Jamie had this solution implemented before even someone thought about it!

Well, what the heck? If it was worth a hack, it is worth sharing. Ain't it? ;)

UPDATE:

There was an interesting question on the comments section. How do we limit it for a particular transition screen? All you need to do is to add the extra check for transition value (action id). Something like this:


<script type="text/javascript">
if (AJS.$("#issue-workflow-transition input[name=action]").val()=='5'){   AJS.$("#customfield_11300").parent().children('label').append('<span class="aui-icon icon-required"></span>');
}
</script>
40 Comments
webwesen
9/5/2012 03:31:38 am

should there be an asterisk between your <span> tags? thanks

Reply
J-Tricks
9/5/2012 05:07:28 am

Well, not really. But you are right, the span class was missing :) HTML messup but fixed now. Thanks for reporting.

Reply
Matt Doar link
9/7/2012 10:05:50 am

Might want to add that the JavaScript goes in the field's description. And it won't work in a staging instance if the custom field ids change.

But nice hack!

Reply
J-Tricks
9/7/2012 10:23:42 am

Both valuable points :)

Reply
DIPTI RANJAN BEHERA
9/10/2012 10:35:17 pm

Hi,

A very good hack.
But if in another transition I don't want this field to be mandatory , will it have the mandatory icon.

Reply
J-Tricks
9/11/2012 01:43:30 am

You will have to do some additional checking to find the transition. It must be on the page.

Reply
J-Tricks
9/11/2012 10:28:08 am

Just added it as an update in the blog. Hope it helps.

Reply
Kapil
12/12/2012 04:26:49 pm

Hi Jtricks,
Thanks
The above script is working for Text fields & Select Fields.

I wanted to add mandatory icon for User Customfield, the above script doesn't work for it.
Please let me know , how we can have it for user customfield.

Reply
J-Tricks
12/13/2012 02:55:09 am

You need to go one more level up for user custom field.

Use AJS.$("#customfield_12345").parent().children('label').append instead of AJS.$("#customfield_12345").parent().parent().children('label').append

Reply
J-Tricks
3/7/2013 02:11:44 am

Actually, I meant the reverse!

kite
2/18/2013 08:31:17 pm

Need to add * for Free Text Field

Reply
J-Tricks
2/19/2013 12:42:47 am

Same process. Use the appropriate custom field id.

Reply
mim dal
2/23/2013 07:10:39 pm

I'm sorry for asking question here, but It seems that you are professional in jira.

I change calendar javascript to Hijri, But another problem comes up. It seems that a class (DueDateValidator.class) try to validate input date, while the number of days in month is different to georgian calendar. for example we have 31 days in second month of year but in georgian (february) it is 28 or 29.

Is it possible to change or disable Date validator in jira?

Reply
J-Tricks
2/24/2013 06:14:47 am

You will have to raise it with Atlassian themselves.

Raise a ticket at https://jira.atlassian.com or at https://support.atlassian.com if it is urgent and you have a valid license.

Reply
Elke
3/7/2013 12:09:19 am

Is it possible to add this * also to Checkbox Fields?
I tried the described javascript but it doesn't work.

Best Regards
Elke

Reply
Adnan
11/11/2013 09:49:16 pm

i had the custom field with the name of "testCF" and run the above script into the announcement banner but it didn't work. please guide me the proper procedure how to run the script in detail.

Thanks

Reply
J-Tricks
11/15/2013 08:37:37 am

Did you change the custom field ids to match what you have? What is the version of JIRA? And what type of a field is it?

Reply
Zeeshan
11/19/2013 10:54:04 pm

Hi,

What do we need to substitute in [#issue-workflow-transition input[name=action]").val()=='5'] for our custom transition? What should be the 'name' and where to fine the .val() == '?'.
Please help.

Reply
J-Tricks
11/21/2013 11:13:26 am

You just need to replace the action id with your custom transition id. name is always action. You can find the transition id when you go to the "text" view of the workflow. It is the unique number alongside the transition.

Reply
Adnan
11/28/2013 06:18:29 pm

My JIRA default field "Due Date" is mandatory in some of my workflow screens and optional in few screens, how i can change in script which can work only in particular screens which is mandatory due to workflow validator.

Reply
J-Tricks
11/29/2013 12:52:30 am

The last snippet tells you how to add the icon based on workflow transition id. That should work for you in this case. Find the workflow transition id and use it in the script instead of '5'.

Reply
Lanthanide
3/5/2014 12:01:42 pm

I'm trying to do this for a field on the Create Issue transition, which appears to have a transition ID of 1, but this method doesn't work? What I'm really wanting is to pre-populate a user picker field with the current user when they create the issue (but also allow them to over-ride that value with someone else if they want).

Works fine for all other transitions I've tried it on, just not Create Issue. Any idea?

Reply
J-Tricks
3/6/2014 02:40:53 pm

Do you mean the Create screen?

Can you check after wrapping it between this?

JIRA.bind(JIRA.Events.NEW_CONTENT_ADDED, function (e, context) {
.... //Above code goes here
});

Reply
Lanthanide
3/11/2014 09:27:32 am

Your proposed code originally looked like it was working, but ultimately it caused issues not to load properly.

I then had a brainwave - the reason it can't find that particular object with an ID of 1, is because (for some reason) the Create Issue screen doesn't have that object, whereas all other screens did.

So I went with this and it works!
if (!AJS.$("#issue-workflow-transition input[name=action]").val()) {
AJS.$("#customfield_10617").parent().siblings('label').append('<span class="aui-icon icon-required"></span>');
document.getElementById('customfield_10617').value = getCurrentUserName();
}

J-Tricks
3/11/2014 04:30:08 pm

Nice. Thanks for sharing!

Cyndy link
1/11/2015 07:43:00 am

Thanks for the info - I'm a novice javascripter so I'm not sure how to plug the data from our custom field into this? My custom field is named 'Resolution Type' and my transition ID is 21. do I need to find the corresponding value in my env for "customfield_11300"?

Reply
J-Tricks
1/12/2015 02:48:32 am

Yes, you can get the id from database or find it in the url when you edit the custom field (or configure it)

Reply
David
2/13/2015 07:18:39 am

Hi, I'm unable to get the icon to show on the create screen. I am able to get the icon on the close screen. I saw some comments above about this but am unable to make it work. Have any suggestions? Thanks!

Reply
J-Tricks
2/17/2015 12:49:08 am

Depending on the field, some adjustments might be needed (similar to the user custom field example in one of the comments). Check the dom and make sure you are adding it at the right place.

Reply
Cynthia
3/10/2015 06:18:45 am

I'm trying to do this trick for fix version/s. However it is not a custom field it is a Field Layout Item.
Any advice?

Reply
J-Tricks
3/10/2015 02:43:50 pm

The trick is to find out the element from DOM and work towards the label of that field. if you peek into the DOM using firebug or something, you can find the element details. It should work even for standard fields.

Reply
Jason
6/26/2015 05:30:37 am

I don't want to continue to beat a dead horse here, but I am trying to set a custom field as required in my workflow and I don't get any changes at all. I plugged in the following into the description field for the custom field:
<script type="text/javascript">
if (AJS.$["#issue-workflow-transition input[name=action]").val()=='31']
{
AJS.$("#customfield_10520").parent().parent().children('label').append('<span class="aui.icon icon-required"></span>');
}
</script>
My transition ID is 31 and my custom field ID 10520. It is a user picker field. Is there anything that has to be installed or changed to get the system to recognize this script?

Thanks in advance1

Reply
J-Tricks
7/16/2015 03:59:53 am

User fields are slightly different in the DOM. Have you tried AJS.$("#customfield_12345").parent().children('label').append as mentioned in one of the comments?

Reply
Lanthanide
7/16/2015 09:38:05 am

Atlassian, in their infinite wisdom, in the 6.2 Jira upgrade stopped Javascript from being executed when it is in the description of a User Picker field. They say that this will become the default case for all fields, probably in Jira 7.0. This will of course break all of these tricks, so hopefully they will provide an alternative workaround if and when they do make such a change.

All other filed types still execute javascript in their descriptions, though. So try putting that javascript into another field description that appears on the same screen (hint: the Comment field appears on all screens except Create by default).

Reply
Arasu
10/27/2016 02:21:39 pm

Hi Team,

If i use below code in Jira 6.x Its shows * symbol but same code is not working in Jira 7.x

<script type="text/javascript">
AJS.$("#customfield_14217").parent().parent().children('label').append('<span class="aui-icon icon-required"></span>');
</script>

Thanks,
Arasu

Reply
Manuel
11/7/2016 03:06:02 am

Hi,
nice hack. Is there a way to implement it more general?

As is understand, i need to put this script in every custom field i'm using mandatory on a screen.

Also i can't put it into the custom field description if this field is used in several screens. I need to create a Field-Configuration-Screen and must edit every custom field.

I've seen a information about the behavior plugin, this should add asterisk automaticaly with the function "use validator plugin". But the plugin is still not available.

Any news here to create asteriks automaticyly with Jira Suite?

Regards,

Manuel

Reply
J-Tricks
11/10/2016 08:55:02 pm

It is javascript and all you need to do is to get it on the screen somehow. Following are the options, with 1 being the recommended one.

1. Create a plugin that injects the javascript into the appropriate page contexts. See Web resource plugin module for details.
2. Add the javascript on announcement banner. This makes it available on all screens, even on the ones that are not applicable
3. Add the javascript on the field descriptions as mentioned in this tutorial.

In cases 2 and 3, you need to include all applicable custom fields in the javascript you are writing.

Reply
Aravindi
9/4/2017 02:28:25 am

Hello,
Just wondering if we can use this for JIRA service desk requests forums as well?
The current customer request forum is just mentioning (optional) near optional fields.

Thanks! :)

Reply
J-Tricks
9/4/2017 08:19:27 am

I haven't tried it but it javascript hacks were not allowed on JIRA Service desk forms. There are a few add-ons that allow it now but I haven't tried any of those yet.

Reply
Nicholas
9/25/2017 11:15:58 pm

Any idea how to get this to work in JIRA 7.x.x? I havnt done javascript in several years and am also relatively new to JIRA (about a year). Also do you have a preferred resource for using javascript for JIRA specifically?

Reply

Your comment will be posted after it is approved.


Leave a Reply.

    Enter your email address:

    Author

    Jobin Kuruvilla - Works in Adaptavist as Head of DevOps Professional Services. 

    Author of JIRA Development Cookbook and JIRA 5.x Development Cookbook.


    RSS Feed

    Categories

    All
    Acive Objects
    Ajs
    Book
    Components
    Condition
    Custom Fields
    Customization
    Events
    Gadgets
    Javascript
    Jql
    Listener
    Mail
    Permissions
    Plugin Framework
    Post Function
    Properties
    Remote Invocation
    Reporting
    Rest
    Scheduled Tasks
    Search
    Services
    Soap
    Summit
    User Interface
    Validator
    Webwork Actions
    Workflow

    Archives

    October 2016
    August 2016
    March 2016
    January 2016
    December 2015
    May 2014
    December 2013
    November 2013
    July 2013
    June 2013
    April 2013
    October 2012
    September 2012
    August 2012
    July 2012
    May 2012
    March 2012
    February 2012
    January 2012
    December 2011
    November 2011
    June 2011
    May 2011
    April 2011
    March 2011
    February 2011
    January 2011
    November 2010
    October 2010
    September 2010
    August 2010

SUPPORT
APPS
TUTORIALS
THE BOOK
© J-Tricks