Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialRishit Shah
4,975 PointsMy solution to the last problem
Here is my code to solve the adding empty tasks. The problem i am facing is that if i do not enter anything after the "else" statement. It adds multiple list items without any text in them. With the alert statement it works just fine. Please help
var createNewTaskElement = function(taskString){
//create listItem
var listItem = document.createElement("li");
// input checkbox
var checkbox = document.createElement("input");
//create label
var label = document.createElement("label");
//create text
var editInput = document.createElement("input");
//button.edit
var editButton = document.createElement("button");
//button.delete
var deleteButton = document.createElement("button");
//each elements needs modified
checkbox.type = "checkbox";
editInput.type = "text";
editButton.innerText = "Edit";
editButton.className = "edit";
deleteButton.innerText = "Delete";
deleteButton.className = "delete";
label.innerText = taskString;
//each element needs appending append
listItem.appendChild(checkbox);
if (taskString !== ""){
listItem.appendChild(label);
} else{
alert("enter something")
}
listItem.appendChild(editInput);
listItem.appendChild(editButton);
listItem.appendChild(deleteButton);
return listItem;
}
1 Answer
Eina Onting
Courses Plus Student 3,266 PointsWhat I did was add the if statement on the addTask function so it checks the value of taskInput before it even does any appending (or at least that's my understanding of it):
//Add Task
var addTask = function(){
console.log('Add task');
//Create a task -- new list item w/ text from #new-task and the elements inside
//make sure the task has something there
if(taskInput.value.length > 4){
var listItem = createNewTaskEl(taskInput.value);
//Append to Incomplete Task Handler
incompleteTasksHolder.appendChild(listItem);
bindTaskEvents(listItem, completeTask);
//make input blank after submitting
taskInput.value = '';
}else {
alert('There was nothing there! Please type a task on the field.');
}
};
I put 4 just because, asking if it's not an empty string should work too.
Hunter G
6,612 PointsHunter G
6,612 PointsGreat solution, thank you Eina!