I basically just posted a question related to this task so I apologize if it seems really repetitive but I ran into another problem.
So basically I'm creating a program that allows the user to create and manage a ‘to-do list’ by getting the user to add and remove items. Currently if the user enters something in the textbox and clicks the add button, a new checkbox is made. I'm trying to get it so that the user can also remove checkboxes/items by checking a box and clicking the remove button. I tried writing a program in an attempt to do the above, but when I went to run it in my html browser, it didn't do anything and I'm not sure why.
HTML CODE:
<html>
<head>
<title>Checklist</title>
</head>
<body>
<div><h1>My to-do list</h1></div><br />
<div id ="myCheckList">Enter an item:</div>
<div>Type something: <input type="text" id="textbox"></input></div>
<input type="button" id="addBut" value = "Add item" onclick="addItem()"/>
<input type="button" id="removeBut" value = "Remove items" onclick="removeItem()"/>
<input type="button" id="toggleBut" value = "Toggle highlight" onclick="toggle()"/>
<input type="button" id="sortBut" value = "Sort items" onclick="sort()"/>
<script src="addHandler.js"></script>
<div id="checklist_items"></div>
</body>
</html>
JAVASCRIPT CODE:
function addItem() {
var input = document.getElementById("textbox");
var wrapper = document.getElementById("checklist_items");
if(input.value.trim() != "") {
var new_element = document.createElement("DIV");
new_element.innerHTML = '<input type="checkbox"> '+input.value;
wrapper.appendChild(new_element);
}
else {
alert("You must enter at least 1 character.");
}
}
function removeItem(){
if (document.getElementById('checklist_items').checked){
("checklist_items").remove();
}
}
Aucun commentaire:
Enregistrer un commentaire