Pyscript: how to check the user input value

Hi, we’ve been talking a lot of pyscript lately, because it seems a very interesting project, still in an alpha release at the moment, to use python inside the browser.

Today I want to answer to a request about how to get the user input with pyscript. Here is the answer with this code:

<!DOCTYPE html>

<html>

<head>
  <!-- <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" /> -->
  <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
</head>

<body>
  <div>How is 2 + 2</div>
  <input type="text" id="test-input"/>
  <button id="submit-button" type="submit" pys-onClick="my_function">OK</button>
  <div id="test-output"></div>

<py-script>

def my_function(*args, **kwargs):


    text = Element('test-input').element.value

    if text == "4":
        Element('test-output').element.innerText = "Your answer is right"
    else:
        Element('test-output').element.innerText = "Nope"
</py-script>

  </body>
</html>

Save this file as an html file and launch it, wait that everyting is loaded, insert the values …

…Wait a moment after the loading runtime text disappears to see if it works

First try with wrong answer