modal edit form php code example
Example: edit data using modal php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=UTF-8>
<meta name=viewport content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin=anonymous>
<script src=
<script src=
<script src=
<script
src=
integrity="sha256-DrT5NfxfbHvMHux31Lkhxg42LY6of8TaYyK50jnxRnM="
crossorigin=anonymous></script>
<title>Document</title>
</head>
<body>
<div >
<div >
<div ></div>
<div >
<table >
<thead>
<tr>
<th>
<th>Course Name</th>
<th>Duration Hours</th>
<th>Exam Date</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1 </th>
<td>Computer</td>
<td>255 Hours</td>
<td>25-04-2020 </td>
<td><a href="javascript:;" data-toggle="modal" data-target="#addModal" data-id="1" data-name="Computer" data-duration="255" data-date="27-04-2020" > Edit</a></td>
</tr>
<tr>
<th scope="row">2 </th>
<td>Data Science</td>
<td>300 Hours</td>
<td>27-04-2020 </td>
<td><a href="javascript:;" data-toggle="modal" data-target="#addModal" data-id="2" data-name="Data Science" data-date="27-04-2020" data-duration="300" > Edit</a></td>
</tr>
</tbody>
</table>
</div>
<div ></div>
</div>
</div>
<script>
$('.addAttr').click(function() {
var id = $(this).data('id');
var name = $(this).data('name');
var duration = $(this).data('duration');
var date = $(this).data('date');
$('#id').val(id);
$('#name').val(name);
$('#duration').val(duration);
$('#date').val(date);
} );
</script>
<div id="addModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div role="document">
<div >
<div >
<h5 id="exampleModalLabel">Modal Title </h5>
<button type=button data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<form action="" method="POST">
<div >
<div >
<label for="exampleInputEmail1">Course Id</label>
<input type=text id="id" name=id required>
</div>
<div >
<label for="exampleInputEmail1">Enter Course Name</label>
<input type=text id="name" name=name required>
</div>
<div >
<label for="exampleInputEmail1">Enter Course Duration <small> (In hours)</small> </label>
<input type=text id="duration" name=duration value="" required >
</div>
<div >
<label for="exampleInputEmail1">Date </label>
<input type=text id="date" name=date value="" required >
</div>
</div>
<div >
<button type=button data-dismiss="modal">Close</button>
<button type=submit >Save changes</button>
</div>
</form>
</div>
</div>
</div>
</body>
</html>