Image and File advanced JSON error if field is left blank

Support MB Blocks Image and File advanced JSON error if field is left blankResolved

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #39844
    ambrdigitalambrdigital
    Participant

    Hi Team,

    I am getting the following console error when using 'image_advanced' and or 'file_advanced' in MB Blocks.

    Uncaught (in promise) SyntaxError: Unexpected token '<', "<div id="e"... is not valid JSON

    I generate this console error if I leave these fields empty when adding content to other fields within the same block and will not save the content.

    However, it will save the content only if the 'image_advanced' and or 'file_advanced' fields are not empty.

    [
          'name'             => 'Image',
          'id'               => "{$prefix}image",
          'type'             => 'image_advanced',
          'force_delete'     => false,
          'max_file_uploads' => 1,
          'max_status'       => false,
          'image_size'       => 'thumbnail',
          'column'  => 'column-a'
    ],
    
    [
          'id'                => "{$prefix}mp4",
          'desc'              => 'Please keep the file size under 2Mb',
          'name'              => 'The background MP4 Video, this will override the cover image',
          'type'              => 'file_advanced',
          'max_file_uploads'  => 1,
          'mime_type'         => 'video/mp4',
          'column'  => 'column-1', 
          'visible' => [ "{$prefix}background_options", 'in', ['video' ] ],
        ],
    
    

    Cheers,
    Anthony

    #39888
    PeterPeter
    Moderator

    Hello,

    The problem happens when the line below is added to the field file_advanced settings

    'column' => 'column-1',

    Refer to the documentation https://docs.metabox.io/extensions/meta-box-columns/
    Did you register the columns under the meta box settings?

    #39903
    ambrdigitalambrdigital
    Participant

    Yes, the columns are registered. I tried removing them and still got the same response. Below is the complete code for creating the block. Also, note there is a function for a button that passes the vars to another meta box function and I still get the JSON error with or without this button function, however, I have commented it out for testing.

    Thanks.

    add_filter( 'rwmb_meta_boxes', 'gutenberg_meta_boxes_blocks' );
    function gutenberg_meta_boxes_blocks( $meta_boxes ) {
    
        $g_block_path = get_stylesheet_directory() . '/inc/meta-boxes/g-blocks/';
    
        require_once $g_block_path . 'g_block__fullwidth_w_bg__meta-box.php';
    
        return $meta_boxes;
    
    }
    $prefix = "g-block_";
    
    $meta_boxes[] = [
      'title'           => 'Fullwidth with background content block',
      'id'              => "fullwidth-w-bg-content-block",
      'description'     => 'Fullwidth with background content block',
      'type'            => 'block',
      'icon'            => 'cover-image',
      'category'        => 'layout',
      'keywords'        => ['call', 'action', 'cta', 'block'],
      'context'         => 'normal',
      'supports' => [
        'multiple' => true,
        'anchor' => true,
      ],
      'columns' => [
        'column-1' => 4,
        'column-2' => 8,
      ],
      'render_callback' => 'fullwidth_w_bg__g_block',
    
      'fields' => [
    
        [
          'type' => 'heading',
          'name' => 'Fullwidth with background content block',
        ],
    
        [
          'name'    => 'Content options',
          'id'   => "{$prefix}content_options",
          'type' => 'radio',
          'inline' => true,
          'options' => array(
            'text' => 'Text Blcok',
            'quote' => 'Quote',
          ),
          'column'  => 'column-2',
        ],
    
        [
          'type' => 'heading',
          'name' => 'Text',
          'column' => 'column-2',
          'visible' => [ "{$prefix}content_options", 'in', ['text' ] ],
        ],
        
        [
          'name' => 'Header',
          'desc' => 'Use <br> tags for text line breaks on larger screen sizes, they will be removed on smaller screen sizes.',
          'id'   => "{$prefix}header",
          'type' => 'textarea',
          'rows' => 2,
          'column' => 'column-2',
          'visible' => [ "{$prefix}content_options", 'in', ['text' ] ],
        ],
    
        [
          'name' => 'Blurb',  
          'id'   => "{$prefix}blurb",
          'type'    => 'textarea',
          'rows'     => 4,
          'column' => 'column-2',
          'visible' => [ "{$prefix}content_options", 'in', ['text' ] ],
        ],
    
        [
          'type' => 'heading',
          'name' => 'Quote',
          'column' => 'column-2',
          'visible' => [ "{$prefix}content_options", 'in', ['quote' ] ],
        ],
        
        [
          'name' => 'Quote',
          'id'   => "{$prefix}quote",
          'type' => 'textarea',
          'rows' => 2,
          'column' => 'column-2',
          'visible' => [ "{$prefix}content_options", 'in', ['quote' ] ],
        ],
    
        [
          'name' => 'Cite',  
          'id'   => "{$prefix}cite",
          'type'    => 'textarea',
          'rows'     => 1,
          'column' => 'column-2',
          'visible' => [ "{$prefix}content_options", 'in', ['quote' ] ],
        ],
    
        /*
        add_cta_button_group__g_block_meta_box(        
          $prefix,
          $id ='btn_groups',
          $textdomain,
          $visibility = '',
          $vis_args = array(),
          $columns = 'column-2'
        ),
        **/
    
        [
          'type' => 'heading',
          'name' => 'Background Options',
          'column'  => 'column-1',
        ],
    
        [
          'name'    => 'Background options',
          'id'   => "{$prefix}background_options",
          'type' => 'radio',
          'inline' => true,
          'options' => array(
            'video' => 'Video',
            'image' => 'Image',
          ),
          'column'  => 'column-1',
        ],
    
        [
          'name' => 'Background Image',  
          'id' => "{$prefix}bg_image",
          'type' => 'image_advanced',
          'max_file_uploads' => 1,
          'image_size' => 'thumbnail',
          'column' => 'column-1',
          'visible' => [ "{$prefix}background_options", 'in', ['image' ] ],
        ],
    
        [
          'id'                => "{$prefix}mp4",
          'desc'              => 'Please keep the file size under 2Mb',
          'name'              => 'The background MP4 Video, this will override the cover image',
          'type'              => 'file_advanced',
          'max_file_uploads'  => 1,
          'mime_type'         => 'video/mp4',
          'column'  => 'column-1', 
          'visible' => [ "{$prefix}background_options", 'in', ['video' ] ],
        ],
    
        [
          'name' => 'Add Overlay (Percentage)',
          'desc' => 'This adds a black overlay on top of the  image/video to darken it making the header text more readable.',
          'id'   => "{$prefix}overlay_percentage",
          'type' => 'number',
          'min'  => 0,
          'max'  => 100,
          'step' => 1,
          'column' => 'column-1',
        ],
    
      ],
    ];
    #39975
    ambrdigitalambrdigital
    Participant

    Hi Team,

    I had a whitespace issue that was causing the JSON error.

    Thanks again for your assistance.

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.