0

I wrote that code a few days ago and everything was working fine. I rewrote today just to get some practice and now I'm getting "Cannot read property 'value' of undefined". I've spent so much time trying to figure out where I've gone wrong that I can't see the wood for the tree. If that sounds like a beginner question that's because I'm one.

var btn = document.getElementById("btn");
const input = document.getElementById("input");
var elUlList = document.getElementById("uList");


function createListItems() {
  var inputValue = input.value;
  var newLi = document.createElement("li");
  var input = document.createElement("input");
  input.type = "checkbox";
  var newText = document.createTextNode(inputVale);
  newLi.appendChild(input);
  newLi.appendChild(newText);
  elUlList.appendChild(newLi);
}

btn.addEventListener("click", createListItems, false);
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>todoList practice</title>
  </head>
  <body>
    <h1>My to do list</h1>
    <input id="input" type="text" name="" value="">
    <button id="btn" type="click" name="button">add item</button>
    <ul id="uList"></ul>
    <script src="index.js" type="text/javascript"></script>


  </body>
</html>
  • There's only one place that tries to read the content of the `.value` property. Also the script is quite small. You should be able to find the source of the problem... – Andreas Mar 22 '21 at 13:30
  • Additionally... Why is there a `const`? And why only one? – Andreas Mar 22 '21 at 13:32
  • It's the local `input` variable shadowing the global const. Use a different name for the local `input`. – Teemu Mar 22 '21 at 13:33

0 Answers0