I try to briefly explain my problem:
I have some blocks of text (the content) that I show with excerpt in a wordpress loop.
In the wordpress function file I inserted a button (read more) that shows all the content in bootstrap modal:
function excerpt ($limit) {
$id = get_the_ID ();
$excerpt = explode ('', get_the_excerpt (), $limit);
if (count ($excerpt)> = $limit) {
array_pop ($excerpt);
$excerpt = implode ("", $excerpt) .'... <button id = "myModal- '. $id.'" type = "button" class = "btn btn-light btn-sm" data-bs-toggle = "modal" data-bs-target = "#myModal">Open</button>';
} else {
$excerpt = implode ("", $excerpt);
}
$excerpt = preg_replace ('`[[^]] *]`', '', $excerpt);
return $excerpt;}
to the modal I associated the id of the contents:
<div class = "pt-cv-ctf-list">
<? php echo excerpt (50); ?>
</div>
<div id = "myModal" class = "modal" tabindex = "- 1" role = "dialog" aria-labeledby = "myModalLabel" aria-hidden = "true">
<div class = "modal-dialog">
<div class = "modal-content">
<div class = "modal-header">
<h5 class = "modal-title" id = "myModalLabel"> <? php the_title (); ?> </h5>
<button type = "button" class = "btn-close" data-bs-dismiss = "modal" aria-label = "Close"> </button>
</div>
<div class = "modal-body">
<? php the_content (); ?>
</div>
<div class = "modal-footer">
<button type = "button" class = "btn btn-default" data-bs-dismiss = "modal"> Close </button>
</div>
</div>
</div>
</div>
The code works but it shows me only the first contents (rightly because I have no associated ID), but if I associate it:
<div id = "myModal- '. $ id.'" class = "modal" tabindex = "- 1" role = "dialog" aria-labeledby = "myModalLabel" aria-hidden = "true">
it doesn’t work and the google console gives me this error:
bootstrap.min.js? ver = 5.9.3: 6 Uncaught TypeError: Cannot read properties of undefined (reading ‘classList’)
Where am I wrong?
The button I inserted in a function in the wordpress functions.php file and the modal under the div of the excerpt as you can see from the snippets above. Should I include it in the footer perhaps?