Validating user input¶
Reahl does validation of user input differently. You declare what Fields of an object can be input by a user. When creating an Input Widget, you link it to such a Field. The same Field can be reused by different Inputs on different screens. (There’s more to Fields than this, but this is the basic idea.)
What you get is validations done in JavaScript on the browser, but the same validations are also performed server-side if the user switched off JavaScript or when a malicious attempt is done to try and circumvent your validations.
Our example only has a single Input, with its EmailField:
If you type an invalid email address and hit tab, the typed input is checked and a specific error message is shown:
The error message changes while the user types to indicate a different ValidationConstraint is now failing:
When the input is changed to a valid value, the message disappears:
Below is the complete source code for this example, followed by an explanation:
from __future__ import print_function, unicode_literals, absolute_import, division
from reahl.web.fw import UserInterface
from reahl.web.ui import HTML5Page, Form, TextInput
from reahl.component.modelinterface import exposed, EmailField
class ValidationUI(UserInterface):
def assemble(self):
self.define_view('/', title='Validation demo', page=HomePage.factory())
class HomePage(HTML5Page):
def __init__(self, view):
super(HomePage, self).__init__(view, style='basic')
self.body.add_child(CommentForm(view))
class Comment(object):
@exposed
def fields(self, fields):
fields.email_address = EmailField(label='Email address', required=True)
class CommentForm(Form):
def __init__(self, view):
super(CommentForm, self).__init__(view, 'myform')
comment = Comment()
self.add_child( TextInput(self, comment.fields.email_address) )
This application models the concept of a Comment, which is meant to represent a comment which can be left by a user. The idea is that users can leave comments, but have to “sign” each comment using their email address.
Comment is said to @expose certain Fields which are used to receive input from a user. In this case, a Comment has an email_address attribute, exposed via an EmailField.
In the code for the CommentForm (the very last line) a TextInput Widget is connected to the email_address field of a particular Comment. This EmailField is responsible for validating user input.