}
public function addTask($pdo, $userId, $task){
- $query = 'INSERT INTO tasks (task, user_id) VALUES (:task, :userId)';
+ $query = 'INSERT INTO tasks (task, user_id) VALUES (:task, :userId);';
$stmt = $pdo->prepare($query);
$stmt->bindParam(':task', $task);
$stmt->bindParam(':userId', $userId);
$stmt->execute();
}
+
+ public function deleteTask($pdo, $taskId){
+ $query = 'DELETE FROM tasks WHERE task_id = :taskId;';
+ $stmt = $pdo->prepare($query);
+ $stmt->bindParam(':taskId', $taskId);
+ $stmt->execute();
+ }
}
\ No newline at end of file
1. encrypt passwords on signup
2. add a session timer when user logged in
3. don't give direct access to paths esp. when usr. is not logged in or that path must not be accessible
-4. add a short animation loading progress bar when user did some actions to a task
-5. create 'deleting task' feature
+4. add a short animation loading progress bar when user did some actions to a task
6. create 'editing task' feature
7. create 'task sorting' feature
8. create 'task search' feature
\ No newline at end of file
transition-duration: 0.2s;
transition-property: visibility, opacity;
}
+ .table-container {
+ overflow: hidden;
+ overflow-y: scroll;
+ height: 200px;
+ }
+ thead {
+ top: 0;
+ z-index: 2;
+ position: sticky;
+ }
+ table {
+ width: 290px;
+ }
</style>
</head>
<body style="display: flex; justify-content: center; align-items: center;">
<button type="button" id="new-task-popup-open">Add task</button>
</div>
- <div class="field-row-stacked">
+ <div class="field-row-stacked" style="float: right; margin-left: 7px;">
+ <button type="button" id="edit-task" disabled>Edit</button>
+ <button type="button" id="delete-task" disabled>Delete</button>
+ </div>
+
+ <div class="field-row-stacked table-container">
<table class="has-shadow">
<thead>
<tr>
- <th style="width: 25px;"></th>
- <th>task</th>
- <th>created date</th>
+ <th style="width: 15%;"></th>
+ <th style="width: 85%; text-align: center;">Task</th>
</tr>
</thead>
<tbody id="task-body">
header('Content-Type: application/json');
if($_SERVER['REQUEST_METHOD'] === 'POST'){
- // will add here soon...
+ $taskIds = json_decode(file_get_contents('php://input'), true);
+
+ try{
+ $dbconn = new DbConn();
+ $pdo = $dbconn->getPdo();
+
+ $userId = $_SESSION['user_data']['user_id'];
+ $tasks = new Tasks($pdo, $userId);
+ $error = $tasks->error;
+
+ foreach($taskIds as $taskId){
+ $tasks->isInputEmpty($taskId);
+ if(empty($error)){
+ $tasks->deleteTask($pdo, $taskId);
+ }
+ }
+
+ if(empty($error)){
+ $response = [
+ 'status' => 'success',
+ 'message' => 'Task deleted successfully!',
+ ];
+ } else{
+ $response = [
+ 'status' => 'failed',
+ 'message' => 'Failed to delete task.',
+ ];
+ }
+
+ echo json_encode($response);
+
+ } catch(PDOException $e){
+ die("Query failed: {$e}");
+ }
}
\ No newline at end of file
const tr = document.createElement('tr');
tr.innerHTML = `
<td style="text-align: center;">
- <input type="checkbox" id="checkbox_${task.task_id}">
- <label for="checkbox_${task.task_id}"></label>
+ <input type="checkbox" id="${task.task_id}">
+ <label for="${task.task_id}"></label>
</td>
<td>${task.task}</td>
- <td>${task.created_datetime}</td>
`;
tbody.appendChild(tr);
+
+ // listen for checkboxes after loading tasks in DOM
+ addCheckboxListeners();
});
} else{
const tr = document.createElement('tr');
});
}
+function addCheckboxListeners(){
+ const checkboxes = document.querySelectorAll('#task-body input[type="checkbox"]');
+
+ checkboxes.forEach(function(checkbox){
+ checkbox.addEventListener('change', function(){
+ const isAnyChecked = Array.from(checkboxes).some(function(checkbox){
+ return checkbox.checked;
+ });
+
+ if(isAnyChecked){
+ removeDisabledAttributes();
+ } else{
+ setDisabledAttributes();
+ }
+ });
+ });
+}
+
+function removeDisabledAttributes(){
+ document.getElementById('edit-task').removeAttribute('disabled');
+ document.getElementById('delete-task').removeAttribute('disabled');
+};
+
+function setDisabledAttributes(){
+ document.getElementById('edit-task').setAttribute('disabled', true);
+ document.getElementById('delete-task').setAttribute('disabled', true);
+};
+
function addTask(){ // adding task on database
const taskInput = document.getElementById('task-name');
const formData = new FormData(addTaskForm);
console.log('Response from server:', data);
console.log('Status:', data.status);
console.log('Message:', data.message);
+ setTimeout(function(){
+ loadTasks();
+ }, 500);
+ setDisabledAttributes();
+ popupNewTaskClose();
})
- .catch(function(err){
- console.error(err);
+ .catch(function(error){
+ console.error(error);
});
-
- setTimeout(function(){
+}
+
+function deleteTask(){
+ const checkboxes = document.querySelectorAll('#task-body input[type="checkbox"]');
+ let isCheckedArray = [];
+
+ for(let checkbox of checkboxes){
+ if(checkbox.checked){
+ isCheckedArray.push(checkbox.id);
+ }
+ }
+
+ // after iterating and finding the id of a checkbox that is checked...
+ fetch('./includes/delete_task.php', {
+ method: 'POST',
+ headers: { 'Content-Type': 'application/json' },
+ body: JSON.stringify(isCheckedArray)
+ })
+ .then(function(response){
+ return response.json();
+ })
+ .then(function(data){
+ console.log('Response from server:', data);
+ console.log('Status:', data.status);
+ console.log('Message:', data.message);
+ setTimeout(function(){
loadTasks();
- }, 500);
-
- popupNewTaskClose();
+ }, 500);
+ setDisabledAttributes();
+ })
+ .catch(function(error){
+ console.error(error);
+ });
}
function resetTaskInputPlaceholder(){
addTask();
});
+document.getElementById('delete-task').addEventListener('click', function(e){
+ e.preventDefault();
+ deleteTask();
+});
// calls
loadTasks();
\ No newline at end of file
repos / QuestLog.git / commitdiff