Print

Show input field on radio select

Show input field on radio select

  • Published by
    Robert Stark
  • Last modified
    30 September 2021
  • Voting
    Average rating
    3 votes
  • Favourites
  • Concerns
    Component Template
  • Since Version
    3.X
  • Up to date
    Yes
  • Profile concerned
    Webdesigner, Developer

I wanted a way when admins click "other", then the hidden field would show
('Other Job Title'):
Explanation

We have 2 fields:

  • Job Title - Radio Field | ID = 70 |  Field alias: job_title
  • Other Job Title - Text Field | ID = 101 |  Field alias: other_job_title

Radio Field

In your FLEXIcontent Type Item Form (add the following):

//HIDE OTHER JOB FIELD
   
$('#label_outer_fcfield_101, #container_fcfield_101').hide();
 
    //RADIO FIELDS NAME
   $('input[name="custom[job_title][0]"]').change(    function() {      
       
    //RADIO OTHER VALUE 
    if (this.checked && this.value == 'other') {      
        $('#label_outer_fcfield_101, #container_fcfield_101').show();     
    }
    else {      
        $('#label_outer_fcfield_101, #container_fcfield_101').hide();      
        $('#container_fcfield_101 input').val('');     
    }    
});
 
//ON OPEN/LOAD
if ($('input#custom_job_title_0_2').is(':checked') == true) {   
    $('#label_outer_fcfield_101, #container_fcfield_101').show(); 
}

Here's an image shot of this:
Explanation

Finally - I used the following code in my item template to get it to work:

Here's an image shot of this:
Explanation

Finally - I used the following code in my item.php template to get it to work:

$job_title = '';
FlexicontentFields::getFieldDisplay( $item, "job_title", null, 'display', 'item' );
FlexicontentFields::getFieldDisplay( $item, "other_job_title", null, 'display', 'item' );
$job_title = $item->fields[ "other_job_title" ]->display;
if ( $job_title == '' ) {
$job_title = $item->fields[ "job_title" ]->display;
}
echo $job_title;
  
//ONLOAD - choose the unique other value if ($('input#custom_job_title_0_2').is(':checked') == true) { $('#label_outer_fcfield_101, #container_fcfield_101').show(); } or if ($('.fcfieldval_container_70 input[value="other"]').is(':checked') == true) { $('.control-group#id-101').show(); }
Save
Cookies user preferences
We use cookies to ensure you to get the best experience on our website. If you decline the use of cookies, this website may not function as expected.
Accept all
Decline all
Essential
These cookies are needed to make the website work correctly. You can not disable them.
Display
Accept
Analytics
Tools used to analyze the data to measure the effectiveness of a website and to understand how it works.
Google Analytics
Accept
Decline