pyscript index error while calling input from html form

pyscript index error while calling input from html form - Printable Version

+- Python Forum (https://python-forum.io)
+-- Forum: Python Coding (https://python-forum.io/forum-7.html)
+--- Forum: General Coding Help (https://python-forum.io/forum-8.html)
+--- Thread: pyscript index error while calling input from html form (/thread-40016.html)

pyscript index error while calling input from html form - pyscript_dude - May-19-2023

Hi,
I am trying to embed a python script into an html page via pyscript. I want to call the input from an html form. In python script, if I use

input = "word"

everything works fine, however if I use

word = Element('word').value

then it gives

Error:
IndexError: range object index out of range

Of course I used an html form as follows

	<form onsubmit="return false">
	<label>Enter the word:</label>
    <input type="text" id="word">
    </form>

Any ideas and suggestions to solve this problem would be appreciated. Thank you.

RE: pyscript index error while calling input from html form - SpongeB0B - May-20-2023

Hi @pyscript_dude,

I don't use pyscript, but Brython

but for what it look like, it seem that

word = Element('word').value

return an iterable and you are out of index. Maybe you need to access it trough something like

word = Element('word')[0].value

look in the documentation of pyscript what type of object return Element()

Cheers.

RE: pyscript index error while calling input from html form - snippsat - May-21-2023

You should post a a woking example of you code,as PyScript is new and not many have experience with it.
So eg is this example i make normal form with input field and button that the output what typed in the the form field.
It normal to have button that submit the form,your code dos not show if this is the case.

<html>  
<head>
  <title>HTML Forms with PyScript</title>
  <link rel="stylesheet" href="https://pyscript.net/latest/pyscript.css" />
  <script defer src="https://pyscript.net/latest/pyscript.js"></script> 
</head>

<style>
  #form {
    display: inline;
    vertical-align: top;
    text-align: center;
  }

  #form input[type="text"] {
    margin: 0;
  }

  #form input[type="text"] {
    margin: 0;
    vertical-align: top;
  }

 label{
    width: 10px;
    display: block;
    white-space: nowrap;
  }
</style>

<body>
  <form id="form" onsubmit="return false">
    <label>Enter the word:</label>
    <input type="text" id="word">
  </form>
  <input py-click="sub()" type="submit" id="btn-form" value="submit">
  <p>Output:</p>
  <p id='output'></p>

  <py-script>
    def sub():
        result = Element('output')
        result.write(Element('word').value)
  </py-script>
</body>
</html>