JavaScript to Hide/Show Custom Field

[Ana Vier]

I have a javascript at a custom fields to hide/show the field based on another field value.

It works fine when I create an issue.

The problem is when I change the project or the issue type. When I do this it seems that I don't have a javascript.

One of the javascripts that I use is:

<script>
checkbox_11106_1 = document.getElementById('customfield_11106-1'); //New - Yes
checkbox_11106_2 = document.getElementById('customfield_11106-2'); //New - No

if (!checkbox_11106_1.checked){
	AJS.$("#customfield_11118").closest('div.field-group').show();
}
if (!checkbox_11106_2.checked){
	AJS.$("#customfield_11118").closest('div.field-group').hide();
	document.getElementById('customfield_11118').value = '';
}

checkbox_11106_1.onclick=function(){
	if (checkbox_11106_1.checked){
		AJS.$("#customfield_11118").closest('div.field-group').hide();
		document.getElementById('customfield_11118').value = '';
	}
};
checkbox_11106_2.onclick=function(){
	if (checkbox_11106_2.checked){
		AJS.$("#customfield_11118").closest('div.field-group').show();
	}
};
</script>

How can I resolve this problem?

[Ana Vier · Accepted solution]

Now it works. I'm using this script at the custom field

<script>
function newField(){
		if (document.getElementById('customfield_11106-1').checked){
			AJS.$("#customfield_11118").closest('div.field-group').hide();
			document.getElementById('customfield_11118').value = "";
		}
		if (document.getElementById('customfield_11106-2').checked){
			AJS.$("#customfield_11118").closest('div.field-group').show();
		}
	
		AJS.$('#customfield_11106-1').click(function(){
			if (document.getElementById('customfield_11106-1').checked){
				AJS.$("#customfield_11118").closest('div.field-group').hide();
				document.getElementById('customfield_11118').value = "";
			}
		});
		
		AJS.$('#customfield_11106-2').click(function(){
			if (document.getElementById('customfield_11106-2').checked){
				AJS.$("#customfield_11118").closest('div.field-group').show();
			}
		});
}
AJS.$(document).ready(function(){newField()});
AJS.$(document).bind('dialogContentReady', function(event, dialog){newField()});
JIRA.bind(JIRA.Events.NEW_CONTENT_ADDED, function(e,context){newField()});
newField();
</script>

And using this script at the announcement banner

<script type="text/javascript">
AJS.$("#create_link").removeClass("create-issue");
</script>

[Rex Cooper]

Hi Ana,

I am able to use your example script, but my JIRA hangs up when I create a project/issue type that does not have the two custom fields in the create screen. Can you help? Thanks

This is the script:

<script>

function newField(){

        if (document.getElementById('customfield_10201').value != 35){

            AJS.$("#customfield_11201").closest('div.field-group').hide();

            document.getElementById('customfield_11201').value = "";

        }

        if (document.getElementById('customfield_10201').value == 35){

            AJS.$("#customfield_11201").closest('div.field-group').show();

        }

        AJS.$('#customfield_10201').click(function(){

            if (document.getElementById('customfield_10201').value != 35){

                AJS.$("#customfield_11201").closest('div.field-group').hide();

                document.getElementById('customfield_11201').value = "";

            }

        });

        AJS.$('#customfield_10201').click(function(){

            if (document.getElementById('customfield_10201').value == 35){

                AJS.$("#customfield_11201").closest('div.field-group').show();

            }

        });

}

AJS.$(document).ready(function(){newField()});

AJS.$(document).bind('dialogContentReady', function(event, dialog){newField()});

JIRA.bind(JIRA.Events.NEW_CONTENT_ADDED, function(e,context){newField()});

newField();

</script>

[Rex Cooper]

Nevermind we Fix it. We added a Null for the value.

[Nadir MEZIANI]

Hi,

there is a lot of answer to questions like yours. among it this, you must just replace ids of your custom fields.

https://answers.atlassian.com/questions/264320/pop-up-a-user-picker-window

[Deleted user]

Hi Ana,

Maybe this modification fixes your problem:

<script>
(function($) {
    checkbox_11106_1 = document.getElementById('customfield_11106-1'); //New - Yes
    checkbox_11106_2 = document.getElementById('customfield_11106-2'); //New - No
     
    if (!checkbox_11106_1.checked){
        AJS.$("#customfield_11118").closest('div.field-group').show();
    }
    if (!checkbox_11106_2.checked){
        AJS.$("#customfield_11118").closest('div.field-group').hide();
        document.getElementById('customfield_11118').value = '';
    }
     
    checkbox_11106_1.onclick=function(){
        if (checkbox_11106_1.checked){
            AJS.$("#customfield_11118").closest('div.field-group').hide();
            document.getElementById('customfield_11118').value = '';
        }
    };
    checkbox_11106_2.onclick=function(){
        if (checkbox_11106_2.checked){
            AJS.$("#customfield_11118").closest('div.field-group').show();
        }
    };
})(AJS.$);
</script>

[Henning Tietgens]

For properly working javascript, you have to provide it as a web ressource plugin. See https://answers.atlassian.com/questions/287928/adding-javascript-to-hide-and-prefil-summary-while-creating-an-issue

Henning