HTMLヘルパー

□未翻訳

□翻訳中

■翻訳完了(細田謙二)

■レビュー(Omi Chiba)

HTMLヘルパー

次のようなビューのコードを考えます:

Consider the following code in a view:

1.

{{=DIV('this', 'is', 'a', 'test', _id='123', _class='myclass')}}

これは次のようにレンダリングされます:

it is rendered as:

1.

<div id="123" class="myclass">thisisatest</div>

DIVはヘルパークラスです。つまり、HTMLをプラグラム的に構築するために使われるものです。これは、HTMLの<div>タグに対応します。

DIV is a helper class, i.e., something that can be used to build HTML programmatically. It corresponds to the HTML <div> tag.

位置引数は開始タグと終了タグの間に含まれるオブジェクトとして解釈されます。アンダースコアで始まる名前付き引数は、HTMLタグの(アンダースコアなしの)属性として解釈されます。いくつかのヘルパーは、アンダースコアで始まらない名前付き数をもち、それらの引数はタグ固有のものです。

Positional arguments are interpreted as objects contained between the open and close tags. Named arguments that start with an underscore are interpreted as HTML tag attributes (without the underscore). Some helpers also have named arguments that do not start with underscore; these arguments are tag-specific.

以下のヘルパーのセットは:

The following set of helpers:

A, B, BEAUTIFY, BODY, BR, CENTER, CODE, DIV, EM, EMBED, FIELDSET, FORM, H1, H2, H3, H4, H5, H6, HEAD,HR, HTML, I, IFRAME, IMG, INPUT, LABEL, LEGEND, LI, LINK, OL, UL, MARKMIN, MENU, META, OBJECT, ON,OPTION, P, PRE, SCRIPT, OPTGROUP, SELECT, SPAN, STYLE, TABLE, TAG, TD, TEXTAREA, TH, THEAD,TBODY, TFOOT, TITLE, TR, TT, URL, XHTML, XML, xmlescape, embed64

XMLへとシリアライズできる複雑な表現を構築するのに使用することができます。たとえば:

can be used to build complex expressions that can then be serialized to XML49 50. For example:

1.

{{=DIV(B(I("hello ", "<world>"))), _class="myclass")}}

これは次のようにレンダリングされます:

is rendered:

1.

<div class="myclass"><b><i>hello <world></i></b></div>

web2pyのヘルパーの仕組みは、文字列の連結なしにHTMLを生成するシステム以上のものです。これは、サーバーサイドのドキュメントオブジェクトモデル(DOM)表現を提供します。

The helpers mechanism in web2py is more than a system to generate HTML without concatenating strings. It provides a server-side representation of the Document Object Model (DOM).

コンポーネントのオブジェクトはその位置を介して参照でき、ヘルパーはそれらコンポーネントに対してリストのように機能します。

Components' objects can be referenced via their position, and helpers act as lists with respect to their components:

1.

2.

3.

4.

5.

6.

7.

8.

>>> a = DIV(SPAN('a', 'b'), 'c')

>>> print a

<div><span>ab</span>c</div>

>>> del a[1]

>>> a.append(B('x'))

>>> a[0][0] = 'y'

>>> print a

<div><span>yb</span><b>x</b></div>

ヘルパーの属性は名前で参照することができ、ヘルパーはそれら属性に対して辞書のように機能します:

Attributes of helpers can be referenced by name, and helpers act as dictionaries with respect to their attributes:

1.

2.

3.

4.

5.

>>> a = DIV(SPAN('a', 'b'), 'c')

>>> a['_class'] = 's'

>>> a[0]['_class'] = 't'

>>> print a

<div class="s"><span class="t">ab</span>c</div>

XML

XMLはエスケープされるべきでないテキストを封入するために使用するオブジェクトです。テキストは有効なXMLが含まれる場合もあれば、そうでない場合もあります。たとえば、JavaScriptを含むことができます。

XML is an object used to encapsulate text that should not be escaped. The text may or may not contain valid XML. For example, it could contain JavaScript.

次の例のテキストはエスケープされますが:

The text in this example is escaped:

1.

2.

>>> print DIV("<b>hello</b>")

&lt;b&gt;hello&lt;/b&gt;

次のようにXMLを使用してエスケープを防ぐことができます:

by using XML you can prevent escaping:

1.

2.

