├── README.md
├── db.php
├── backend.php
└── index.php


/README.md:
--------------------------------------------------------------------------------
1 | # CRUD


--------------------------------------------------------------------------------
/db.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 |     $servername="localhost";
 3 |     $username= "root";
 4 |     $password= "";
 5 |     $dbname= "tih";
 6 |     $conn = new mysqli($servername, $username, $password, $dbname);
 7 |     if ($conn->connect_error) {
 8 |         die("". $conn->connect_error);
 9 |     }
10 | ?>


--------------------------------------------------------------------------------
/backend.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | include("db.php");
  3 | 
  4 | // Add new User
  5 | if (isset($_POST['save_newuser'])) {
  6 |     try {
  7 |         $courseid = mysqli_real_escape_string($conn, $_POST['courseid']);
  8 |         $coursename = mysqli_real_escape_string($conn, $_POST['coursename']);
  9 |         $grade = mysqli_real_escape_string($conn, $_POST['grade']);
 10 |         $percentage = mysqli_real_escape_string($conn, $_POST['percentage']);
 11 | 
 12 |         $query = "INSERT INTO exam (courseid,coursename,grade,percentage) VALUES ('$courseid', '$coursename','$grade','$percentage')";
 13 | 
 14 |         if (mysqli_query($conn, $query)) {
 15 |             $res = [
 16 |                 'status' => 200,
 17 |                 'message' => 'Details Updated Successfully'
 18 |             ];
 19 |             echo json_encode($res);
 20 |         } else {
 21 |             throw new Exception('Query Failed: ' . mysqli_error($conn));
 22 |         }
 23 |     } catch (Exception $e) {
 24 |         $res = [
 25 |             'status' => 500,
 26 |             'message' => 'Error: ' . $e->getMessage()
 27 |         ];
 28 |         echo json_encode($res);
 29 |     }
 30 | }
 31 | 
 32 | // Delete User
 33 | if (isset($_POST['delete_user'])) {
 34 |     $user_id = mysqli_real_escape_string($conn, $_POST['user_id']);
 35 | 
 36 |     $query = "DELETE FROM exam WHERE id='$user_id'";
 37 |     $query_run = mysqli_query($conn, $query);
 38 | 
 39 |     if ($query_run) {
 40 |         $res = [
 41 |             'status' => 200,
 42 |             'message' => 'Details Deleted Successfully'
 43 |         ];
 44 |         echo json_encode($res);
 45 |         return;
 46 |     } else {
 47 |         $res = [
 48 |             'status' => 500,
 49 |             'message' => 'Details Not Deleted'
 50 |         ];
 51 |         echo json_encode($res);
 52 |         return;
 53 |     }
 54 | }
 55 | 
 56 | // Update User
 57 | if (isset($_GET['get_user'])) {
 58 |     $student_id = mysqli_real_escape_string($conn, $_GET['user_id']);
 59 |     $query = "SELECT * FROM exam WHERE id='$student_id'";
 60 |     $query_run = mysqli_query($conn, $query);
 61 | 
 62 |     if ($query_run && mysqli_num_rows($query_run) > 0) {
 63 |         $user = mysqli_fetch_assoc($query_run);
 64 |         $res = [
 65 |             'status' => 200,
 66 |             'data' => $user
 67 |         ];
 68 |     } else {
 69 |         $res = [
 70 |             'status' => 500,
 71 |             'message' => 'User Not Found'
 72 |         ];
 73 |     }
 74 |     echo json_encode($res);
 75 | }
 76 | 
 77 | if (isset($_POST['update_user'])) {
 78 |     try {
 79 |         $student_id = mysqli_real_escape_string($conn, $_POST['user_id']);
 80 |         $courseid = mysqli_real_escape_string($conn, $_POST['courseid']);
 81 |         $coursename = mysqli_real_escape_string($conn, $_POST['coursename']);
 82 |         $grade = mysqli_real_escape_string($conn, $_POST['grade']);
 83 |         $percentage = mysqli_real_escape_string($conn, $_POST['percentage']);
 84 | 
 85 |         // Ensure the fields are not empty
 86 |         if (!empty($student_id) && !empty($courseid) && !empty($coursename) && !empty($grade) && !empty($percentage)) {
 87 |             $query = "UPDATE exam SET courseid='$courseid', coursename='$coursename', grade='$grade', percentage='$percentage' WHERE id='$student_id'";
 88 | 
 89 |             if (mysqli_query($conn, $query)) {
 90 |                 $res = [
 91 |                     'status' => 200,
 92 |                     'message' => 'Details Updated Successfully'
 93 |                 ];
 94 |             } else {
 95 |                 throw new Exception('Query Failed: ' . mysqli_error($conn));
 96 |             }
 97 |         } else {
 98 |             throw new Exception('All fields are required.');
 99 |         }
100 |     } catch (Exception $e) {
101 |         $res = [
102 |             'status' => 500,
103 |             'message' => 'Error: ' . $e->getMessage()
104 |         ];
105 |     }
106 |     echo json_encode($res);
107 | }
108 | ?>
109 | 


