Input reactpy

[yickysan]

Hello, I've been wondering if there's anyway to get input data from forms in reactpy

[Archmonger]

You can attach an on_submit event handler event to any html.form to see the submission values.

For example, with the following simple application...

from pprint import pprint

from reactpy import component, event, html, run


@component
def example():
    
    @event(prevent_default=True)
    def on_submit(event):
        pprint(event)

    return html.form(
        {"on_submit": on_submit},
        html.input({"type": "text"}),
        html.input({"type": "text"}),
        html.button({"type": "submit"}, "Submit"),
    )


run(example)

You can see the contents of the form submission via the event["target"]["elements"]. The form elements are returned in the same order they were rendered in. The data structure would like this:

{
 ... ,
 'target': {'boundingClientRect': {},
            'elements': [{'boundingClientRect': {},
                          'tagName': 'INPUT',
                          'value': 'example 1'},
                         {'boundingClientRect': {},
                          'tagName': 'INPUT',
                          'value': 'example 2'},
                         {'boundingClientRect': {},
                          'tagName': 'BUTTON',
                          'value': ''}],
            'tagName': 'FORM'},
 ... ,
}

[yickysan]

Thank you very much. This was helpful.