Stop page refresh on button click - php

Question

I'm currently developing a system for internal use within my company to allow our service desk team to unlock user accounts/reset passwords.
I've completed the PHP/POST functions for this and have included them with the .load function on the dashboard of my system. This works and the function in question is LDAP account unlocks. The button is clicked, the post form is submitted and it all works fine. However it refreshes the entire page when submitted even though its been loaded via jQuery. I'm struggling to understand why this would happen, and how I can avoid it so I can give the end user successful or unsuccessful messages on button clicks. This is the main aim and is why I have started using JS load functions as I believed this would allow me to do so.
I'm entirely new to jQuery/JSON/JS and if this question is slightly in-descriptive or has an obvious answer apologies.
EDIT:
The way I have included the form is as such:
<div id="lockedout"></div>
<script>
$(document).ready(function(){
$("#lockedout").load('/modules/active-directory/includes/lockedout.php');
});
</script>
And the included form is:
<?php
set_include_path( get_include_path() . PATH_SEPARATOR . $_SERVER['DOCUMENT_ROOT'] );
include ('/core/system/global.ldap.php');
$attributes = array("displayname", "mail", "samaccountname", "lockoutTime");
$filter = "(&(objectClass=User)(lockoutTime>=1)(title=*))";
$search = ldap_search($ldap_conn, $ldap_dn, $filter, $attributes) or die (ldap_error($ldap_conn));
$info = ldap_get_entries($ldap_conn, $search);
?>
<h4><i class="fa fa-lock"></i> Currently Locked Out (<?php echo $info["count"]; ?>)</h4>
<br>
<table class="table table-bordered">
<tbody><tr>
<th>Username</th>
<th>Unlock</th>
</tr>
<?php
for ($i=0; $i<$info["count"]; $i++) {
echo "<tr>";
echo "<td>" . $info[$i]["displayname"][0] . " (" . $info[$i]["samaccountname"][0] . ")</td>";
echo "</form><form method='post' action='/active-directory/' id='" . $info[$i]["samaccountname"][0] . "'></form>";
echo '<input type="hidden" name="dn" value="'. $info[$i]["dn"] .'" form="' . $info[$i]["samaccountname"][0] . '">';
echo "<td><center><button type='submit' id='unlock' name='unlock' class='btn btn-success btn-flat' form='" . $info[$i]["samaccountname"][0] . "'>Unlock </button></center></td>";
echo "</tr>";
}
?> </tbody></table>
This code is attached above the dashboard where i'm doing the JSON import.
<?php
if(isset($_POST['unlock']))
{
$attr["lockoutTime"] = "0";
$userdn = $_POST['dn'];
$result = ldap_modify($ldap_conn, $userdn, $attr);
echo '<script>
$(document).ready(function(){
$("#lockedout").load("/modules/active-directory/includes/lockedout.php");
});
</script>';
}
?>

Answer 1

if you want to submit content to backpage or verify users but not reload the entire page use AJAX.
if you want to simply show some alerts or validate form when you click the button use javascript or its derivatives