Support

Account

Home Forums General Issues image upload button disappears after the image gets deleted from media library

Solving

image upload button disappears after the image gets deleted from media library

  • steps to reproduce:
    1. upload an image to CF
    2. go to media library
    3. delete the image
    4. go back to the post where image was uploaded to
    5. Upload buttons are missing (actually the’re not gone, but have display: none)

    ACF 5.1.5, WP 4.1

  • I’m having this same problem. The edit/delete buttons do not appear because they only show up when the image is hovered by the mouse. If the image is missing, the img tag has no height or width, so it is impossible for the edit/delete icons to appear.

    I have temporarily solved this by running some javacript that looks for ‘.acf-input .acf-image-uploader .show-if-value img’ elements with a missing src value and manually adds height and width which allows the user to hover over an empty box.

    Ideally, ACF would load a default image or broken image icon if an image is missing, or display the edit/delete/add image buttons if the image is broken.

  • Same problem for me. Is there a temporary fix for this, what code did you use to get this working?

  • I am having the same issue.

    @eterps is there any chance you could post that javascript snippet you added to your function file? It would be greatly appreciated.

  • I was hesitant to post this because it’s very hacky and definitely does not substitute for a proper solution in the core of ACF, but it *works for me*. I make no guarantees for you, as it may completely blow up your site and ruin your life forever. You’ve been warned.

    Also, this javascript is only loaded on edit pages in the admin section with wp_enqueue_script().

    $('.acf-field-image .acf-image-uploader .show-if-value img').each(function(){
        var $el = $(this);
        var src = $el.attr('src');
        if ( src === '' || !src ) {
            $el.height('10px');
            $el.width('10px');
        }
    });
  • Adding the following css to the backend seems to work for me;

    .acf-image-uploader .view {
    		  width: 150px;
    		  height: 150px;
      		  background-color: #dddddd;

    As @eterps says…

    I make no guarantees for you, as it may completely blow up your site and ruin your life forever. You’ve been warned.

  • When editing your page, you can also type this in your console :

    jQuery('.acf-button-delete').click();

    It will trigger a fake click on **every** delete button on image fields. Dont’ worry it won’t delete anything, just cancel the selection of the image that, you know, you can’t do anymore because the link is invisible… So you might select again other image fields.

    But if you are comfortable with debug tools, you can precise which field to apply the hack this way :

    jQuery('[data-field_key="field_54ca1472acea6"] .acf-button-delete').click();

    Hope this helps.

  • Looks like there’s a GitHub Issue for this too: https://github.com/elliotcondon/acf/issues/377

    I made a pull request here that should fix it: https://github.com/elliotcondon/acf/pull/379

    It’s quite a simple fix, so please rally with me to pull the change in! 😀

  • I have just had this issue, having deleted some images from the upload folder a couple of image boxes simply didn’t have the upload option. On Chrome I went in to the inspector and found the div/css for ‘.acf-image-uploader .no-image’ – this was set to display:none; – I just unticked the property and the option to upload an image came back, uploaded the image and happy days, everything was back up and running as normal. Worked for me, Hope this helps in some way…

  • I just had this issue today as well. The postmeta database table was still holding the post ID for the images that were being pointed to, which is why the button wouldn’t appear. I also did what slunt32 did, but it screwed up for me. So I just popped into MySql and ran an update on my meta_key to set it to ”. After that, it was fine.

    If anyone could bother, you could always write …. ah, I just read acobster’s fix. Yeah, you could do that. Check the post id in the post_meta to see if the attachment url actually points to a media file.

    Potato of Fortune,

    Potato

  • Please Try this one guys.

    
    
    function create_field( $field )
    	{
    		// vars
    		$o = array(
    			'class'		=>	'',
    			'url'		=>	'',
    		);
    		
    		if( $field['value'] && is_numeric($field['value']) )
    		{
    			$url = wp_get_attachment_image_src($field['value'], $field['preview_size']);
    			
    			if( $url !== false ) {
    				$o['class'] = 'active';
    				$o['url'] = $url[0];
    			}
    		}
    
    

    “Edit this function as above. path is : core/fields/image.php “

  • Hey,

    This issue has already been logged and will be fixed in an upcoming update. In the meantime, the fixes contributed above should work fine.

    Cheers.

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

You must be logged in to reply to this topic.