Code update

public/index.html

@@ -28,7 +28,9 @@ <h3><a href="#" id="createProjectLink" class="button-like">Create Project</a></h
     <div id="createTaskForm" class="hidden">
         <input type="text" id="newTaskTitle" placeholder="Task Title">
         <textarea id="newTaskDescription" placeholder="Task Description"></textarea>
-        <button onclick="createTask()">Create Task</button>    </div>
+        <input type="hidden" id="projectIdField">
+        <button onclick="createTask()">Create Task</button>    
+    </div>
 
         <!-- Projects and Tasks Display Area -->
     <div id="projects" class="main"></div>

public/js/main.js

@@ -82,6 +82,12 @@ function createTask() {
     const description = document.getElementById('newTaskDescription').value;
     const projectId = document.getElementById('projectIdField').value;
 
+    // Log the data being sent to the server
+    console.log("Creating task with the following data:");
+    console.log("Title:", title);
+    console.log("Description:", description);
+    console.log("Project ID:", projectId);
+
     fetch(`/tasks`, {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
@@ -121,6 +127,7 @@ function attachProjectClickHandlers() {
     document.querySelectorAll('.project-link').forEach(projectLink => {
         projectLink.addEventListener('click', function(event) {
             event.preventDefault();
+            console.log("Clicked project ID:", this.getAttribute('data-projectid'));
             currentProjectId = this.getAttribute('data-projectid');
             fetchTasksForProject(currentProjectId);
             showCreateTaskForm();

views/projects.pug

@@ -5,6 +5,6 @@ block content
   ul
     each project in projects
       li
-        a(href=`/projects/${project._id}`) #{project.name}
+        a(href=`/projects/${project._id}`, data-projectid=project._id) #{project.name}
         p #{project.description}
   a(href="/projects/new") Add New Project