--------------------------------------------------------------------------------
/index.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | include("db.php");
  3 | $sql = "SELECT * FROM exam";
  4 | $result = mysqli_query($conn, $sql);
  5 | ?>
  6 | 
  7 | <!DOCTYPE html>
  8 | <html>
  9 | 
 10 | <head>
 11 |     <title>PHP - CRUD</title>
 12 |     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet">
 13 |     <link href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css" rel="stylesheet" crossorigin="anonymous">
 14 |     
 15 | </head>
 16 | 
 17 | <body class="bg-light">
 18 |     <div class="container mt-4">
 19 |         <div class="d-flex justify-content-between align-items-center mb-3">
 20 |             <h2 class="text-primary">Student Information</h2>
 21 |             <button type="button" class="btn btn-success" data-bs-toggle="modal" data-bs-target="#adduser">Add User</button>
 22 |         </div>
 23 | 
 24 | 
 25 |         <div class="table-responsive">
 26 |             <table class="table table-striped table-bordered" id="user" style="background-color:bisque;">
 27 |                 <thead class="table-primary">
 28 |                     <tr>
 29 |                         <th scope="col">S.No</th>
 30 |                         <th scope="col">Course_id</th>
 31 |                         <th scope="col">Course_name</th>
 32 |                         <th scope="col">Grade</th>
 33 |                         <th scope="col">Percentage</th>
 34 |                         <th scope="col">Action</th>
 35 |                     </tr>
 36 |                 </thead>
 37 |                 <tbody>
 38 |                     <?php
 39 |                     $s = 1;
 40 |                     while ($row = mysqli_fetch_assoc($result)) {
 41 |                     ?>
 42 |                         <tr>
 43 |                             <td><?php echo $s; ?></td>
 44 |                             <td><?php echo $row['courseid']; ?></td>
 45 |                             <td><?php echo $row['coursename']; ?></td>
 46 |                             <td><?php echo $row['grade']; ?></td>
 47 |                             <td><?php echo $row['percentage']; ?></td>
 48 |                             <td>
 49 |                                 <button type="button" value="<?php echo $row['id']; ?>" class="btn btn-info btnuseredit">Edit</button>
 50 |                                 <button type="button" value="<?php echo $row['id']; ?>" class="btn btn-danger btnuserdelete">Delete</button>
 51 |                             </td>
 52 |                         </tr>
 53 |                     <?php
 54 |                         $s++;
 55 |                     }
 56 |                     ?>
 57 |                 </tbody>
 58 |             </table>
 59 |         </div>
 60 |     </div>
 61 | 
 62 |     <!-- Add User Modal -->
 63 |     <div class="modal fade" id="adduser" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
 64 |         <div class="modal-dialog">
 65 |             <div class="modal-content">
 66 |                 <div class="modal-header">
 67 |                     <h5 class="modal-title" id="exampleModalLabel">Add User</h5>
 68 |                     <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
 69 |                 </div>
 70 |                 <form id="addnewuser">
 71 |                     <div class="modal-body">
 72 |                         <div class="mb-3">
 73 |                             <label for="courseid" class="form-label">Course_id</label>
 74 |                             <input type="text" name="courseid" class="form-control" placeholder="Enter Course_id" required>
 75 |                         </div>
 76 |                         <div class="mb-3">
 77 |                             <label for="coursename">Course_name</label>
 78 |                             <select class="form-control" name="coursename" required>
 79 |                                 <option value="">Select Course</option>
 80 |                                 <option value="SSLC">C</option>
 81 |                                 <option value="HSC">C++</option>
 82 |                                 <option value="ITI">Python</option>
 83 |                                 <option value="DIPLOMA">Java</option>
 84 |                                 <option value="UG">Backend</option>
 85 |                             </select>
 86 |                             </div>
 87 |                           <div class="mb-3">
 88 |                           <label for="grade" >Grade</label>
 89 |                             <select class="form-control" name="grade" required>
 90 |                                 <option value="">Select Grade</option>
 91 |                                 <option value="SSLC">O</option>
 92 |                                 <option value="HSC">A+</option>
 93 |                                 <option value="ITI">A</option>
 94 |                                 <option value="DIPLOMA">B+</option>
 95 |                                 <option value="UG">B</option>
 96 |                             </select>
 97 |                           </div>
 98 |                         
 99 |                         
