How to get html form, process it with py script and display it on screen?

Question:

I have a question about how html+py script works.
….
I get 3 values ​​of trapezoidal data from html: height, length of side 1 and length of side 2, then press submit.
and send the value that the user has entered let’s calculate with py script
Then show the secret result on the screen.
But the results showed that There are no hidden effects on the screen at all.
How should I fix it?
thank you

this is my code

<!DOCTYPE>
<html lang="th">
<head>
    <meta charset="UTF-8">
    <title>
trapezoidal 
    </title>

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

</head>
<body>
    <form  onsubmit="return false">
        <label for="w1">1st side length:</label><br>
        <input type="number" step="any" id="w1" name="w1" ><br>    
        <label for="w2">2st side length:</label><br>
        <input type="number" step="any" id="w2" name="w2" ><br>   
        <label for="h">height:</label><br>
        <input type="number" step="any" id="h" name="h" ><br>   
        <input pys-onClick="whcalc" type="submit" id="btn-form" value="submit">
    </form>

    <p id = 'output'></p>

<py-script>
def whcalc(*args,**kwargs):
    w1= float(Element('w1').value)
    w2= float(Element('w2').value)
    h= float(Element('h').value)
    result_place = Element('output')
#except:
    w1 = 0.0
    w2 = 0.0
    h = 0.0
    if w1 > 0 and w2 > 0 and h > 0:
        s = 1/2*h*w1+w2
        result_place.write('this is trapezoidal ', s)
    </py-script>   
</body>
</html>
Asked By: Phimwaree

||

Answers:

You set all your variables to 0.0 before checking their values, which means your condition (if w1 > 0 and w2 > 0 and h > 0) will always evaluate to False, thus never printing anything in your output element.

Remove the following lines and your script will work:

w1 = 0.0
w2 = 0.0
h = 0.0

Also if you meant to display the value, you will need to change the following line:

result_place.write('this is trapezoidal ', s)

to this:

result_place.write('this is trapezoidal ' + str(s))

Codepen: https://codepen.io/roboto/pen/mdKxmxx

Answered By: roboto

Thank you. With your method I was able to actually work with it.

Answered By: Phimwaree
Categories: questions Tags: , , ,
Answers are sorted by their score. The answer accepted by the question owner as the best is marked with
at the top-right corner.