It's not the same without you

Join the community to find out what other Atlassian users are discussing, debating and creating.

Atlassian Community Hero Image Collage

How to make a text field required once a checkbox is checked?

Warren McInnes Mar 13, 2013

How do i make a text field required once a check is checked?

Emergency

[ ] NO(unchecked)

[/] Yes(checked)

if checked, textfield(255 characters)

Reason:

must become required? and preferably hidden if check box is unchecked?

Can anyone assist?

9 answers

1 accepted

2 votes
Answer accepted
Rambanam Prasad Jul 22, 2013

i have modified little bit so try with this

<script type="text/javascript"> 
jQuery(document).ready(function($) {   
JIRA.bind(JIRA.Events.NEW_CONTENT_ADDED, function (e, context) {   
    callHideShowFunction();
});
callHideShowFunction();
function  callHideShowFunction(){
        showHideReason();
        $("#customfield_11704").closest('div.field-group').hide(); 
        $('input:radio[name=customfield_11911]').click(function() {
            showHideReason();
        });
            //the following event will work on only create screen
            $('#create-issue-submit, #issue-create-submit').click(function() {
				var emergencyImpl=$('input[name=customfield_11911]:checked + label').text();
                var reasonValue=$("#customfield_11704").val();
                if( emergencyImpl =='Yes' && ( reasonValue == '' ||  reasonValue == ' ') ){
                alert("Please enter Reason");
                return false;              
                }                 
              });    
		
		
}
    function showHideReason(){         
        var emergencyImpl=$('input[name=customfield_11911]:checked + label').text();     
        if( emergencyImpl == "Yes" ){
            $("#customfield_11704").closest('div.field-group').show();			
        }else {
            $('#customfield_11704').val('');
            $("#customfield_11704").closest('div.field-group').hide();			
        }
		  		
    }
});
</script>

Warren McInnes Jul 22, 2013

This works perfectly, Thank you so much for your great efforts!

Rambanam Prasad Jul 22, 2013

glad to hear it worked finally :)

Cheers!!!

0 votes
Udo Brand Mar 13, 2013

There is a similar question, please see here

Warren McInnes Mar 13, 2013

I saw that one, but no direct answer?

0 votes
Joseph Pitt Community Leader Mar 13, 2013

One workaround is to put 2 transitions after the step the box would be checked. On one check to see if the box is checked and if it is show that transition and require the field on the transition. Show the other transition is the box isn't checked and don't require a value for the field. There may be a plug-in, perhaps the behavior one, that would enforce this so you should check for that, but you can't out of the box.

0 votes
Warren McInnes Jul 21, 2013
0 votes
Rambanam Prasad Jul 21, 2013

try with this

<script type="text/javascript">  
jQuery(document).ready(function($) {
	JIRA.bind(JIRA.Events.NEW_CONTENT_ADDED, function (e,context) {
		checkBoxFunction();
	});
	checkBoxFunction();
	
function checkBoxFunction(){				
			showorhidefields(); 
			//assume 4 checkbox there with name  'customfield_11705'
		$("#customfield_11705-1,#customfield_11705-2").click(function() {
			showorhidefields(); 
		});	
	
		
	}
function showorhidefields(){
	alert("inside function");
	var checkedCheckboxes = $("input:checkbox[name=customfield_11705]:checked");		
			$("#customfield_11704").closest('div.field-group').hide();		
		checkedCheckboxes.each(function () {
				var selVal=$(this).next("label").text();
				alert("selVal: "+selVal);				
				if(selVal == 'Yes'){					
					$("#customfield_11704").closest('div.field-group').show();	
				}else {
					$('#customfield_11704').val('');
					$("#customfield_11704").closest('div.field-group').hide();
				}				
				
			});
		}	
		

	});
</script>

Warren McInnes Jul 21, 2013

I'll give this a try, Thanks

Warren McInnes Jul 21, 2013

Ok so this didn't work, It for some reason effected the custom fields page in admin mode by cutting off everything below "Emergency Implementation" customfield and did not effect the issue create screen at all? Do you know why?

Rambanam Prasad Jul 21, 2013

i updated the answers and dont't forget to add this on field description in field configuration scheme

0 votes
Rambanam Prasad Jul 21, 2013

following script is for to make text field mandatory if checkbox checked as Yes

