Modal inside of a div - php

Question

Basically my modal is inside my div, but i want it outside of it... the problem is i am making use of a foreach statement aswell so it needs to be inside the foreach statement but also outside of the content div.
Here's my code:
<div class="content">
<div class="block block-rounded block-fx-pop block-themed">
<div class="block-header bg-gd-sublime">
<h3 class="block-title">Manage subscription plans</h3>
</div>
<div class="block-content block-content-full">
<!-- DataTables init on table by adding .js-dataTable-full class, functionality is initialized in js/pages/be_tables_datatables.min.js which was auto compiled from _es6/pages/be_tables_datatables.js -->
<table class="table js-dataTable-full">
<tbody>
<tr>
<th style="font-size: 12px;">Subscription name</th>
<th class="text-center" style="font-size: 12px;">Color</th>
<th class="text-center" style="font-size: 12px;">Price</th>
<th class="text-center" style="font-size: 12px;">duration</th>
<th class="text-center" style="font-size: 12px;">Account/day</th>
<th class="text-center" style="font-size: 12px;">Accounts type</th>
<th class="text-center" style="font-size: 12px;">Private</th>
<th class="text-center" style="font-size: 12px;">Users</th>
</tr>
<?php
$getPlans = $odb->query('SELECT * FROM plans ORDER BY price ASC');
foreach ($getPlans as $dPlans) {
if ($dPlans['private'] == 0) { $private = 'No'; } else { $private = 'Yes'; }
$id = $dPlans['ID'];
$getpeople = $odb->query("SELECT COUNT(*) AS total FROM `users` WHERE `membership` = '$id'");
$fetchpeople = $getpeople->fetch(PDO::FETCH_ASSOC);
$people = $fetchpeople['total'];
?>
<tr>
<td style="font-size: 12px;">
<a class="link-fx" href="#" data-toggle="modal" data-target="#exampleModalCenter<?php echo $id; ?>"><?=$dPlans['name']?></a>
</td>
<td class="text-center" style="font-size: 12px;"><i class="fa fa-circle" style='color:<?=$dPlans['color']?>'></i></td>
<td class="text-center" style="font-size: 12px;"><?=$dPlans['price']?> €</td>
<td class="text-center" style="font-size: 12px;"><?=$dPlans['length']?> <?=$dPlans['unit']?></td>
<td class="text-center" style="font-size: 12px;"><?=$dPlans['limit']?></td>
<td class="text-center" style="font-size: 12px;"><?=$dPlans['accounts']?></td>
<td class="text-center" style="font-size: 12px;"><?=$private?></td>
<td class="text-center" style="font-size: 12px;"><?=$people?></td>
</tr>
<!-- Modal -->
<div class="modal fade" id="exampleModalCenter<?php echo $id; ?>" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Edit Plan: <?=$dPlans['name']?></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form method="post">
<div class="block-content">
<div class="row items-push">
<div class="col-lg-12">
<div class="form-group">
<label for="val-username">Name</label>
<input type="text" class="form-control" id="name2" name="name<?php echo $id; ?>" value="<?=$dPlans['name']?>">
</div>
<div class="form-group">
<label for="val-email">Price</label>
<input type="text" class="form-control" id="price2" name="price<?php echo $id; ?>" value="<?=$dPlans['price']?>">
</div>
<div class="form-group">
<label for="val-password">Duration</label>
<input type="text" class="form-control" id="length2" name="length<?php echo $id; ?>" value="<?=$dPlans['length']?>">
</div>
<div class="form-group">
<label for="val-skill">Time unit <span class="text-danger">*</span></label>
<select class="form-control" id="val-skill" name="unit<?php echo $id; ?>">
<option value="Days" <?php echo selectedUnit('Days',$dPlans['unit']); ?>>Days</option>
<option value="Weeks" <?php echo selectedUnit('Weeks',$dPlans['unit']); ?> >Week</option>
<option value="Months" <?php echo selectedUnit('Months',$dPlans['unit']); ?>>Month</option>
<option value="Years" <?php echo selectedUnit('Years',$dPlans['unit']); ?>>Year</option>
</select>
</div>
<div class="form-group">
<label for="val-password">Account per day</label>
<input type="text" class="form-control" id="length2" name="limit<?php echo $id; ?>" value="<?=$dPlans['limit']?>">
</div>
<div class="form-group">
<label for="val-password">Account type</label>
<input type="text" class="form-control" id="length2" name="accounts<?php echo $id; ?>" value="<?=$dPlans['accounts']?>">
</div>
<div class="form-group">
<label for="val-skill">Private <span class="text-danger">*</span></label>
<select class="form-control" id="val-skill" name="private<?php echo $id; ?>">
<option value="1" <?php echo selectedUnit(1,$dPlans['private']); ?>>Yes</option>
<option value="0" <?php echo selectedUnit(0,$dPlans['private']); ?>>No</option>
</select>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button name="update" value="<?php echo $id; ?>" class="btn btn-primary" type="submit">Update</button>
</div>
</div>
</div>
</div>
<?php }
?>
</tbody>
</table>
</div>
</div>
I've tried moving/adding divs but no change and it still displays like this:
I know my formating is really bad.
What Yasir Suggested me to do:
<div class="content">
<div class="block block-rounded block-fx-pop block-themed">
<div class="block-header bg-gd-sublime">
<h3 class="block-title">Manage subscription plans</h3>
</div>
<div class="block-content block-content-full">
<!-- DataTables init on table by adding .js-dataTable-full class, functionality is initialized in js/pages/be_tables_datatables.min.js which was auto compiled from _es6/pages/be_tables_datatables.js -->
<table class="table js-dataTable-full">
<tbody>
<tr>
<th style="font-size: 12px;">Subscription name</th>
<th class="text-center" style="font-size: 12px;">Price</th>
<th class="text-center" style="font-size: 12px;">Duration</th>
<th class="text-center" style="font-size: 12px;">Account/day</th>
<th class="text-center" style="font-size: 12px;">Accounts type</th>
<th class="text-center" style="font-size: 12px;">Users</th>
</tr>
<?php
$getPlans = $odb->query('SELECT * FROM plans ORDER BY price ASC');
foreach ($getPlans as $dPlans) {
if ($dPlans['private'] == 0) { $private = 'No'; } else { $private = 'Yes'; }
$id = $dPlans['ID'];
$getpeople = $odb->query("SELECT COUNT(*) AS total FROM `users` WHERE `membership` = '$id'");
$fetchpeople = $getpeople->fetch(PDO::FETCH_ASSOC);
$people = $fetchpeople['total'];
?>
<tr>
<td style="font-size: 12px;">
<a class="link-fx" href="#" data-toggle="modal" data-target="#exampleModalCenter<?php echo $id; ?>"><?=$dPlans['name']?></a>
</td>
<td class="text-center" style="font-size: 12px;"><?=$dPlans['price']?> €</td>
<td class="text-center" style="font-size: 12px;"><?=$dPlans['length']?> <?=$dPlans['unit']?></td>
<td class="text-center" style="font-size: 12px;"><?=$dPlans['limit']?></td>
<td class="text-center" style="font-size: 12px;"><?=$dPlans['accounts']?></td>
<td class="text-center" style="font-size: 12px;"><?=$people?></td>
</tr>
<?php }
?>
</tbody>
</table>
</div>
</div>
</div>
<?php
$getPlans = $odb->query('SELECT * FROM plans ORDER BY price ASC');
foreach ($getPlans as $dPlans) {
if ($dPlans['private'] == 0) { $private = 'No'; } else { $private = 'Yes'; }
$id = $dPlans['ID'];
$getpeople = $odb->query("SELECT COUNT(*) AS total FROM `users` WHERE `membership` = '$id'");
$fetchpeople = $getpeople->fetch(PDO::FETCH_ASSOC);
$people = $fetchpeople['total'];
?>
<!-- Modal -->
<div class="modal fade" id="exampleModalCenter<?php echo $id; ?>" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Edit Plan: <?=$dPlans['name']?></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form method="post">
<div class="block-content">
<div class="row items-push">
<div class="col-lg-12">
<div class="form-group">
<label for="val-username">Name</label>
<input type="text" class="form-control" id="name2" name="name<?php echo $id; ?>" value="<?=$dPlans['name']?>">
</div>
<div class="form-group">
<label for="val-email">Price</label>
<input type="text" class="form-control" id="price2" name="price<?php echo $id; ?>" value="<?=$dPlans['price']?>">
</div>
<div class="form-group">
<label for="val-password">Duration</label>
<input type="text" class="form-control" id="length2" name="length<?php echo $id; ?>" value="<?=$dPlans['length']?>">
</div>
<div class="form-group">
<label for="val-skill">Time unit <span class="text-danger">*</span></label>
<select class="form-control" id="val-skill" name="unit<?php echo $id; ?>">
<option value="Days" <?php echo selectedUnit('Days',$dPlans['unit']); ?>>Days</option>
<option value="Weeks" <?php echo selectedUnit('Weeks',$dPlans['unit']); ?> >Week</option>
<option value="Months" <?php echo selectedUnit('Months',$dPlans['unit']); ?>>Month</option>
<option value="Years" <?php echo selectedUnit('Years',$dPlans['unit']); ?>>Year</option>
</select>
</div>
<div class="form-group">
<label for="val-password">Account per day</label>
<input type="text" class="form-control" id="length2" name="limit<?php echo $id; ?>" value="<?=$dPlans['limit']?>">
</div>
<div class="form-group">
<label for="val-password">Account type</label>
<input type="text" class="form-control" id="length2" name="accounts<?php echo $id; ?>" value="<?=$dPlans['accounts']?>">
</div>
<div class="form-group">
<label for="val-skill">Private <span class="text-danger">*</span></label>
<select class="form-control" id="val-skill" name="private<?php echo $id; ?>">
<option value="1" <?php echo selectedUnit(1,$dPlans['private']); ?>>Yes</option>
<option value="0" <?php echo selectedUnit(0,$dPlans['private']); ?>>No</option>
</select>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button name="update" value="<?php echo $id; ?>" class="btn btn-primary" type="submit">Update</button>
</div>
</div>
</div>
</div>
</div>
<?php }
?>