#Uncaught TypeError TypeError: Cannot set properties of null (setting 'value') at <anonymous> (c:

6 messages · Page 1 of 1 (latest)

clear yew
#

let tasks = [];
function $(id) {
return document.getElementById(id);
}
let taskList = $("taskListDisplay");
let tasksString = "";
for (let i = 0; i < tasks.length; i++) {
tasksString += (i+1) + ". " + tasks[i] + "\n";
}
taskList.value = tasksString;

for (let i = 0; i < tasks.length; i++) {
tasksString += (i+1) + ". " + tasks[i] + "\n";
}
if (tasks.length === 0) {
taskList.value = "";
} else {
taskList.value = tasksString;
}
const addTask = function() {
let invalidTask = $("invalidTask");
invalidTask.value = "";
let task = $("taskInput").value;
if (task.length === 0) {
invalidTask.value = "Task cannot be blank";
} else {
tasks.push(task);
updateTaskList();
}
}
let sortTasks = function() {
tasks.sort();
updateTaskList();
}
let deleteTask = function(id) {
tasks.splice(id, 1);
updateTaskList();
};
deleteTask = (id) => {

let deleteErrors = $("invalidTaskNumber");

deleteErrors.value = "";
let taskToDelete = $("taskToDeleteInput").value;

if (tasks.length === 0) {
  deleteErrors.value = "No tasks to delete";
      
} else if (taskToDelete.length === 0) {
  deleteErrors.value = "Enter a task number to delete";

} else if (isNaN(taskToDelete)) {
  deleteErrors.value = "You did not enter a number";

} else if (tasks[taskToDelete - 1] === undefined) {
  deleteErrors.value = "A task with that number does not exist.";
} else {
  tasks.splice(taskToDelete - 1, 1);
  updateTaskList();
}
$("addTask").addEventListener("click", addTask);
$("sortTasks").addEventListener("click", sortTasks);
$("deleteTask").addEventListener("click", deleteTask);

}

tender rootBOT
#

⌛ This post has been reserved for your question.

Hey @clear yew! Please use /close or the Close Post button above when you're finished. Please remember to follow the help guidelines. This post will be automatically closed after 300 minutes of inactivity.

TIP: Narrow down your issue to simple and precise questions to maximize the chance that others will reply in here.

clear yew
#

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">

<head>
<script type="text/javascript" src="Assignment3.js"></script>
<title>Task List Manager</title>
<style>
.boxes {
float: left;
margin: 10px;
}

    #inputs-box {
      width: 200px;
    }  

    #task-list-box {
      width: 500px;
    }

    .btn-group {
      display: block;
      margin-bottom: 5px;
      width: 100px;
    }

    .error {
      color: #ff0000;
    }

    button {
      margin-top: 5px;
    }
  </style>
</head>
<body>
  <h1>Task List Manager</h1>
  <div id="wrapper"></div>
  <div id="inputs-box" class="boxes">
    <input
      type="text"
      name="task"
      id="taskInput"
      placeholder="Enter a task"
    />
    <button id="addTask">Add Task</button>
    <p id="invalidTask" class="error"></p>
  </div>
  <div id="task-list-box" class="boxes">
    <!-- put textarea here --> 
    <textarea
      cols="60"
      rows="6"
      name="taskList"
      id="taskListDisplay"
    ></textarea>
    <button id="sortTasks">Sort Tasks</button>
    <input
      type="text"
      name="taskToDelete"
      id="taskToDeleteInput"
      size="4"
    /><button id="deleteTask">
      Delete Task
    </button>
    <p id="invalidTaskNumber" class="error"></p>
  </div>
</body>

</html>

high solar
#

and please don't spam code like this in the actual js server