I am facing an issue with updating names in a table through a modal edit form. The first name update works perfectly, but the second update does not reflect in the table. I want every change made in the modal edit form to be instantly displayed in the table without reloading the page. Can someone please assist me in resolving this issue? Your help is greatly appreciated. Thank you.
Modal Edit Form
<div class="modal fade bs-example-modal-lg edit-entity-modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content" style="background-color: #343D46;">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true" style="color: #fff;">×</span></button>
<h2 style="padding:10px; color: #fff;">Post Activity Report Edit Form</h2>
<address></address>
<form class="form-horizontal par-form-edit" id="par-form-edit" style="background-color: #e2e2e2;" method="post" enctype="multipart/form-data">
<fieldset>
<div class="alert alert-dismissable alert-success alert-editName-success">
<button type="button" class="close" data-dismiss="alert">×</button>
<center><h4>Data successfully updated.</h4></center>
</div>
<address></address>
<div class="form-group">
<label for="inputName" class="col-lg-2 control-label">Name</label>
<div class="col-lg-10">
<input type="text" class="form-control" name="par[name]" id="name_edit" placeholder="Name" value="" style="width:260px;height:40px;" required>
</div>
</div>
<div class="form-group">
<div class="col-lg-10 col-lg-offset-2">
<button type="submit" class="btn btn-primary update-name">Update</button>
<button class="btn btn-default">Cancel</button>
</div>
</div>
</fieldset>
</form>
</div>
...