0

Code, here let me view the type values in text field in demo

<!DOCTYPE html>
<html>
<body>

     <input type="text" name="fname" onkeyup="keyup(this)"  value>
    
<script>    
function keyup(element)    
{    
element.setAttribute("value",element.value);
   
}
</script>
</body>
</html>

However, when I move the same to actual website, I place the script inside <body> and also in head but I'm getting same error. I think something like an API or polymer js is interfering to find this `keyup' function.

Uncaught ReferenceError: keyup is not defined
    at HTMLDivElement.onkeyup ((index):1)

All the solution on stackoverflow talks about placing the function in head scope which i did but i get same error. I don't know how to invoke this function. Thanks

user316389
  • 87
  • 7
  • 1
    Inline event handlers like `onclick` or `onkeyup` are [not recommended](https://stackoverflow.com/q/11737873/4642212). They are an [obsolete, hard-to-maintain and unintuitive](https://stackoverflow.com/a/43459991/4642212) way of registering events. Always [use `addEventListener`](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#Inline_event_handlers_—_dont_use_these) or a similar functionality provided by the library or framework you use instead. – Sebastian Simon Nov 22 '20 at 12:23

1 Answers1

1

I would recommend to set up the event handler yourself instead of onkeyup=""

Here is a basic event handler for the keyup event.

addEventListener docu

<!DOCTYPE html>
<html lang="en">
    <body>
        Your input <input id="input" type="text" name="fname" />
        <br/>
        Your last input <input id="output" type="text" readonly/>
    </body>


    <script>
        document.getElementById('input').addEventListener('keyup', (event) => {
          console.log('Keyoup even fired', event);
          document.getElementById('output').value = event.key;
        });
    </script>
</html>
Norbert Bartko
  • 2,468
  • 1
  • 17
  • 36
  • great , now the page is no longer giving me `attribute not loaded or found` error message, but i think something is still suppressing the execution of js i tried to put script in `head` as well as `body` and i don't see any console.log messages. – user316389 Nov 22 '20 at 14:34