this is code for my to-do list web app. the Task.php is for my functions the testcreatetasks works well and add the test task to my db, but when i want the createtask func to save my inputs it doesnt work there is no error or misstakes in my connection.php or anything else i want to save inputs data from my html into my database this is the js:
function clock() {
let d = new Date();
let day = d.getDay();
let date = d.getDate();
let month = d.getMonth();
let daysOF = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
let monthsOF = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
let time = ` ${daysOF[day]}, ${monthsOF[month]} ${date}`;
document.querySelector('.dayMonth').textContent = time;
setTimeout(clock, 1000);
}
let addList = document.querySelector('.addList');
let addingNote = document.querySelector('.addingNote');
let description = document.querySelector('.description');
addList.addEventListener('input', () => {
if (addList.value) {
addingNote.style.display = 'block';
description.style.display = 'block';
} else {
addingNote.style.display = 'none';
description.style.display = 'none';
}
});
document.addEventListener('DOMContentLoaded', function () {
let listContain = document.querySelector('.ListOfWork');
let addButton = document.querySelector('.addButton');
let numPinned = document.querySelector('.numberOfPins');
let completedTask = document.querySelector('.completedTask');
numPinned.textContent = 0;
completedTask.textContent = 0;
addButton.addEventListener('click', () => {
if (addList.value.trim() !== '') {
let taskActive = document.createElement('div');
taskActive.classList.add('taskActive');
listContain.appendChild(taskActive);
let taskHead = document.createElement('h2');
taskHead.classList.add('TextAdded');
taskHead.textContent = addList.value;
taskActive.appendChild(taskHead);
let takeDescription = document.createElement('div');
takeDescription.classList.add('descriptionAdded');
takeDescription.textContent = `Notes: ${description.value}`;
taskActive.appendChild(takeDescription);
let takeEdit = document.createElement('i');
takeEdit.classList.add('fa-solid', 'fa-ellipsis-vertical', 'editing');
taskActive.appendChild(takeEdit);
let taskDone = document.createElement('input');
taskDone.classList.add('taskDone');
taskDone.type = 'checkbox';
taskActive.appendChild(taskDone);
let editAllText = document.createElement('div');
editAllText.classList.add('editAllText');
takeEdit.appendChild(editAllText);
let editInnerText = document.createElement('button');
editInnerText.classList.add('editInnerText');
editInnerText.textContent = `Edit`;
editAllText.appendChild(editInnerText);
editInnerText.addEventListener('click', () => {
const isEditable = taskHead.contentEditable === 'true';
taskHead.contentEditable = !isEditable;
takeDescription.contentEditable = !isEditable;
if (taskHead.contentEditable === 'true') {
taskHead.style.border = '1px dotted #ffffff7c';
takeDescription.style.border = '1px dotted #ffffff7c';
editInnerText.textContent = 'Editted';
} else {
taskHead.style.border = '0px';
takeDescription.style.border = '0px';
editInnerText.textContent = 'Edit';
}
const taskData = {
title: taskHead.textContent,
description: takeDescription.textContent
};
const xhr = new XMLHttpRequest();
const url = 'Task.php';
xhr.open('POST', url, true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onreadystatechange = function () {
if (xhr.readyState === XMLHttpRequest.DONE) {
if (xhr.status === 200) {
// Task was added successfully
const response = JSON.parse(xhr.responseText);
console.log(response.message);
} else {
console.error('Error adding task:', xhr.status, xhr.statusText);
}
}
};
xhr.send(JSON.stringify(taskData));
addList.value = '';
description.value = '';
});
let removeInnerText = document.createElement('button');
removeInnerText.classList.add('removeInnerText');
removeInnerText.textContent = `Delete`;
editAllText.appendChild(removeInnerText);
removeInnerText.addEventListener('click', () => {
taskActive.remove();
});
taskDone.addEventListener('click', () => {
if (taskDone.checked) {
taskActive.style.opacity = '0.4';
takeEdit.style.pointerEvents = 'none';
completedTask.textContent = ++completedTask.textContent;
} else {
taskActive.style.opacity = '1';
takeEdit.style.pointerEvents = 'fill';
completedTask.textContent = --completedTask.textContent;
}
});
let pinTop = document.createElement('button');
pinTop.classList.add('pinTop');
pinTop.textContent = `Pin`;
editAllText.appendChild(pinTop);
pinTop.addEventListener('click', () => {
if (listContain.contains(taskActive)) {
listContain.removeChild(taskActive);
pinTop.textContent = `Pin`;
numPinned.textContent = --numPinned.textContent;
} else {
listContain.appendChild(taskActive);
pinTop.textContent = `Unpin`;
numPinned.textContent = ++numPinned.textContent;
}
});
addList.value = '';
description.value = '';
}
});
clock();
});
ere
and this is my Task.php:
<?php
class Task
{
private $pdo;
public function __construct($pdo)
{
$this->pdo = $pdo;
}
public function getAllTasks()
{
$query = "SELECT * FROM tables";
$statement = $this->pdo->query($query);
$tasks = $statement->fetchAll(PDO::FETCH_ASSOC);
return $tasks;
}
public function getTaskById($id)
{
$query = "SELECT * FROM tables WHERE id= :id";
$statement = $this->pdo->prepare($query);
$statement->bindValue(":id", $id, PDO::PARAM_INT);
$statement->execute();
$task = $statement->fetch(PDO::FETCH_ASSOC);
return $task ? $task : null;
}
public function updateTask($id, $title, $description = '', $status = 0)
{
$query = "UPDATE tables SET title=:title,description=:description, status=:status WHERE id=:id";
$statement = $this->pdo->prepare($query);
$statement->bindVaLUE(":id", $id, PDO::PARAM_INT);
$statement->bindValue(":description", $description, PDO::PARAM_STR);
$statement->bindValue(':status', $status, PDO::PARAM_INT);
$statement->bindValue(":title", $title, PDO::PARAM_STR);
return $statement->execute();
}
public function deleteTask($id)
{
$query = "DELETE FROM tables WHERE id=:id";
$statement = $this->pdo->prepare($query);
$statement->bindValue(":id", $id, PDO::PARAM_INT);
return $statement->execute();
}
public function testCreateTask()
{
$title = "Test Task";
$description = "This is a test task.";
$taskId = $this->createTask($title, $description);
echo "Test Task created with ID: " . $taskId;
}
}
$pdo = require_once "connection.php";
$task = new Task($pdo);
$task->CreateTask();
type here
help me please:))))))))))))))
i want it to save my data in my db