>>> print DIV(XML("<b>hello</b>"))

<b>hello</b>

時々、変数に格納されたHTMLをレンダリングしたい場合があります。しかし、HTMLはスクリプトなどの安全でないタグが含まれている可能性があります:

Sometimes you want to render HTML stored in a variable, but the HTML may contain unsafe tags such as scripts:

1.

2.

>>> print XML('<script>alert("unsafe!")</script>')

<script>alert("unsafe!")</script>

このようなエスケープされてない実行可能な入力(たとえば、ブログのコメント本文への入力)は、安全ではありません。これを利用して、そのページの他の訪問者に対してクロスサイトスクリプティング(XSS)攻撃を生み出すことができるからです。

Un-escaped executable input such as this (for example, entered in the body of a comment in a blog) is unsafe, because it can be used to generate Cross Site Scripting (XSS) attacks against other visitors to the page.

web2pyのXMLヘルパーはインジェクションを防ぐためにテキストをサニタイズすることができ、明示的に許可してないものでない限りすべてのタグをエスケープします。これはその例です:

The web2py XML helper can sanitize our text to prevent injections and escape all tags except those that you explicitly allow. Here is an example:

1.

2.

>>> print XML('<script>alert("unsafe!")</script>', sanitize=True)

&lt;script&gt;alert(&quot;unsafe!&quot;)&lt;/script&gt;

XMLのコンストラクタは、デフォルトでは、いくつかのタグの中身とそれらのいくつかの属性が安全であると想定します。このデフォルトは、permitted_tagsとallowd_attributesというオプション引数で上書きすることができます。以下に示すのは、XMLヘルパーのオプション引数のデフォルトの値です。

The XML constructors, by default, consider the content of some tags and some of their attributes safe. You can override the defaults using the optional permitted_tags andallowed_attributes arguments. Here are the default values of the optional arguments of theXML helper.

1.

2.

3.

4.

5.

XML(text, sanitize=False,

permitted_tags=['a', 'b', 'blockquote', 'br/', 'i', 'li',

'ol', 'ul', 'p', 'cite', 'code', 'pre', 'img/'],

allowed_attributes={'a':['href', 'title'],

'img':['src', 'alt'], 'blockquote':['type']})

組み込みヘルパー

Built-in Helpers

A

このヘルパーは、リンクを構築するために使用されます。

This helper is used to build links.

1.

2.

3.

>>> print A('<click>', XML('<b>me</b>'),

_href='http://www.web2py.com')

<a href='http://www.web2py.com'>&lt;click&gt;<b>me/b></a>

このヘルパーは、cidという特殊な引数を取ります。これは次のように動作します:

This helper takes a special argument called cid. It works as follows:

1.

2.

<div id="myid"></div>

{{=A('linked page',_href='http://example.com',cid='myid')}}

そして、このリンクをクリックすると、そのdivに中身がロードされるようになります。これには、レイアウトのヘッドに{{include 'web2py_ajax.html'}}が必要です。

and a click on the link causes the content to be loaded in the div. This requires {{include 'web2py_ajax.html'}} in the layout head.

cidの詳細については第13章でコンポーネントの文脈において説明します。

We discuss applications of cid in more detail in Chapter 13, in the context of components.

B

このヘルパーは、その中身を太字にします。

This helper makes its contents bold.

1.

2.

>>> print B('<hello>', XML('<i>world</i>'), _class='test', _id=0)

<b id="0" class="test">&lt;hello&gt;<i>world</i></b>

BODY

このヘルパーは、ページのbodyを作成します。

This helper makes the body of a page.

1.

2.

>>> print BODY('<hello>', XML('<b>world</b>'), _bgcolor='red')

<body bgcolor="red">&lt;hello&gt;<b>world</b></body>

CENTER

このヘルパーは、その中身を中央に配置します。

This helper centers its content.

1.

2.

3.

>>> print CENTER('<hello>', XML('<b>world</b>'),

>>> _class='test', _id=0)

<center id="0" class="test">&lt;hello&gt;<b>world</b></center>

CODE

このヘルパーは、Python、C、C++、HTML、そして、web2pyのコードに対して構文のハイライトを実現します。これは、コードの列挙に関してPREよりも望ましい選択肢です。CODEはまた、web2pyのAPIドキュメントへのリンクを作成する機能があります。

