Support

Account

Home Forums Backend Issues (wp-admin) Tabs not working properly in Widgets

Solved

Tabs not working properly in Widgets

  • Hello! I am using some custom fields that are organised under tabs for widget. These do work, except that when you first open the widget, all fields show (rather than just the fields from the first tab).

    I’ve taken some screenshots to illustrate what I mean:

    http://imgur.com/a/zpMjf

    In the first screenshot, notice three tabs:

    • Content
    • Link
    • Design.

    The only fields that should show initially is “Title and Subtitle” but everythign is shwing.

    In the second image everythign is displaying correctly (notice I have clicked the Content tab, which hides all fields except title and subtitle).

    In other words, the first tab isn’t being selected by default when I first open the widget box. Instead, no tab is selected, causing everything to show. Is there a way I can force the first tab to show?

    It works fine on pages/posts, it’s only widgets that have this issue.

  • Hi @tomlongo

    Could you please share the JSON export of your field group so I can test it out in my installation?

    Thanks!

  • no worries, see attached!

    in case it helps I’m on WordPress v4.4.1.

    The Field Group is associated with a very simple custom widget that is essentially just an empty shell for ACF, here’s the code:

    <?php
    
    	class SECallToActionWidget extends WP_Widget {
    
    		public function __construct() {
    			parent::__construct(
    		 		'se_call_to_action_widget', 
    				'Call to Action', 
    				array( 'description' => 'Displays a call to action tile', ) 
    			);
    		}
    	
    
    		public function widget( $args, $instance ) {
    
    			extract($args);
    			// Loads theme file to handle ACF fields on front end
                include (THEME_FILE_PATH.'widget-call-to-action.php');			
    				
    		}
    	
    		public function update( $new_instance, $old_instance ) {
    		    $instance = $old_instance;		    
    		    return $instance;
    		}
    	
    	
    	}
    

    One other thing i notice is that if i do anything to the form that triggers js (such as selecting a “Link Type” radio button, which causes other fields to hide/show) the tabs then snap into action.

    So i’m guessing the JS that sets up the tabs is firing too early, or not at all, when the user expands a widget option box.

  • Hi @tomlongo

    It’s possible that there is a bug here (but I’m not too sure). Could you please open a new ticket over here: http://support.advancedcustomfields.com/new-ticket?

    As a workaround for now, you can click that that tab automatically using JQuery like this:

    function my_acf_admin_footer() {
    	?>
    	<script type="text/javascript">
    	(function($){
    
    		$( document ).ready(function() {
                $("a[data-key='field_56a41f5a113cb']").click();
            });
    
    	})(jQuery);
    	</script>
    	<?php
    }
    
    add_action('acf/input/admin_footer', 'my_acf_admin_footer');

    I hope this helps.

  • thanks mate, yes that workaround did the trick for the time being.
    I’ll post a ticket, thanks for the help!

Viewing 5 posts - 1 through 5 (of 5 total)

The topic ‘Tabs not working properly in Widgets’ is closed to new replies.