if ( have_posts() ) : while ( have_posts() ) : the_post();
$args = array(
'numberposts' => 1,
'order'=> 'DESC',
'post_mime_type' => 'image',
'post_parent' => $post->ID,
'post_type' => 'attachment'
);
$get_children_array = get_children($args,ARRAY_A); //returns Array ( [$image_ID]...
$rekeyed_array = array_values($get_children_array);
$child_image = $rekeyed_array[0];
?>
<article class="col-sm-3 blurb-box" style="background-image: url('<?php echo $child_image[guid];?>');">
<div class="title-text">
<h2><?php the_title(); ?></h2>
</div>
<button
type="button"
href="<?php the_permalink(); ?>"
class="btn btn-success btn-md"
data-toggle="modal"
data-target="#myModal">
Open Modal
</button>
</article>
<?php endwhile; else : ?>
<?php endif; ?>
This works on first click. After refresh and gives you a single.php with the appropriate content in modal. Other clicks without refresh continue to produce the the same modal for which ever post you clicked on first.
Any thoughts? Should I forget about this?
I am assuming that you are trying to map one modal window to multiple "Open Modal" buttons. Because your "data-target" attribute will always have the same value in the loop.
A good way is to use ajax for getting the content of modal window i.e single post content. A quick googling can set you up in no time.