<script type="text/javascript">  
jQuery(document).ready(function($) {
	JIRA.bind(JIRA.Events.NEW_CONTENT_ADDED, function (e,context) {
		checkBoxFunction();
	});
	checkBoxFunction();
	
function checkBoxFunction(){				
			showorhidefields(); 
			//assume 4 checkbox there with name  'customfield_11705'
		$("#customfield_11705-1,#customfield_11705-2").click(function() {
			showorhidefields(); 
		});	
	
		
	}
function showorhidefields(){
	alert("inside function");
	var checkedCheckboxes = $("input:checkbox[name=customfield_11705]:checked");		
			$("#customfield_11704").closest('div.field-group').hide();
	var flag==false;			
		checkedCheckboxes.each(function () {
				var selVal=$(this).next("label").text();
				alert("selVal: "+selVal);				
				if(selVal == 'Yes'){					
					$("#customfield_11704").closest('div.field-group').show();	
					flag=true;
				}else {
					$('#customfield_11704').val('');
					$("#customfield_11704").closest('div.field-group').hide();
					flag=false;
				}				
			});
			// use the following line if you want to make it work on all screens
			//$('#issue-workflow-transition-submit, #create-issue-submit, #issue-create-submit, #edit-issue-submit, #issue-edit-submit').click(function() {
			//the following event will work on only create screen
			$('#create-issue-submit, #issue-create-submit').click(function() {
				var reasonValue=$("#customfield_11704").val();
				if( flag && reasonValue == '' && reasonValue == ' '){
				alert("Please enter Reason");
				return false;				
				}
				
				});
			
			
		}	
		

	});
</script>

0 votes
Rambanam Prasad Jul 22, 2013

to make reason field mandatory when radio button selected as yes

<script type="text/javascript"> 
jQuery(document).ready(function($) {   
JIRA.bind(JIRA.Events.NEW_CONTENT_ADDED, function (e, context) {   
    callHideShowFunction();
});
callHideShowFunction();
function  callHideShowFunction(){
        showHideReason();
        $("#customfield_11704").closest('div.field-group').hide(); 
        $('input:radio[name=customfield_11911]').click(function() {
            showHideReason();
        });
}
    function showHideReason(){         
        var emergencyImpl=$('input[name=customfield_11911]:checked + label').text();
     var flag=false;
        if( emergencyImpl == "Yes" ){
            $("#customfield_11704").closest('div.field-group').show();
			flag=true;
        }else {
            $('#customfield_11704').val('');
            $("#customfield_11704").closest('div.field-group').hide();
			flag=false;
        }
		
		  // use the following line if you want to make it work on all screens
            //$('#issue-workflow-transition-submit, #create-issue-submit, #issue-create-submit, #edit-issue-submit, #issue-edit-submit').click(function() {
            //the following event will work on only create screen
            $('#create-issue-submit, #issue-create-submit').click(function() {
                var reasonValue=$("#customfield_11704").val();
                if( flag && reasonValue == '' && reasonValue == ' '){
                alert("Please enter Reason");// change alert message as per your requirement
                return false;              
                }
                 
                });            
             
        });   
		
    }
});
</script>

Warren McInnes Jul 22, 2013

This code does not work, reason field is now visable always on issue create screen always and not Required/Manditory?

Warren McInnes Jul 22, 2013

This code has worked the best so far:

<script type="text/javascript">  
jQuery(document).ready(function($) {    
JIRA.bind(JIRA.Events.NEW_CONTENT_ADDED, function (e, context) {    
    callHideShowFunction();
});
callHideShowFunction();
function  callHideShowFunction(){
        showHideReason();
        $("#customfield_11910").closest('div.field-group').hide();  
        $('input:radio[name=customfield_11911]').click(function() { 
            showHideReason();
        });
}
    function showHideReason(){          
        var emergencyImpl=$('input[name=customfield_11911]:checked + label').text();
     
        if( emergencyImpl == "This is an emergency implemetation" ){ 
            $("#customfield_11910").closest('div.field-group').show();
        }else {
            $('#customfield_11910').val('');
            $("#customfield_11910").closest('div.field-group').hide();
        }
    }
});
</script>

0 votes
kumar Oct 17, 2018

Hi @Rambanam Prasad @Warren McInnesI have the same task that i have to do can you please tell me how it worked for you here is my situation

I have field called "Source" select list (single choice) type custom field

in that i have added options A,B,C,D&Other.

Now when i select the option D and Other . A text field has to view on create and edit screen when i select the A,B,C that text field suppose to hide

could you explain me  guys step by step  how can I achieve this .

 

Thanks,

Phani

Suggest an answer

Log in or Sign up to answer
This widget could not be displayed.
This widget could not be displayed.
Community showcase
Published in Next-gen

Introducing subtasks for breaking down work in next-gen projects

Teams break work down in order to help simplify complex tasks. This is often done iteratively, with tasks being broken down into smaller tasks and so on until the work is accurately captured in well-...

2,140 views 14 17
Read article

Community Events

Connect with like-minded Atlassian users at free events near you!

Find an event

Connect with like-minded Atlassian users at free events near you!

Unfortunately there are no Community Events near you at the moment.

Host an event

You're one step closer to meeting fellow Atlassian users at your local event. Learn more about Community Events

Events near you