"ReferenceError: is not defined" allthough listed as script in html file

Question

ReferenceError allthough function is defined.

tried renaming

<body>
   <script>
    function yaSuggestion() {
      console.log("hello");
      var input = document.getElementById("yaIsInput");
      var request = new XMLHttpRequest();

      request.open("GET", "http://localhost:3000/issues/get");
      request.addEventListener('load', function (event) {
        if (request.status >= 200 && request.status < 300) {
          //console.log(request.responseText);
        } else {
          //console.warn(request.statusText, request.responseText);
        }
      });
      request.send();
      request.onreadystatechange = processRequest();
      function processRequest() {
        if (request.readyState == 4 && request.status == 200) {
          console.log(request.responseText);
          var res = JSON.parse(request.responseText);
          var suggestions = [];
          for (int i = 0; i < res.length; i++) {
            suggestions.push(res[i].value);
          };
          console.log(suggestions);
        }
      }
    }
  </script>
<input type="text" name="yaIsInput" class="form-control" id="yaIsInput" onchange="yaSuggestion()">
</body>

expected: console output "hello" actual: ReferenceError: yaSuggestion is not defined[Learn More] ya_create:1:1

Should be closed because the problem is caused by a typo. Deal with the first error first. You have a stray } that prevents the function from being defined. — Quentin
– Quentin, Commented Apr 18, 2019 at 11:43
The typo was limited to the question version, which is now updated. Error persists. — Love Credit
– Love Credit, Commented Apr 18, 2019 at 13:10
The error does not persist. The live demo (after your edit) in the question works: i.imgur.com/2sloLBc.png — Quentin
– Quentin, Commented Apr 18, 2019 at 13:11
True. Updated the code snippet to show my actual code. If I run it like this, then the error might occur. Hope you can help here as well. — Love Credit
– Love Credit, Commented Apr 18, 2019 at 13:30
Typo: processRequest(); has an extra () so it calls the function imediately (before the readyState has changed) so the condition request.readyState == 4 && request.status == 200 is never true, so it does nothing. You should be using the load event handler instead. — Quentin
– Quentin, Commented Apr 18, 2019 at 13:35

iliasse · Accepted Answer · 2019-04-18 11:47:22Z

1

Hi first thing you have an additional closing '}' in your script :

use this

 function yaSuggestion() {
          console.log("hello");
          }

second you have to import your script before calling the function :

   <body>
      <script>
        function yaSuggestion() {
          console.log("hello");
          }
      </script>
      <input type="text" name="yaIsInput" class="form-control" id="yaIsInput" onchange="yaSuggestion()">
    </body>

answered Apr 18, 2019 at 11:47

iliasse

2571 silver badge7 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Quentin Over a year ago

The order the code appears in does not matter in this case.

iliasse Over a year ago

@Quentin thank you for pointing that out, I agree with you it won't matter in this case, it is just a good practice to have the script imported before it is used.

Collectives™ on Stack Overflow

"ReferenceError: is not defined" allthough listed as script in html file

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related