CODEWITHSUNDEEP
javascripthtml
Samuel Wash
Samuel Wash

Reputation: 13

HTML/JS User inputs

I am trying to retrieve a text input from an input field using html and js.

HTML

<div class="inputarea">
        <input type="text" value ='' id='myInput' placeholder="What do I need to do?"> 
        <button onclick='todolist().submit()'>SUBMIT</button>
</div>

JS

function todolist(){
    function first(){
        window.open("todolist.html")
    }
    function submit(){
        var userinput = document.getElementById('myInput').value;
        console.log(userinput);
    }
}

When I press submit the console says "Uncaught TypeError: Cannot read property 'submit' of undefined"

Any help would be much appreciated.

Sam.

Upvotes: 0

Views: 61

Answers (2)

Marek Szkudelski
Marek Szkudelski

Reputation: 1132

Probably todolist should be class (EcmaScript 6+). Or you ment to return object from todolist function:

function todolist(){
  return {
     first(){
        window.open("todolist.html")
    },
     submit(){
        var userinput = document.getElementById('myInput').value;
        console.log(userinput);
    } 
  }
}

todolist().submit();

Upvotes: 1

User863
User863

Reputation: 20039

Try returning the functions

function todolist() {
  function first() {
    window.open("todolist.html")
  }

  function submit() {
    var userinput = document.getElementById('myInput').value;
    console.log(userinput);
  }
  return {first, submit};
}
<div class="inputarea">
  <input type="text" value='' id='myInput' placeholder="What do I need to do?">
  <button onclick='todolist().submit()'>SUBMIT</button>
</div>

Upvotes: 3

Related Questions