easy_install tw.jquery
The AjaxForm widget supports the following parameters:
id The id of the form. The submit action of this form triggers the Ajax Request.
fields The form fields. The fields could be a WidgetList object created like this:
from formencode import validators
from tw.forms.fields import TextField, TextArea, CheckBox
from tw.api import WidgetsList
class CommentFields(WidgetsList):
"""The WidgetsList defines the fields of the form."""
name = TextField(validator=validators.NotEmpty())
email = TextField(validator=validators.Email(not_empty=True),
attrs={'size':30})
comment = TextArea(validator=validators.NotEmpty())
notify = CheckBox(label="Notify me")
action The url for the controller method that would handle the Ajax Request.
A simple AjaxForm widget may be instantiated as:
from tw.jquery import AjaxForm
my_ajax_form = AjaxForm(id="myAjaxForm",
fields=CommentFields(),
target="output",
action="do_search")
The form can then be served up to the user via a controller method like this:
@expose('mypackage.templates.myformtemplate')
def entry(self, **kw):
tg.tmpl_context.form = my_ajax_form
return dict(value=kw)
And your template form would display your form like this:
<div py:replace="tmpl_context.form(value)">your form goes here</div>
<div id="output">your output goes here</div>
And here is the resulting field when viewed from a browser:
The template generates the necessary javascript code to send the Ajax request when the form is submitted.
The controller code for generating the response would be something like:
@expose()
@validate(ajax_form, error_handler=entry)
def do_search(self, **kw):
return "<p>Recieved Data:<br/>%(name)s<br/>%(email)s<br/>%(comment)s<br/>%(notify)s<br/></p>" % kw
The output would be rendered inside a div element called output, which is the default target element.
This is how the page looks like after the form has been successfully submitted:
– TODO: Getting output as JSON and updating a data grid; how to deal with validation –