Skip to content

2.8.0 Repeatable Group CSS Bug #1405

Description

@Timofey81

I would like to report a reproducable bug with a repeatable group if using 'classes' to assign CSS classes.
After the 10th row the classes' names become incorrect.

Here is my setup:

	$cmb_media = new_cmb2_box(array(
		'id'            => "mb_media" ,
		'title'         => __("Media", "cmb2"),
		'object_types'  => array("work"),
		'context'       => "normal" ,
		'priority'      => "low" ,
		'show_names'    => true
	));
	
	$group_field_id = $cmb_media->add_field(array(
		'id' => $prefix . "media" ,
		'type' => 'group',
			'description' => esc_html__("Aggiungi / Modifica / Rimuovi Media:", "cmb2"),
			'options'     => array(
			'group_title'   => esc_html__("Riga {#}", "cmb2"),
			'add_button'    => esc_html__("Aggiungi Riga", "cmb2"),
			'remove_button' => esc_html__("Rimuovi Riga", "cmb2"),
			'sortable'      => true
		),
	));

	$cmb_media->add_group_field($group_field_id, array(
		'name' => __("Tipo", "cmb2"),
		'id'   => "tipo" ,
		'type' => "select" ,
		'classes' => "cmb-row-media" ,
		'options' => array(
			'video' => __("Video", 'cmb2'),
			'img1'  => __("Immagine", 'cmb2'),
			'img2'  => __("Due immagini", 'cmb2'),
			'img-sx'  => __("Tre immagini SX", 'cmb2'),
			'img-dx'  => __("Tre immagini DX", 'cmb2'),
			'video-img'  => __("Video + Immagine", 'cmb2')
		)
	));

	$cmb_media->add_group_field($group_field_id,  array(
		'name'       => "Video Mp4" ,
		'desc'       => "Carica video" ,
		'id'         => "mp4" ,
		'type'       => "file" ,
		'classes'    => "cmb-row-mp4" ,
		'options'    => array(
			"url"    => false
		),
		'text'       => array(
			'add_upload_file_text' => "Aggiungi Video"
		),
		'query_args' => array(
			'type' => "video/mp4"
		)
	));

	$cmb_media->add_group_field($group_field_id,  array(
		'name'       => "Video WebM" ,
		'desc'       => "Carica video" ,
		'id'         => "webm" ,
		'type'       => "file" ,
		'classes'    => "cmb-row-webm" ,
		'options'    => array(
			"url"    => false
		),
		'text'       => array(
			'add_upload_file_text' => "Aggiungi Video"
		),
		'query_args' => array(
			'type' => "video/webm"
		)
	));

	$cmb_media->add_group_field($group_field_id,  array(
		'name'       => "Immagine" ,
		'desc'       => "Carica immagine" ,
		'id'         => "img" ,
		'type'       => "file" ,
		'classes'    => "cmb-row-img" ,
		'options'    => array(
			"url"    => false
		),
		'text'       => array(
			'add_upload_file_text' => "Aggiungi Immagine"
		),
		'query_args' => array(
			'type' => array(
				"image/gif" ,
				"image/jpeg" ,
				"image/png"
			),
		),
		'preview_size' => array(640, 480)
	));

	$cmb_media->add_group_field($group_field_id,  array(
		'name'       => "Immagine 1" ,
		'desc'       => "Carica immagine" ,
		'id'         => "img1" ,
		'type'       => "file" ,
		'classes'    => "cmb-row-img1" ,
		'options'    => array(
			"url"    => false
		),
		'text'       => array(
			'add_upload_file_text' => "Aggiungi Immagine"
		),
		'query_args' => array(
			'type' => array(
				"image/gif" ,
				"image/jpeg" ,
				"image/png"
			),
		),
		'preview_size' => array(640, 480)
	));

	$cmb_media->add_group_field($group_field_id,  array(
		'name'       => "Immagine 2" ,
		'desc'       => "Carica immagine" ,
		'id'         => "img2" ,
		'type'       => "file" ,
		'classes'    => "cmb-row-img2" ,
		'options'    => array(
			"url"    => false
		),
		'text'       => array(
			'add_upload_file_text' => "Aggiungi Immagine"
		),
		'query_args' => array(
			'type' => array(
				"image/gif" ,
				"image/jpeg" ,
				"image/png"
			),
		),
		'preview_size' => array(640, 480)
	));

	$cmb_media->add_group_field($group_field_id,  array(
		'name'       => "Immagine Verticale" ,
		'desc'       => "Carica immagine" ,
		'id'         => "img-sx" ,
		'type'       => "file" ,
		'classes'    => "cmb-row-img-sx-dx" ,
		'options'    => array(
			"url"    => false
		),
		'text'       => array(
			'add_upload_file_text' => "Aggiungi Immagine"
		),
		'query_args' => array(
			'type' => array(
				"image/gif" ,
				"image/jpeg" ,
				"image/png"
			),
		),
		'preview_size' => array(640, 480)
	));

	$cmb_media->add_group_field($group_field_id,  array(
		'name'       => "Immagine Orrizontale 1" ,
		'desc'       => "Carica immagine" ,
		'id'         => "img-sx1" ,
		'type'       => "file" ,
		'classes'    => "cmb-row-img-sx-dx" ,
		'options'    => array(
			"url"    => false
		),
		'text'       => array(
			'add_upload_file_text' => "Aggiungi Immagine"
		),
		'query_args' => array(
			'type' => array(
				"image/gif" ,
				"image/jpeg" ,
				"image/png"
			),
		),
		'preview_size' => array(640, 480)
	));

	$cmb_media->add_group_field($group_field_id,  array(
		'name'       => "Immagine Orrizontale 2" ,
		'desc'       => "Carica immagine" ,
		'id'         => "img-sx2" ,
		'type'       => "file" ,
		'classes'    => "cmb-row-img-sx-dx" ,
		'options'    => array(
			"url"    => false
		),
		'text'       => array(
			'add_upload_file_text' => "Aggiungi Immagine"
		),
		'query_args' => array(
			'type' => array(
				"image/gif" ,
				"image/jpeg" ,
				"image/png"
			),
		),
		'preview_size' => array(640, 480)
	));

As you can see in the attachment one of the 11th row's classes should be "cmb-row-img" instead of "cmb-row-img1".
cmb2-group-fields-css-bug

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions