Add an editable field as web panel with ScriptRunner

[Philipp Schulze]

Hello together,

I used the example from https://scriptrunner.adaptavist.com/latest/jira/fragments/WebPanel.html to add a custom field with its value to Jira in a custom web panel.

That works quite good and the RendererManager is used to render the content correct.

But the field value is currently read only. The default fields from Jira have a "pen symbol" after the value to edit the value directly. Is it possible to generate an editable field within the web panel created with ScriptRunner?

Thanks for your help and best regards

Philipp

[Philipp Schulze · Accepted solution]

I have now found a solution myself, for your information if someone else can use it:

import com.atlassian.jira.component.ComponentAccessor
import com.atlassian.jira.issue.Issue
import com.atlassian.jira.issue.RendererManager

def issue = context.issue as Issue
String customfield = "customfield_13923"

def rendererManager = ComponentAccessor.getComponent(RendererManager)
def fieldLayoutItem = ComponentAccessor.getFieldLayoutManager().getFieldLayout(issue).getFieldLayoutItem(customfield)
def renderer = rendererManager.getRendererForField(fieldLayoutItem)
String value = issue.getCustomFieldValue(ComponentAccessor.getCustomFieldManager().getCustomFieldObject(customfield))

writer.write("<div id='" + customfield + "-val' class='field-ignore-highlight editable-field inactive' title='Click to edit'>" + 
"<div class='user-content-block'>" +
renderer.render(value, issue.getIssueRenderContext()) +
"</div>" + 
"</div>")

See also: https://community.atlassian.com/t5/Answers-Developer-Questions/How-do-I-enable-inline-editing-on-fields-in-custom-web-panels/qaq-p/501812

Update 2020-06-16: issue.getIssueRenderContext() added as render context (instead of null).

[mattdgray]

This doesn't work for me unless the field is on the edit screen for the issue, is that what you're doing here? 
I'd really like to make this work without requiring the field be on the edit screen, but I can't figure out where to begin with the javascript that seems to be required to do so. 

[Philipp Schulze]

Hi mattdgray,

You are right. The field must be configured to be viewable at least for the "create issue" / "edit issue" operation ("view issue" works probably as well).

If the field is not visible in the "edit issue" screen, you will not be able to enter any data to the field because Jira default behaviour is to hide empty fields in the "view issue" screen.

Nevertheless if you will find a solution, please let me know it here.

[Dino Carreon]

I can't picture why you want to display the value of a custom field in a web panel. I'm interested to see a screenshot of the output. 

[Philipp Schulze]

Hi Dino,

of course, you can use the regular custom field layout as well.

We positioned in our case two special custom fields "error description" (Fehlerbeschreibung) and "error solution" (Fehlerlösung) more visible than the other custom fields.

See also the attached screenshot:

[Dino Carreon]

Thank you for sharing your use case!

[Jordan McCombs]

Hey Philipp, 

How did you get the panels to add under the description? When I'm looking at the Location drop down, I'm only seeing alt.jira.view.issue.right.context, left context, etc. 

[Jason K]

Hi @Jordan Mccombs, in my Server version of Jira, atl.jira.view.issue.left.context puts the panel in the left column (there are only left and right), then you adjust the "weight" to move it up and down. 

This may be because we use several plugins that add panels, but a weight of 500 put it between "Issue Links" and "Activity".  0 put it right at the top, and null put it right at the bottom. 

[nkante]

Hi @Philipp Schulze 

small update on that

import com.atlassian.jira.component.ComponentAccessor
import com.atlassian.jira.issue.Issue
import com.atlassian.jira.issue.RendererManager

def issue = context.issue as Issue
String customfield = "customfield_XXXXX"
String hint = "<em>Click to add acceptance criteria</em>"

def rendererManager = ComponentAccessor.getComponent(RendererManager)
def fieldLayoutItem = ComponentAccessor.getFieldLayoutManager().getFieldLayout(issue).getFieldLayoutItem(customfield)
def renderer = rendererManager.getRendererForField(fieldLayoutItem)
String value = issue.getCustomFieldValue(ComponentAccessor.getCustomFieldManager().getCustomFieldObject(customfield))
String renderedField = renderer.render(value, issue.getIssueRenderContext())

if (!renderedField.empty) {
 hint = ""
}

writer.write("<div id=\"" + customfield + "-val\" class=\"field-ignore-highlight editable-field inactive\" title=\"Click to edit\" style=\"margin: -2px 0 0 -5px; width: 100%;\">" + 
"<div class=\"user-content-block\">" +
renderedField +
hint +
"</div><span class=\"overlay-icon aui-icon aui-icon-small aui-iconfont-edit\"></span>" + 
"</div>")

I adopted your script and made small changes. So I can copy the behaviour from the default description field.

In addition you need to make sure, that you remove the custom field, in my case Acceptance criteria, from the view screen, but you need to have it on the edit field screen (and probably on the create screen as well, if you want)

It is important that this is not showing on the view screen, to prevent the rendering twice! Twice rendering leads to the behaviour that this field is not enabled for inline editing for the initial rendering

[pasquale.scandurra]

Hi nkante,

I managed to apply your script in my Jira instance.

However what I'm trying to achieve is adding the name of the custom field before its value. Is there a way to do that?

My final aim is to add a new web panel where more custom fields can be showed and edited.

The reason is that I have many custom fields and I'd like to group them to improve the issue readability.

Thank you in advance for your help.

Pas