Не працює popover після оновлення версії Bootstrap

[REDDI]

Оновив в панелі управління версію Bootstrap до 5.3. Всі інші моменти усунув, але залишилася проблема з popover при кліці на зображення.

Мій код:
 

// Image Manager
	$(document).on('click', 'a[data-toggle=\'image\']', function(e) {
		var $element = $(this);
		var $popover = $element.data('bs.popover'); // element has bs popover?
		
		e.preventDefault();
		
		// destroy all image popovers
		//$('a[data-toggle="image"]').dispose();
		
		// remove flickering (do not re-add popover when clicking for removal)
		if ($popover) {
			return;
		}
		
		var exampleEl = document.getElementById('example');
		
		var popover = new bootstrap.Popover(this, {
			html: true,
			placement: 'right',
			trigger: 'manual',
			content: function() {
				return '<button type="button" id="button-image" class="btn btn-primary"><i class="fa fa-pencil"></i></button> <button type="button" id="button-clear" class="btn btn-danger"><i class="fa fa-trash-o"></i></button>';
			}
		});
		
		popover.show();
		
		$('#button-image').on('click', function() {
			var $button = $(this);
			var $icon   = $button.find('> i');
			
			$('#modal-image').remove();
			
			$.ajax({
				url: 'index.php?route=common/filemanager&token=' + getURLVar('token') + '&target=' + $element.parent().find('input').attr('id') + '&thumb=' + $element.attr('id'),
				dataType: 'html',
				beforeSend: function() {
					$button.prop('disabled', true);
					if ($icon.length) {
						$icon.attr('class', 'fa fa-circle-o-notch fa-spin');
					}
				},
				complete: function() {
					$button.prop('disabled', false);
					if ($icon.length) {
						$icon.attr('class', 'fa fa-pencil');
					}
				},
				success: function(html) {
					$('body').append('<div id="modal-image" class="modal">' + html + '</div>');

					$('#modal-image').modal('show');
				}
			});
			
			$element.popover('destroy');
		});
		
		$('#button-clear').on('click', function() {
			$element.find('img').attr('src', $element.find('img').attr('data-placeholder'));
			
			$element.parent().find('input').val('');
			
			$element.popover('destroy');
		});
	});

 

 

При натисканні на зображення блок popover створюється в кінці сторінки, а не в тілі a href="". Також чомусь не заповнюється content.

Буду вдячний за допомогу!

[SergeTkach]

$element.popover({
    html: true,
    sanitize: false,
    ...

[REDDI]

В 25.04.2024 в 09:24, SergeTkach сказав:

$element.popover({
    html: true,
    sanitize: false,
    ...

Дуже дякую за допомогу! Теперь все працює. Можливо Ви знаєте як можливо ще видалити всі інші popover?

Замість
 

// destroy all image popovers
$('a[data-toggle="image"]').dispose();