This helper performs syntax highlighting for Python, C, C++, HTML and web2py code, and is preferable to PRE for code listings. CODE also has the ability to create links to the web2py API documentation.

ここでは、Pythonコードのセクションをハイライトする例を示します:

Here is an example of highlighting sections of Python code.

1.

2.

3.

4.

5.

6.

7.

8.

9.

10.

11.

12.

13.

14.

15.

16.

17.

18.

19.

20.

21.

>>> print CODE('print "hello"', language='python').xml()

<table><tr valign="top"><td style="width:40px; text-align: right;"><pre style="

font-size: 11px;

font-family: Bitstream Vera Sans Mono,monospace;

background-color: transparent;

margin: 0;

padding: 5px;

border: none;

background-color: #E0E0E0;

color: #A0A0A0;

">1.</pre></td><td><pre style="

font-size: 11px;

font-family: Bitstream Vera Sans Mono,monospace;

background-color: transparent;

margin: 0;

padding: 5px;

border: none;

overflow: auto;

"><span style="color:#185369; font-weight: bold">print </span>

<span style="color: #FF9966">"hello"</span></pre></td></tr>

</table>

HTMLに対して同様の例を示します。

Here is a similar example for HTML

1.

2.

3.

1.

2.

3.

>>> print CODE(

>>> '<html><body>{{=request.env.remote_add}}</body></html>',

>>> language='html')

<table>...<code>...

<html><body>{{=request.env.remote_add}}</body></html>

...</code>...</table>

以下に示すのはCODEヘルパーのデフォルトの引数です:

These are the default arguments for the CODE helper:

1.

CODE("print 'hello world'", language='python', link=None, counter=1, styles={})

language 引数でサポートされている値は、 "python"、"html_plain"、"c"、"cpp"、"web2py"、"html"です。"html"言語では、{{と}}のタグ は"web2py"のコードとして解釈されます。一方、"html_plain"ではそのように解釈されません。

Supported values for the language argument are "python", "html_plain", "c", "cpp", "web2py", and "html". The "html" language interprets {{ and }} tags as "web2py" code, while "html_plain" doesn't.

link の値が指定される場合、たとえば、"/examples/global/vars/"とされている場合、コード内のweb2pyのAPIレファレンスがそ のリンクURLのドキュメントへリンクされます。たとえば、"request"は"/examples/global/vars/request"へリン クされます。上記の例では、リンクURLは、"global.py"コントローラの"var"アクションによって処理されます。"global.py"は、web2pyの"examples"アプリケーションの一部として配布されています。

If a link value is specified, for example "/examples/global/vars/", web2py API references in the code are linked to documentation at the link URL. For example "request" would be linked to "/examples/global/vars/request". In the above example, the link URL is handled by the "var" action in the "global.py" controller that is distributed as part of the web2py "examples" application.

counter引数は行番号のために使用されます。これは3種類の値のいずれかを取ります。Noneにすると行番号は表示されません。数字にすると、始まりの番号を指定します。counterが文字列の場合は、プロンプトとして解釈され、行番号は表示されません。カウンタが文字列に設定されている場合、それは、プロンプトとして解釈され、行番号があります。

The counter argument is used for line numbering. It can be set to any of three different values. It can be None for no line numbers, a numerical value specifying the start number, or a string. If the counter is set to a string, it is interpreted as a prompt, and there are no line numbers.

DIV

XML以外のすべてのヘルパーはDIVから派生し、その基本メソッドを継承しています。

All helpers apart from XML are derived from DIV and inherit its basic methods.

1.

2.

