mirror of
https://github.com/bckelley/todo-list.git
synced 2026-08-24 01:14:11 -05:00
updated todo-list to use SimplePHPDB
This commit is contained in:
@@ -2,10 +2,12 @@
|
||||
if (isset($_GET['edit'])) {
|
||||
$id = $_GET['edit'];
|
||||
$update = true;
|
||||
$record = mysqli_query($db, "SELECT * FROM tasks WHERE id=".$id);
|
||||
if ( $record ) {
|
||||
$n = mysqli_fetch_array($record);
|
||||
$task = $n['task'];
|
||||
$row = $db->getRows("`todo-tasks`", ['where' => ['id' => $id]]);
|
||||
if ( $row ) {
|
||||
|
||||
foreach ( $row as $r ) {
|
||||
$task = $r['task'];
|
||||
}
|
||||
}
|
||||
}
|
||||
?>
|
||||
@@ -17,6 +19,8 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" type="text/css" href="style.css" />
|
||||
<title>Document</title>
|
||||
|
||||
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h2>ToDo List</h2>
|
||||
@@ -43,7 +47,7 @@
|
||||
</div>
|
||||
|
||||
</form>
|
||||
<?PHP $results = mysqli_query($db, "SELECT * FROM tasks"); ?>
|
||||
<?PHP $row = $db->getRows("`todo-tasks`"); ?>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
@@ -52,20 +56,81 @@
|
||||
<th colspan="2">Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<?PHP while($row = mysqli_fetch_array($results)) { ?>
|
||||
<?PHP if ($row) { ?>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><?PHP echo $row['id']; ?></td>
|
||||
<td><?PHP echo $row['task']; ?></td>
|
||||
<td>
|
||||
<a href="index.php?edit=<?PHP echo $row['id']; ?>" class="edit_btn">Edit</a>
|
||||
</td>
|
||||
<td>
|
||||
<a href="server.php?del=<?PHP echo $row['id']; ?>" class="del_btn">Delete</a>
|
||||
</td>
|
||||
</tr>
|
||||
<?PHP foreach ($row as $r) { ?>
|
||||
<tr>
|
||||
<td><?PHP echo $r['id']; ?></td>
|
||||
<td>
|
||||
<span class="task-list" data-id="<?PHP echo $r['id']; ?>" data-complete="<?PHP echo $r['isCompleted']? 'true': 'false' ?>">
|
||||
<?PHP echo $r['task']; ?>
|
||||
</span>
|
||||
</td>
|
||||
<td class="btn-group">
|
||||
<a href="index.php?edit=<?PHP echo $r['id']; ?>" class="edit_btn">Edit</a>
|
||||
<a href="server.php?del=<?PHP echo $r['id']; ?>" class="del_btn">Delete</a>
|
||||
</td>
|
||||
</tr>
|
||||
<?PHP } ?>
|
||||
<?PHP } else { ?>
|
||||
<tr><td colspan='4'>No tasks available.</td>
|
||||
<?PHP } ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</body>
|
||||
|
||||
<script>
|
||||
|
||||
$(document).ready(() => {
|
||||
|
||||
var element = $('.task-list');
|
||||
element.each(function() {
|
||||
if ($(this).attr('data-complete') === 'true') {
|
||||
$(this).addClass('strike');
|
||||
}
|
||||
});
|
||||
|
||||
$('.task-list').click((e) => {
|
||||
// $(e.target).toggleClass('strike');
|
||||
|
||||
const element = $(e.target);
|
||||
const taskId = element.data('id');
|
||||
const isComplete = element.data('complete');
|
||||
|
||||
console.info(`Task ID: ${taskId}, Is Complete: ${isComplete}`);
|
||||
|
||||
// Toggle the strike class on the task list item.
|
||||
element.toggleClass('strike');
|
||||
|
||||
const isCompleted = isComplete ? false : true;
|
||||
// const isCompleted = element.hasClass('strike') ? false : true;
|
||||
|
||||
// Update the data attribute
|
||||
element.data('complete', isCompleted);
|
||||
// element.attr('data-complete', isCompleted);
|
||||
|
||||
// Send a request to update the database.
|
||||
$.ajax({
|
||||
url: 'server.php',
|
||||
method: 'POST',
|
||||
data: {
|
||||
action: 'update',
|
||||
taskId: taskId,
|
||||
isCompleted: isCompleted
|
||||
},
|
||||
success: (res) => {
|
||||
console.info('Updated task', res);
|
||||
},
|
||||
error: (error) => {
|
||||
console.error("Error updating task", error);
|
||||
}
|
||||
})
|
||||
|
||||
console.info(`Task ID: ${taskId}, Is Completed: ${isCompleted}`);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user