Support » Plugin: ACF Hide Layout » Not working with clone field

  • I called a collegue of you today and he said to me to put it here.

    We have set up the flexible content to be used on pages. We reuse this with a clone field on posts and other post-types. But it seems it doesn’t work on clone fields.

    Somewhere / somwhouw it doesn’t save / load the rows.

    I realy want to use this plugin, but at the moment I can’t because of this. Can you guys take a look at this?

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter R3dRidl3

    (@r3dridl3)

    I got a bit further, I looked into the problem and found out that the keys (field.data.key) needs to be different.
    So I got it this far working that it works in my situation. But when you use multiple flexible content fields I think it won’t work at the moment.

    Changed script.js:

    if(acf){
    
        window.acf.addAction( 'ready_field/type=flexible_content', function( field ) {
    		
    		var fieldKey = '';
    		
    		if(jQuery('.acf-flexible-content > input').attr('name').includes('_field_')){
    			//Clone field
    			var fieldKey = jQuery('.acf-flexible-content > input').attr('name').split('[');
    			fieldKey = fieldKey[fieldKey.length - 1];
    			fieldKey = fieldKey.substring(0, fieldKey.length - 1);
    		}
    		else{
    			//Base field
    			fieldKey = field.data.key;
    		}
    		
    		var hidden_layouts = window.acf_hide_layout_options.hidden_layouts[fieldKey];
    
    		// for each layout in the flexible field
    		field.$el.find( '.layout' ).each(function( i, element ) {
    			var $el = jQuery( element ),
    				$controls = $el.find( '.acf-fc-layout-controls' ),
    				index = $el.attr( 'data-id' ),
    				//name = 'acf[' + field.data.key + '][' + index + '][acf_hide_layout]',
    				name = jQuery('.acf-flexible-content > input').attr('name')+'[' + index + '][acf_hide_layout]',
    				in_array = -1 !== jQuery.inArray( index, hidden_layouts ),
    				is_hidden = in_array && 'acfcloneindex' !== index;
    
    			var $input = jQuery( '<input>', {
    				type: 'hidden',
    				name: name,
    				class: 'acf-hide-layout',
    				value: is_hidden ? '1' : '0',
    			});
    
    			var $action = jQuery( '<a>', {
    				'data-index': index,
    				'data-name': 'hide-layout',
    				href: '#',
    				title: window.acf_hide_layout_options.i18n.hide_layout,
    				class: 'acf-icon dashicons acf-hide-layout small light acf-js-tooltip',
    			});
    
    			$action.prepend( $input );
    			$controls.prepend( $action );
    
    			if ( is_hidden ) {
    				$el.addClass( 'acf-layout-hidden' );
    			}
    		});
    	});
    	
        jQuery( document ).on( 'click', '.acf-hide-layout', function() {
            var $el = jQuery( this ),
                $layout = $el.parents( '.layout' ),
                $input = $el.find( '.acf-hide-layout' ),
                value = $input.val(),
                newValue = value === '1' ? '0' : '1';
    
            $input.val(newValue);
            $layout.toggleClass( 'acf-layout-hidden', newValue );
        });
    }
    Thread Starter R3dRidl3

    (@r3dridl3)

    See github for completely working code.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Not working with clone field’ is closed to new replies.