📜  TurboGears – ToscaWidgets表单

📅  最后修改于: 2020-10-19 03:30:39             🧑  作者: Mango


任何Web应用程序最重要的方面之一就是为用户提供用户界面。 HTML提供了一个

标记,用于设计界面。可以适当使用Form的元素,例如文本输入,单选,选择等。用户输入的数据通过GET或POST方法以Http请求消息的形式提交到服务器端脚本。

服务器端脚本必须根据http请求数据重新创建表单元素。因此,要达到这种效果,必须两次定义表单元素,一次是在HTML中定义,一次是在服务器端脚本中定义。

使用HTML表单的另一个缺点是很难(如果不是不可能)动态呈现表单元素。 HTML本身无法提供验证用户输入的方法。

ToscaWidgets2

TurboGears依赖于ToscaWidgets2,这是一个灵活的表单呈现和验证库。使用ToscaWidgets,我们可以在Python脚本中定义表单字段,并使用HTML模板呈现它们。也可以将验证应用于tw2字段。

ToscaWidgets库是许多模块的集合。下面列出了一些重要的模块-

  • tw2.core-它提供核心功能。此模块中的小部件不适用于最终用户。

  • tw2.forms-这是一个基本的表单库。它包含用于字段,字段集和表单的小部件。

  • tw2.dynforms-这包含动态表单功能。

  • tw2.sqla-这是SQLAlchemy数据库的接口。

tw2.forms

它包含一个Form类,该类充当自定义表单的基础。有一个TableForm类可用于呈现两列表中的字段。 ListForm将其字段显示在无序列表中。

Sr.No. Fields & Description
1

TextField

A single line text input field

2

TextArea

Multi-line text input field

3

CheckBox

Presents a checkable rectangular box with label

4

CheckBoxList

Multi-selectable group pf check boxes

5

RadioButton

A toggle button to select/deselect

6

RadioButtonList

Group of mutually exclusive Radio buttons

7

PasswordField

Similar to Textfield but input keys are not revealed

8

CalendarDatePicker

Lets the user to choose a date

9

SubmitButton

Button to submit a form

10

ImageButton

Clickable button with an image on top

11

SingleSelectField

Enables selection of single item from a list

12

MultipleSelectField

Enables selection of multiple items from the list

13

FileField

Field for uploading file

14

EmailField

An email input field

15

URLField

An input field to enter URL

16

NumberField

A number spinbox

17

RangeField

A number slider

在下面的示例中,使用其中一些小部件构造表单。尽管大多数这些小部件都是在tw2.forms中定义的,但CalendarDateField是在tw2.Dynforms模块中定义的。因此,这两个模块以及tw2.core都在开始时导入-

import tw2.core as twc
import tw2.forms as twf
import tw2.dynforms as twd

ToscaWidgets表单是从tw2.forms.form基类派生的类。所需的小部件放置在Layout对象中。在此示例中,使用TableLayout 。小部件在两列表中呈现。第一列显示标题,第二列显示输入或选择字段。

使用以下构造函数创建TextField对象-

twf.TextField(size, value = None)

如果未提及,则TextField对象采用默认大小,最初为空白。在声明TextArea对象时,可以提及行数和列数。

twf.TextArea("",rows = 5, cols = 30)

NumberField对象是一个TextField,它只能接受数字。在右边框上会产生上下箭头,以增加或减少其中的数字。初始值也可以在构造函数中指定为参数。

twf.NumberField(value)

在CalendarDatePicker框的右侧,显示一个日历按钮。按下时,日期选择器会弹出。用户可以在框中手动键入日期或从日期选择器中选择。

twd.CalendarDatePicker()

EmailField对象提供一个TextField,但是其中的文本必须为电子邮件格式。

EmailID = twf.EmailField()

以下形式也有一个RadioButtonList。此类的构造函数包含一个List对象,作为options参数的值。每个选项的单选按钮将被渲染。默认选择是通过value参数指定的。

twf.RadioButtonList(options = ["option1","option2"],value = option1)

CheckBoxList呈现列表中每个选项的复选框。

twf.CheckBoxList(options = [option1, option2, option3])

下拉列表在此ToscaWidgets库中称为SingleSelectfield。列表对象中与options参数对应的项目构成下拉列表。可见字幕设置为hint_text参数的值。

twf.SingleSelectField(prompt_text = 'text', options=['item1', 'item2', 'item3'])

默认情况下,该表单显示一个“提交”按钮,其标题为“保存”。为了显示另一个标题,创建一个SubmitButton对象并将其指定为value参数。

twf.SubmitButton(value = 'Submit')

表单被提交到URL,该URL被指定为表单的action参数的值。默认情况下,表单数据是通过http POST方法提交的。

action = 'URL'

在下面的代码中,使用上述小部件设计了名为AdmissionForm的表单。将此代码添加到RootController类之前的root.py中。

class AdmissionForm(twf.Form):
   class child(twf.TableLayout):
      NameOfStudent = twf.TextField(size = 20)
      AddressForCorrespondance = twf.TextArea("", rows = 5, cols = 30)
      PINCODE = twf.NumberField(value = 431602)
      DateOfBirth = twd.CalendarDatePicker()
      EmailID = twf.EmailField()
      Gender = twf.RadioButtonList(options = ["Male","Female"],value = 'Male')
      Subjects = twf.CheckBoxList(options = ['TurboGears', 'Flask', 'Django', 'Pyramid'])

      MediumOfInstruction = twf.SingleSelectField(prompt_text = 'choose',
         options = ['English', 'Hindi', 'Marathi', 'Telugu'])
            
      action = '/save_form'
      submit = twf.SubmitButton(value ='Submit')

现在将此代码另存为twform.html在模板目录中-

TurboGears Form Example
   
   
   
      
${form.display(value = dict(title = 'default title'))}

在RootController类中(在root.py中),添加以下控制器函数-

@expose('hello.templates.twform')
def twform(self, *args, **kw):
   return dict(page = 'twform', form = MovieForm)

在AdmissionForm类中,我们规定了/ save_form作为操作URL。因此,在RootController中添加save_form()函数。

@expose()
def save_movie(self, **kw):
   return str(kw)

确保服务器正在运行(使用变速箱服务)。在浏览器中输入http:// localhost:8080 / twform

形式

按下提交按钮会将这些数据发布到save_form() URL,该URL将以字典对象的形式显示表单数据。

{
   'EmailID': u'lathkar@yahoo.com', 
   'NameOfStudent': u'Malhar Lathkar', 
   'Gender': u'Male', 
   'PINCODE': u'431602', 
   'DateOfBirth': u'2015-12-29', 
   'Subjects': [u'TurboGears', u'Flask', u'Django'], 
   'MediumOfInstruction': u'', 
   'AddressForCorrespondance': u'Shivaji Nagar\r\nNanded\r\nMaharashtra'
}