100 |                             
101 |                         <div class="mb-3">
102 |                             <label for="percentage" class="form-label">Percentage</label>
103 |                             <input type="text" name="percentage" class="form-control" placeholder="Enter Percentage" required>
104 |                         </div>
105 |                     </div>
106 |                     <div class="modal-footer">
107 |                         <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
108 |                         <button type="submit" class="btn btn-primary">Submit</button>
109 |                     </div>
110 |                 </form>
111 |             </div>
112 |         </div>
113 |     </div>
114 | 
115 |     <!-- Edit User Modal -->
116 |     <div class="modal fade" id="useredit" tabindex="-1" aria-labelledby="editModalLabel" aria-hidden="true">
117 |         <div class="modal-dialog">
118 |             <div class="modal-content">
119 |                 <div class="modal-header">
120 |                     <h5 class="modal-title" id="editModalLabel">Edit User</h5>
121 |                     <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
122 |                 </div>
123 |                 <form id="editform">
124 |                     <div class="modal-body">
125 |                         <input type="hidden" name="user_id" id="edit_id">
126 |                         <label for="courseid" class="form-label">Course_id</label>
127 |                         <input type="text" name="courseid" id="edit_cid" class="form-control" placeholder="Enter Course_id" required>
128 |                         <label for="coursename">Course_name</label>
129 |                             <select class="form-control" name="coursename" required>
130 |                                 <option value="">Select Course</option>
131 |                                 <option value="SSLC">C</option>
132 |                                 <option value="HSC">C++</option>
133 |                                 <option value="ITI">Python</option>
134 |                                 <option value="DIPLOMA">Java</option>
135 |                                 <option value="UG">Backend</option>
136 |                             </select>
137 | 
138 |                         <label for="grade" class="form-label">Grade</label>
139 |                         <select class="form-control" name="grade" required>
140 |                                 <option value="">Select Grade</option>
141 |                                 <option value="SSLC">O</option>
142 |                                 <option value="HSC">A+</option>
143 |                                 <option value="ITI">A</option>
144 |                                 <option value="DIPLOMA">B+</option>
145 |                                 <option value="UG">B</option>
146 |                         </select>
147 |                         <label for="percentage" class="form-label">Percentage</label>
148 |                         <input type="text" name="percentage" id="edit_percentage" class="form-control" placeholder="Enter Percentage" required>
149 |                     </div>
150 |                     <div class="modal-footer">
151 |                         <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
152 |                         <button type="submit" class="btn btn-primary">Update</button>
153 |                     </div>
154 |                 </form>
155 |             </div>
156 |         </div>
157 |     </div>
158 | 
159 |     <script src="https://code.jquery.com/jquery-3.6.0.min.js" crossorigin="anonymous"></script>
160 |     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
161 |     <script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js" crossorigin="anonymous"></script>
162 | 
163 |     <script>
164 |         $(document).ready(function() {
165 |             //to display data tables
166 |             $('#user').DataTable();
167 |         });
168 | 
169 |         $(document).on('submit', '#addnewuser', function(e) {
170 |             e.preventDefault(); //page doesnot load;
171 |             var formData = new FormData(this); // fetch form data
172 |             formData.append("save_newuser", true);
173 |             $.ajax({
174 |                 type: "POST",
175 |                 url: "backend.php",
176 |                 data: formData,
177 |                 processData: false,
178 |                 contentType: false,
179 |                 success: function(response) {
180 |                     var res = jQuery.parseJSON(response);
181 |                     console.log(res)
182 |                     if (res.status == 200) {
183 |                         $('#adduser').modal('hide'); //modal name
184 |                         $('#addnewuser')[0].reset(); // to reset form details
185 |                         $('#user').load(location.href + " #user"); // table to refresh
186 |                         alert("Data Added Successfully")
187 | 
188 |                     } else if (res.status == 500) {
189 |                         $('#adduser').modal('hide'); //modal_name
190 |                         $('#addnewuser')[0].reset(); // to reset form
191 |                         console.error("Error:", res.message);
192 |                         alert("Something Went wrong.! try again")
193 |                     }
194 |                 }
195 |             });
196 | 
197 |         });
198 | 
199 |         $(document).on('click', '.btnuserdelete', function(e) {
200 |             e.preventDefault();
201 | 
202 |             if (confirm('Are you sure you want to delete this data?')) {
203 |                 var user_id = $(this).val();
204 |                 $.ajax({
205 |                     type: "POST",
206 |                     url: "backend.php",
207 |                     data: {
208 |                         'delete_user': true,
209 |                         'user_id': user_id
210 |                     },
211 |                     success: function(response) {
212 | 
213 |                         var res = jQuery.parseJSON(response);
214 |                         if (res.status == 500) {
215 |                             alert(res.message);
216 |                         } else {
217 |                             $('#user').load(location.href + " #user");
218 |                         }
219 |                     }
220 |                 });
221 |             }
222 |         });
223 | 
224 |         // Edit user
225 |         $(document).on('click', '.btnuseredit', function(e) {
226 |             e.preventDefault();
227 |             var user_id = $(this).val();
228 |             $.ajax({
229 |                 type: "GET",
230 |                 url: "backend.php",
231 |                 data: {
232 |                     'get_user': true,
233 |                     'user_id': user_id
234 |                 },
235 |                 success: function(response) {
236 |                     var res = jQuery.parseJSON(response);
237 |                     if (res.status == 200) {
238 |                         $('#edit_id').val(res.data.id);
239 |                         $('#edit_cid').val(res.data.courseid);
240 |                         $('#edit_name').val(res.data.coursename);
241 |                         $('#edit_grade').val(res.data.grade);
242 |                         $('#edit_percentage').val(res.data.percentage);
243 | 
244 |                         $('#useredit').modal('show'); //to edit modal
245 |                     } else {
246 |                         alert(res.message);
247 |                     }
248 |                 }
249 |             });
250 |         });
251 | 
252 |         
253 |         $(document).on('submit', '#editform', function(e) {
254 |             e.preventDefault();
255 |             var formData = new FormData(this);
256 |             formData.append("update_user", true);
257 | 
258 |             $.ajax({
259 |                     type: "POST",
260 |                     url: "backend.php",
261 |                     data: formData,
262 |                     processData: false,
263 |                     contentType: false,
264 |                     success: function(response) {
265 |                         console.log(response); // Log the response for debugging
266 |                         var res = jQuery.parseJSON(response);
267 |                         if (res.status == 200) {
268 |                             $('#useredit').modal('hide');
269 |                             $('#editform')[0].reset();
270 |                             $('#user').load(location.href + " #user"); // Reload table data
271 |                             alert(res.message);
272 |                         } else if (res.status == 500) {
273 |                             $('#useredit').modal('hide');
274 |                             $('#editform')[0].reset();
275 |                             console.error("Error:", res.message);
276 |                             alert("Something went wrong. Please try again.");
277 |                         }
278 |                     }
279 |                 })
280 |             });
281 |     </script>
282 | </body>
283 | 
284 | </html>


--------------------------------------------------------------------------------