Vizard - vizhtml

Form Definition

To define forms, you must use the HTML <form> tag. All input elements defined within the <form> tag will be included in the data of the form submission event.

A couple important things to note when defining your HTML form:

1. You must set the method attribute of the form to "post"
   
2. If your HTML is specified in an external file/URL, as opposed to embedded in your script, you must set the action attribute to the vizhtml web server (e.g. "http://localhost:8080/vizhtml_form/")

vizhtml.displayCode(html)

# Wait for form submission
d = yield vizhtml.waitFormSubmit()
# Get data from form
first = d.first_name
last = d.last_name

viztask.schedule( FormTask() )

HTML forms in a remote browser

In order to collect data from an HTML form displayed in a remote browser, a page containing HTML content needs to be registered with vizhtml's local HTTP server. A form submission event will get triggered once a form is submitted and data can be collected using a task or callback function. 

vizhtml.registerCode('form_submit',code)

def HandleForm(e):
    print e.first_name,e.last_name
vizhtml.onFormSubmit(HandleForm)  

Local HTTP server and URLs

- All the communication that occurs between Vizard and a browser or embedded HTML page, whether through forms or WebSocket messages, goes through a local HTTP server built into vizhtml. The commands listed in previous sections to display HTML in the embedded window and register HTML with the local HTTP server automatically start the server.
- The base URL of vizhtml's HTTP server is the default server port (8080) affixed to the computer name or IP address of the machine. The full URL of a page on the server is a combination of the base URL of the server + /vizhtml/ + the page URL.

Collecting form data

- When an HTML form in a remote browser or embedded HTML window is submitted, a vizhtml.FORM_SUBMIT_EVENT is generated. The event can be handled using either a task or callback function.

vizhtml.waitFormSubmit()

Waits until a form submit event occurs. The yielded command returns a viz.Data object that holds the form data.

vizhtml.onFormSubmit(func, *args, **kw)

Registers a callback function for a form submission event: func: The function being registered. An event object e, holding form data, will be passed to this callback function. *args: Optional arguments to pass to the registered function. **kw: Optional keyword arguments to pass to the registered function.

WebSocket communication

- Real time bidirectional communication between Vizard and a web browser is supported using WebSockets. You can send and receive messages and find out when socket connections open or close. On the server (Vizard) side, the vizhtml module provides Vizard commands for sending messages and handling message and connection events. Similar functionality is provided on the client (browser) side using JavaScript functions through vizhtml's JavaScript library.