>>> print DIV('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<div id="0" class="test">&lt;hello&gt;<b>world</b></div>

EM

中身を強調します。

Emphasizes its content.

1.

2.

>>> print EM('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<em id="0" class="test">&lt;hello&gt;<b>world</b></em>

FIELDSET

入力フィールドをラベルと共に作成するために使用されます。

This is used to create an input field together with its label.

1.

2.

>>> print FIELDSET('Height:', INPUT(_name='height'), _class='test')

<fieldset class="test">Height:<input name="height" /></fieldset>

FORM

これは最も重要なヘルパーの1つです。単純なフォームでは、単に<form>...</form>タグを作り出すだけですが、ヘルパーはオブジェクトで、かつ、その中身に関する情報を持っているので、フォームの投稿処理を行うことができます(たとえば、フィールドの検証など)。詳細は第7章で説明します。

This is one of the most important helpers. In its simple form, it just makes a <form>...</form>tag, but because helpers are objects and have knowledge of what they contain, they can process submitted forms (for example, perform validation of the fields). This will be discussed in detail in Chapter 7.

1.

2.

3.

>>> print FORM(INPUT(_type='submit'), _action=", _method='post')

<form enctype="multipart/form-data" action="" method="post">

<input type="submit" /></form>

"enctype"はデフォルトでは"multipart/form-data"です。

The "enctype" is "multipart/form-data" by default.

FORMとSQLFORMのコンストラクタは、hiddenという特別な引数を取ることができます。辞書がhiddenとして渡される場合、その項目は"hidden"INPUTフィールドへと変換されます。たとえば次のようになります:

The constructor of a FORM, and of SQLFORM, can also take a special argument called hidden. When a dictionary is passed as hidden, its items are translated into "hidden" INPUT fields. For example:

1.

2.

3.

>>> print FORM(hidden=dict(a='b'))

<form enctype="multipart/form-data" action="" method="post">

<input value="b" type="hidden" name="a" /></form>

H1, H2, H3, H4, H5, H6

これらのヘルパーは、段落の見出しと小見出しに利用します:

These helpers are for paragraph headings and subheadings:

1.

2.

>>> print H1('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<h1 id="0" class="test">&lt;hello&gt;<b>world</b></h1>

HEAD

HTMLページのHEADをタグ付けに利用します。

For tagging the HEAD of an HTML page.

1.

2.

>>> print HEAD(TITLE('<hello>', XML('<b>world</b>')))

<head><title>&lt;hello&gt;<b>world</b></title></head>

HTML

このヘルパーは少し異なります。<html>タグの作成に加えて、doctype文字列をそのタグの前に付与します。

This helper is a little different. In addition to making the <html> tags, it prepends the tag with a doctype string .

1.

2.

3.

4.

>>> print HTML(BODY('<hello>', XML('<b>world</b>')))

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html><body>&lt;hello&gt;<b>world</b></body></html>

HTMLヘルパーは、いくつかの追加のオプション引数を取り、次のようなデフォルト値を持ちます:

The HTML helper also takes some additional optional arguments that have the following default:

1.

HTML(..., lang='en', doctype='transitional')

doctypeは 'strict'、'transitional'、'frameset'、'html5'、または、完全なdoctype文字列にすることができます。

where doctype can be 'strict', 'transitional', 'frameset', 'html5', or a full doctype string.

XHTML

XHTMLはHTMLに似ていますが、代わりにXHTMLのdoctypeを作成します。

XHTML is similar to HTML but it creates an XHTML doctype instead.

1.

XHTML(..., lang='en', doctype='transitional', xmlns='http://www.w3.org/1999/xhtml')

doctypeは、'strict'、'transitional'、'frameset'、または、完全なdoctype文字列にすることができます。

where doctype can be 'strict', 'transitional', 'frameset', or a full doctype string.

INPUT

<input.../>タグを作成します。inputタグは、他のタグを含まないので、>ではなく、/>で閉じられます。inputタグは、オプション属性_typeを持ち、"text" (デフォルト)や、"submit"、"checkbox",、"radio" に設定できます。

Creates an <input.../> tag. An input tag may not contain other tags, and is closed by />instead of >. The input tag has an optional attribute _type that can be set to "text" (the default), "submit", "checkbox", or "radio".

1.

2.

>>> print INPUT(_name='test', _value='a')

<input value="a" name="test" />

これはまた、"value"という"_value"とは異なる特別なオプション引数を取ります。後者は、inputフィールドに対してデフォルト値を設定します。一方、前者は現在の値を設定します。"text"タイプの入力の場合、前者は後者を上書きします:

It also takes an optional special argument called "value", distinct from "_value". The latter sets the default value for the input field; the former sets its current value. For an input of type "text", the former overrides the latter:

1.

2.

>>> print INPUT(_name='test', _value='a', value='b')

<input value="b" name="test" />

ラジオボタンの場合、INPUTは選択的に"checked"属性を設定します:

For radio buttons INPUT selectively sets the "checked" attribute:

1.

2.

3.

4.

5.

>>> for v in ['a', 'b', 'c']:

>>> print INPUT(_type='radio', _name='test', _value=v, value='b'), v

<input value="a" type="radio" name="test" /> a

<input value="b" type="radio" checked="checked" name="test" /> b

<input value="c" type="radio" name="test" /> c

チェックボックスに対しても同様です:

and similarly for checkboxes:

1.

2.

3.

4.

>>> print INPUT(_type='checkbox', _name='test', _value='a', value=True)

<input value="a" type="checkbox" checked="checked" name="test" />

>>> print INPUT(_type='checkbox', _name='test', _value='a', value=False)

<input value="a" type="checkbox" name="test" />

IFRAME

このヘルパーは、現在のページに別のWebページを取り込みます。他のページのURLは"_src"属性で指定されます。

This helper includes another web page in the current page. The url of the other page is specified via the "_src" attribute.

1.

2.

>>> print IFRAME(_src='http://www.web2py.com')

<iframe src="http://www.web2py.com"></iframe>

IMG

HTMLに画像を埋め込むために使用されます:

It can be used to embed images into HTML:

1.

2.

>>> IMG(_src='http://example.com/image.png',_alt='test')

<img src="http://example.com/image.ong" alt="rest" />

次に示すのは、AとIMGとURLのヘルパーを組み合わせて、リンク付きの静的画像を取り込んだものです:

Here is a combination of A, IMG, and URL helpers for including a static image with a link:

1.

2.

3.

4.

5.

>>> A(IMG(_src=URL('static','logo.png'), _alt="My Logo"),

_href=URL('default','index'))

<a href="/myapp/default/index">

<img src="/myapp/static/logo.png" alt="My Logo" />

</a>

LABEL

INPUTフィールドのためのLABELタグを作成するために使用されます。

It is used to create a LABEL tag for an INPUT field.

1.

2.

>>> print LABEL('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<label id="0" class="test">&lt;hello&gt;<b>world</b></label>

LI

リスト項目を作成します。ULまはたOLタグの中に含めるべきです。

It makes a list item and should be contained in a UL or OL tag.

1.

2.

>>> print LI('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<li id="0" class="test">&lt;hello&gt;<b>world</b></li>

LEGEND

フォームの中のフィールドに対する凡例タグを作成するために使用されます。

It is used to create a legend tag for a field in a form.

1.

2.

>>> print LEGEND('Name', _for='myfield')

<legend for="myfield">Name</legend>

META

HTMLのヘッドにてMETAタグを構築するために使用されます。例:

To be used for building META tags in the HTML head. For example:

1.

2.

>>> print META(_name='security', _content='high')

<meta name="security" content="high" />

MARKMIN

markminのwiki構文を実装します。これは、後述の例で説明されているmarkminのルールに従って入力テキストを出力htmlに変換します:

Implements the markmin wiki syntax. It converts the input text into output html according to the markmin rules described in the example below:

1.

2.

3.

>>> print MARKMIN("'this is **bold** or ''italic'' and this [[a link http://web2py.com]]"')

<p>this is <b>bold</b> or <i>italic</i> and

this <a href="http://web2py.com">a link</a></p>

markmin構文は、web2pyに付属している次のファイルに説明されています:

The markmin syntax is described in this file that ships with web2py:

http://127.0.0.1:8000/examples/static/markmin.html

いくつかの例は、第13章で、MARKMINを多用するplugin_wikiの文脈において示します

and some examples are shown in chapter 13 in the context of plugin_wiki which uses MARKMIN extensively.

OBJECT

HTMLにオブジェクト(たとえば、flashプレーヤーなど)を埋め込むために使用されます。

Used to embed objects (for example, a flash player) in the HTML.

1.

2.

3.

>>> print OBJECT('<hello>', XML('<b>world</b>'),

>>> _src='http://www.web2py.com')

<object src="http://www.web2py.com">&lt;hello&gt;<b>world</b></object>

OL

順序付きリストを表します。リストはLIタグを含める必要があります。LIオブジェクトでないOLの引数は、自動的に<li>...</li>タグで囲まれます。

It stands for Ordered List. The list should contain LI tags. OL arguments that are not LI objects are automatically enclosed in <li>...</li> tags.

1.

2.

>>> print OL('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<ol id="0" class="test"><li>&lt;hello&gt;</li><li><b>world</b></li></ol>

ON

これは、後方互換のためにあり、単にTrueの別名となります。これは、チェックボックスにおいて利用されますが、TrueのほうがよりPython的なので非推奨になっています。

This is here for backward compatibility and it is simply an alias for True. It is used exclusively for checkboxes and deprecated since True is more Pythonic.

1.

2.

>>> print INPUT(_type='checkbox', _name='test', _checked=ON)

<input checked="checked" type="checkbox" name="test" />

OPTGROUP

SELECT内の複数のオプションをグループ化することを可能にします。CSSでフィールドをカスタマイズするのに便利です。

Allows you to group multiple options in a SELECT and it is useful to customize the fields using CSS.

1.

2.

3.

4.

5.

6.

7.

8.

>>> print SELECT('a', OPTGROUP('b', 'c'))

<select>

<option value="a">a</option>

<optgroup>

<option value="b">b</option>

<option value="c">c</option>

</optgroup>

</select>

OPTION

SELECT/OPTIONの組み合わせの一部としてのみ使用されるものです。

This should only be used as part of a SELECT/OPTION combination.

1.

2.

>>> print OPTION('<hello>', XML('<b>world</b>'), _value='a')

<option value="a">&lt;hello&gt;<b>world</b></option>

INPUTの場合のように、web2pyは"_value"(OPTIONの値)と"value"(囲み内の選択肢の現在の値)を区別することができます。もしそれらが等しい場合、オプションは"selected"になります。

As in the case of INPUT, web2py make a distinction between "_value" (the value of the OPTION), and "value" (the current value of the enclosing select). If they are equal, the option is "selected".

1.

2.

3.

4.

5.

>>> print SELECT('a', 'b', value='b'):

<select>

<option value="a">a</option>

<option value="b" selected="selected">b</option>

</select>

P

段落のタグ付けに利用します。

This is for tagging a paragraph.

1.

2.

>>> print P('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<p id="0" class="test">&lt;hello&gt;<b>world</b></p>

PRE

事前に書式設定されたテキストを表示するための<pre>...</pre>タグを生成します。CODEヘルパーのほうが、コードの列挙には一般に望ましいです。

Generates a <pre>...</pre> tag for displaying pre-formatted text. The CODE helper is generally preferable for code listings.

1.

2.

>>> print PRE('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<pre id="0" class="test">&lt;hello&gt;<b>world</b></pre>

SCRIPT

JavaScriptなどのスクリプトを組み込む、または、リンクします。タグ間の内容は、とても古いブラウザのために、HTMLのコメントとして表示されます。

This is include or link a script, such as JavaScript. The content between the tags is rendered as an HTML comment, for the benefit of really old browsers.

1.

2.

3.

4.

>>> print SCRIPT('alert("hello world");', _language='javascript')

<script language="javascript"><!--

alert("hello world");

//--></script>

SELECT

<select>...</select>タグを作成します。これは、OPTIONヘルパーとともに使用されます。OPTIONオブジェクト以外のSELECT引数は、自動的にoptionに変換されます。

Makes a <select>...</select> tag. This is used with the OPTION helper. Those SELECTarguments that are not OPTION objects are automatically converted to options.

1.

2.

3.

4.

5.

>>> print SELECT('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<select id="0" class="test">

<option value="&lt;hello&gt;">&lt;hello&gt;</option>

<option value="&lt;b&gt;world&lt;/b&gt;"><b>world</b></option>

</select>

SPAN

DIVと似ていますが、(ブロックよりも)インラインのコンテンツをタグ付けするのに使用されます。

Similar to DIV but used to tag inline (rather than block) content.

1.

2.

>>> print SPAN('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<span id="0" class="test">&lt;hello&gt;<b>world</b></span>

STYLE

scriptと似ていますが、CSSコードを組み込む、もしくは、リンクするために使用されます。次に示すのは、CSSを組み込んだ例です:

Similar to script, but used to either include or link CSS code. Here the CSS is included:

1.

2.

3.

4.

>>> print STYLE(XML('body {color: white}'))

<style><!--

body { color: white }

//--></style>

また、リンクする例です:

and here it is linked:

1.

2.

3.

>>> print STYLE(_src='style.css')

<style src="style.css"><!--

//--></style>

TABLE, TR, TD

これらのタグは(オプション的なTHEAD、TBODY、TFOOTERヘルパーとともに)HTMLテーブルを構築するために使用されます。

These tags (along with the optional THEAD, TBODY and TFOOTER helpers) are used to build HTML tables.

1.

2.

>>> print TABLE(TR(TD('a'), TD('b')), TR(TD('c'), TD('d')))

<table><tr><td>a</td><td>b</td></tr><tr><td>c</td><td>d</td></tr></table>

TRはTDが来ることを想定しています。つまり、TDオブジェクトでない引数は自動的に変換されます:

TR expects TD content; arguments that are not TD objects are converted automatically.

1.

2.

>>> print TABLE(TR('a', 'b'), TR('c', 'd'))

<table><tr><td>a</td><td>b</td></tr><tr><td>c</td><td>d</td></tr></table>

Pythonの配列のHTMLテーブルへの変換は、Pythonの*関数引数の表記を使用すると、リスト要素が位置関数引数にマッピングされ、容易に実現することができます。

It is easy to convert a Python array into an HTML table using Python's * function arguments notation, which maps list elements to positional function arguments.

次の例では、行単位でそれを行っています:

Here, we will do it line by line:

1.

2.

3.

>>> table = [['a', 'b'], ['c', 'd']]

>>> print TABLE(TR(*table[0]), TR(*table[1]))

<table><tr><td>a</td><td>b</td></tr><tr><td>c</td><td>d</td></tr></table>

次の例では、一度にすべての行でそれを行っています:

Here we do all lines at once:

1.

2.

3.

>>> table = [['a', 'b'], ['c', 'd']]

>>> print TABLE(*[TR(*rows) for rows in table])

<table><tr><td>a</td><td>b</td></tr><tr><td>c</td><td>d</td></tr></table>

TBODY

テーブルのボディーに含まれる行の集合をタグ付けするのに使用されます。ヘッダーやフッターの行の集合と対置します。これは付加的なものです。

This is used to tag rows contained in the table body, as opposed to header or footer rows. It is optional.

1.

2.

>>> print TBODY(TR('<hello>'), _class='test', _id=0)

<tbody id="0" class="test"><tr><td>&lt;hello&gt;</td></tr></tbody>

TEXTAREA

<textarea>...</textarea>タグを作成するヘルパーです。

This helper makes a <textarea>...</textarea> tag.

1.

2.

>>> print TEXTAREA('<hello>', XML('<b>world</b>'), _class='test')

<textarea class="test" cols="40" rows="10">&lt;hello&gt;<b>world</b></textarea>

唯一の注意点は、そのオプション的な"value"が、その内容(内部HTML)を上書きすることです。

The only caveat is that its optional "value" overrides its content (inner HTML)

1.

2.

>>> print TEXTAREA(value="<hello world>", _class="test")

<textarea class="test" cols="40" rows="10">&lt;hello world&gt;</textarea>

TFOOT

テーブルのフッターの行集合をタグ付けするのに使用されます。

This is used to tag table footer rows.

1.

2.

>>> print TFOOT(TR(TD('<hello>')), _class='test', _id=0)

<tfoot id="0" class="test"><tr><td>&lt;hello&gt;</td></tr></tfoot>

TH

テーブルのヘッダーにおいて、TDの代わりに使用されます。

This is used instead of TD in table headers.

1.

2.

>>> print TH('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<th id="0" class="test">&lt;hello&gt;<b>world</b></th>

THEAD

テーブルのヘッダーの行集合をタグ付けするために使用されます。

This is used to tag table header rows.

1.

2.

>>> print THEAD(TR(TD('<hello>')), _class='test', _id=0)

<thead id="0" class="test"><tr><td>&lt;hello&gt;</td></tr></thead>

TITLE

HTMLヘッダーにて、ページのタイトルをタグ付けするのに使用されます。

This is used to tag the title of a page in an HTML header.

1.

2.

>>> print TITLE('<hello>', XML('<b>world</b>'))

<title>&lt;hello&gt;<b>world</b></title>

TR

テーブルの行をタグ付けします。テーブルの内部で表示され、かつ、<td>...</td>タグを含む必要があります。TDオブジェクト以外のTRの引数は自動的に変換されます。

Tags a table row. It should be rendered inside a table and contain <td>...</td> tags. TRarguments that are not TD objects will be automatically converted.

1.

2.

>>> print TR('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<tr id="0" class="test"><td>&lt;hello&gt;</td><td><b>world</b></td></tr>

TT

タイプライタ(固定幅)テキストとしてのテキストをタグ付けします。

Tags text as typewriter (monospaced) text.

1.

2.

>>> print TT('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<tt id="0" class="test">&lt;hello&gt;<b>world</b></tt>

UL

順不同リストを示します。LIの項目を含める必要があります。中身がLIとしてタグ付けされていない場合は、ULは自動的にそれを行います。

Signifies an Unordered List and should contain LI items. If its content is not tagged as LI, UL does it automatically.

1.

2.

>>> print UL('<hello>', XML('<b>world</b>'), _class='test', _id=0)

<ul id="0" class="test"><li>&lt;hello&gt;</li><li><b>world</b></li></ul>

カスタム・ヘルパー

Custom Helpers

TAG

独自のXMLタグを生成したい場合があるかもしれません。web2pyは、普遍的なタグ生成機としてTAGを提供しています。

Sometimes you need to generate custom XML tags. web2py provides TAG, a universal tag generator.

1.

{{=TAG.name('a', 'b', _c='d')}}

これは、次のようなXMLを生成します

generates the following XML

1.

<name c="d">ab</name>

引数"a"、"b"、"d"は自動的にエスケープされます。この挙動を抑えるにはXMLヘルパーを用いてください。TAGを用いて、APIに提供されていないHTML/XMLタグを生成することができます。TAGはネストさせることができ、str()によってシリアライズすることができます。同等の構文は次の通りです:

Arguments "a" and "b" and "d" are automatically escaped; use the XML helper to suppress this behavior. Using TAG you can generate HTML/XML tags not already provided by the API. TAGs can be nested, and are serialized with str(). An equivalent syntax is:

1.

{{=TAG['name']('a', 'b', c='d')}}

なお、TAGはオブジェクトであり、TAG.nameまはたTAG['name']は、一時的なヘルパークラスを返す関数であることです。

Notice that TAG is an object, and TAG.name or TAG['name'] is a function that returns a temporary helper class.

MENU

MENUヘルパーは、(第4章で説明されいる)response.menuの形式のリストのリストを受け取り、メニューを表現する順不同リストを用いてツリー型の構造を生成します。たとえば次のようになります:

The MENU helper takes a list of lists of the form of response.menu (as described in Chapter 4) and generates a tree-like structure using unordered lists representing the menu. For example:

1.

2.

3.

4.

5.

>>> print MENU([['One', False, 'link1'], ['Two', False, 'link2']])

<ul class="web2py-menu web2py-menu-vertical">

<li><a href="link1">One</a></li>

<li><a href="link2">Two</a></li>

</ul>

各メニュー項目はネスとされるサブメニューを第4引数に持つことができます(また再帰的に同様です):

Each menu item can have a fourth argument that is a nested submenu (and so on recursively):

1.

2.

3.

4.

5.

6.

7.

8.

9.

>>> print MENU([['One', False, 'link1', [['Two', False, 'link2']]]])

<ul class="web2py-menu web2py-menu-vertical">

<li class="web2py-menu-expand">

<a href="link1">One</a>

<ul class="web2py-menu-vertical">

<li><a href="link2">Two</a></li>

</ul>

</li>

</ul>

MENUヘルパーは次のオプション引数を取ります:

The MENU helper takes the following optional arguments:

  • _class: 外側のUL要素のクラスを設定します。デフォルトは"web2py-menu web2py-menu-vertical"です。

    • defaults to "web2py-menu web2py-menu-vertical" and sets the class of the outer UL elements.

  • ul_class: 内側のUL要素のクラスを設定します。デフォルトは "web2py-menu-vertical"です。

    • defaults to "web2py-menu-vertical" and sets the class of the inner UL elements.

  • li_class: 内側のLI要素のクラスを設定します。デフォルトは"web2py-menu-expand"です。

    • defaults to "web2py-menu-expand" and sets the class of the inner LI elements.

雛形となるアプリケーションの"base.css"は、次のメニューの基本タイプを理解します: "web2py-menu web2py-menu-vertical"と"web2py-menu web2py-menu-horizontal"。

The "base.css" of the scaffolding application understands the following basic types of menus: "web2py-menu web2py-menu-vertical" and "web2py-menu web2py-menu-horizontal".