NAME¶
Mojolicious::Plugin::TagHelpers - Tag helpers plugin
SYNOPSIS¶
# Mojolicious
$self->plugin('TagHelpers');
# Mojolicious::Lite
plugin 'TagHelpers';
DESCRIPTION¶
Mojolicious::Plugin::TagHelpers is a collection of HTML tag helpers for
Mojolicious.
Most form helpers can automatically pick up previous input values and will show
them as default. You can also use "param" in
Mojolicious::Plugin::DefaultHelpers to set them manually and let necessary
attributes always be generated automatically.
% param country => 'germany' unless param 'country';
<%= radio_button country => 'germany' %> Germany
<%= radio_button country => 'france' %> France
<%= radio_button country => 'uk' %> UK
For fields that failed validation with "validation" in
Mojolicious::Controller the "field-with-error" class will be
automatically added through the "tag_with_error" helper, to make
styling with CSS easier.
<input class="field-with-error" name="age" type="text" value="250" />
This is a core plugin, that means it is always enabled and its code a good
example for learning how to build new plugins, you're welcome to fork it.
See "PLUGINS" in Mojolicious::Plugins for a list of plugins that are
available by default.
HELPERS¶
Mojolicious::Plugin::TagHelpers implements the following helpers.
check_box¶
%= check_box employed => 1
%= check_box employed => 1, disabled => 'disabled'
Generate "input" tag of type "checkbox". Previous input
values will automatically get picked up and shown as default.
<input name="employed" type="checkbox" value="1" />
<input disabled="disabled" name="employed" type="checkbox" value="1" />
color_field¶
%= color_field 'background'
%= color_field background => '#ffffff'
%= color_field background => '#ffffff', id => 'foo'
Generate "input" tag of type "color". Previous input values
will automatically get picked up and shown as default.
<input name="background" type="color" />
<input name="background" type="color" value="#ffffff" />
<input id="foo" name="background" type="color" value="#ffffff" />
csrf_field¶
%= csrf_field
Generate "input" tag of type "hidden" with
"csrf_token" in Mojolicious::Plugin::DefaultHelpers.
<input name="csrf_token" type="hidden" value="fa6a08..." />
date_field¶
%= date_field 'end'
%= date_field end => '2012-12-21'
%= date_field end => '2012-12-21', id => 'foo'
Generate "input" tag of type "date". Previous input values
will automatically get picked up and shown as default.
<input name="end" type="date" />
<input name="end" type="date" value="2012-12-21" />
<input id="foo" name="end" type="date" value="2012-12-21" />
datetime_field¶
%= datetime_field 'end'
%= datetime_field end => '2012-12-21T23:59:59Z'
%= datetime_field end => '2012-12-21T23:59:59Z', id => 'foo'
Generate "input" tag of type "datetime". Previous input
values will automatically get picked up and shown as default.
<input name="end" type="datetime" />
<input name="end" type="datetime" value="2012-12-21T23:59:59Z" />
<input id="foo" name="end" type="datetime" value="2012-12-21T23:59:59Z" />
email_field¶
%= email_field 'notify'
%= email_field notify => 'nospam@example.com'
%= email_field notify => 'nospam@example.com', id => 'foo'
Generate "input" tag of type "email". Previous input values
will automatically get picked up and shown as default.
<input name="notify" type="email" />
<input name="notify" type="email" value="nospam@example.com" />
<input id="foo" name="notify" type="email" value="nospam@example.com" />
file_field¶
%= file_field 'avatar'
%= file_field 'avatar', id => 'foo'
Generate "input" tag of type "file".
<input name="avatar" type="file" />
<input id="foo" name="avatar" type="file" />
%= form_for login => begin
%= text_field 'first_name'
%= submit_button
% end
%= form_for login => {format => 'txt'} => (method => 'POST') => begin
%= text_field 'first_name'
%= submit_button
% end
%= form_for '/login' => (enctype => 'multipart/form-data') => begin
%= text_field 'first_name', disabled => 'disabled'
%= submit_button
% end
%= form_for 'http://example.com/login' => (method => 'POST') => begin
%= text_field 'first_name'
%= submit_button
% end
Generate portable "form" tag with "url_for" in
Mojolicious::Controller. For routes that allow "POST" but not
"GET", a "method" attribute will be automatically added.
<form action="/path/to/login">
<input name="first_name" type="text" />
<input value="Ok" type="submit" />
</form>
<form action="/path/to/login.txt" method="POST">
<input name="first_name" type="text" />
<input value="Ok" type="submit" />
</form>
<form action="/path/to/login" enctype="multipart/form-data">
<input disabled="disabled" name="first_name" type="text" />
<input value="Ok" type="submit" />
</form>
<form action="http://example.com/login" method="POST">
<input name="first_name" type="text" />
<input value="Ok" type="submit" />
</form>
hidden_field¶
%= hidden_field foo => 'bar'
%= hidden_field foo => 'bar', id => 'bar'
Generate "input" tag of type "hidden".
<input name="foo" type="hidden" value="bar" />
<input id="bar" name="foo" type="hidden" value="bar" />
image¶
%= image '/images/foo.png'
%= image '/images/foo.png', alt => 'Foo'
Generate portable "img" tag.
<img src="/path/to/images/foo.png" />
<img alt="Foo" src="/path/to/images/foo.png" />
%= input_tag 'first_name'
%= input_tag first_name => 'Default name'
%= input_tag 'employed', type => 'checkbox'
Generate "input" tag. Previous input values will automatically get
picked up and shown as default.
<input name="first_name" />
<input name="first_name" value="Default name" />
<input name="employed" type="checkbox" />
javascript¶
%= javascript '/script.js'
%= javascript begin
var a = 'b';
% end
Generate portable "script" tag for JavaScript asset.
<script src="/path/to/script.js" />
<script><![CDATA[
var a = 'b';
]]></script>
label_for¶
%= label_for first_name => 'First name'
%= label_for first_name => 'First name', class => 'user'
%= label_for first_name => begin
First name
% end
%= label_for first_name => (class => 'user') => begin
First name
% end
Generate "label" tag.
<label for="first_name">First name</label>
<label class="user" for="first_name">First name</label>
<label for="first_name">
First name
</label>
<label class="user" for="first_name">
First name
</label>
link_to¶
%= link_to Home => 'index'
%= link_to Home => 'index' => {format => 'txt'} => (class => 'menu')
%= link_to index => {format => 'txt'} => (class => 'menu') => begin
Home
% end
%= link_to Contact => 'mailto:sri@example.com'
<%= link_to index => begin %>Home<% end %>
<%= link_to '/file.txt' => begin %>File<% end %>
<%= link_to 'http://mojolicio.us' => begin %>Mojolicious<% end %>
<%= link_to url_for->query(foo => 'bar')->to_abs => begin %>Retry<% end %>
Generate portable "a" tag with "url_for" in
Mojolicious::Controller, defaults to using the capitalized link target as
content.
<a href="/path/to/index">Home</a>
<a class="menu" href="/path/to/index.txt">Home</a>
<a class="menu" href="/path/to/index.txt">
Home
</a>
<a href="mailto:sri@example.com">Contact</a>
<a href="/path/to/index">Home</a>
<a href="/path/to/file.txt">File</a>
<a href="http://mojolicio.us">Mojolicious</a>
<a href="http://127.0.0.1:3000/current/path?foo=bar">Retry</a>
month_field¶
%= month_field 'vacation'
%= month_field vacation => '2012-12'
%= month_field vacation => '2012-12', id => 'foo'
Generate "input" tag of type "month". Previous input values
will automatically get picked up and shown as default.
<input name="vacation" type="month" />
<input name="vacation" type="month" value="2012-12" />
<input id="foo" name="vacation" type="month" value="2012-12" />
number_field¶
%= number_field 'age'
%= number_field age => 25
%= number_field age => 25, id => 'foo', min => 0, max => 200
Generate "input" tag of type "number". Previous input values
will automatically get picked up and shown as default.
<input name="age" type="number" />
<input name="age" type="number" value="25" />
<input id="foo" max="200" min="0" name="age" type="number" value="25" />
password_field¶
%= password_field 'pass'
%= password_field 'pass', id => 'foo'
Generate "input" tag of type "password".
<input name="pass" type="password" />
<input id="foo" name="pass" type="password" />
%= radio_button country => 'germany'
%= radio_button country => 'germany', id => 'foo'
Generate "input" tag of type "radio". Previous input values
will automatically get picked up and shown as default.
<input name="country" type="radio" value="germany" />
<input id="foo" name="country" type="radio" value="germany" />
range_field¶
%= range_field 'age'
%= range_field age => 25
%= range_field age => 25, id => 'foo', min => 0, max => 200
Generate "input" tag of type "range". Previous input values
will automatically get picked up and shown as default.
<input name="age" type="range" />
<input name="age" type="range" value="25" />
<input id="foo" max="200" min="200" name="age" type="range" value="25" />
search_field¶
%= search_field 'q'
%= search_field q => 'perl'
%= search_field q => 'perl', id => 'foo'
Generate "input" tag of type "search". Previous input values
will automatically get picked up and shown as default.
<input name="q" type="search" />
<input name="q" type="search" value="perl" />
<input id="foo" name="q" type="search" value="perl" />
select_field¶
%= select_field country => [qw(de en)]
%= select_field country => [[Germany => 'de'], 'en'], id => 'eu'
%= select_field country => [[Germany => 'de', disabled => 'disabled'], 'en']
%= select_field country => [c(EU => [[Germany => 'de'], 'en'], id => 'eu')]
%= select_field country => [c(EU => [qw(de en)]), c(Asia => [qw(cn jp)])]
Generate "select" and "option" tags from array references
and "optgroup" tags from Mojo::Collection objects. Previous input
values will automatically get picked up and shown as default.
<select name="country">
<option value="de">de</option>
<option value="en">en</option>
</select>
<select id="eu" name="country">
<option value="de">Germany</option>
<option value="en">en</option>
</select>
<select name="country">
<option disabled="disabled" value="de">Germany</option>
<option value="en">en</option>
</select>
<select name="country">
<optgroup id="eu" label="EU">
<option value="de">Germany</option>
<option value="en">en</option>
</optgroup>
</select>
<select name="country">
<optgroup label="EU">
<option value="de">de</option>
<option value="en">en</option>
</optgroup>
<optgroup label="Asia">
<option value="cn">cn</option>
<option value="jp">jp</option>
</optgroup>
</select>
stylesheet¶
%= stylesheet '/foo.css'
%= stylesheet begin
body {color: #000}
% end
Generate portable "style" or "link" tag for CSS asset.
<link href="/path/to/foo.css" rel="stylesheet" />
<style><![CDATA[
body {color: #000}
]]></style>
%= submit_button
%= submit_button 'Ok!', id => 'foo'
Generate "input" tag of type "submit".
<input type="submit" value="Ok" />
<input id="foo" type="submit" value="Ok!" />
%=t div => 'test & 123'
Alias for "tag".
<div>test & 123</div>
tag¶
%= tag 'div'
%= tag 'div', id => 'foo'
%= tag div => 'test & 123'
%= tag div => (id => 'foo') => 'test & 123'
%= tag div => (data => {my_id => 1, Name => 'test'}) => 'test & 123'
%= tag div => begin
test & 123
% end
<%= tag div => (id => 'foo') => begin %>test & 123<% end %>
HTML/XML tag generator.
<div />
<div id="foo" />
<div>test & 123</div>
<div id="foo">test & 123</div>
<div data-my-id="1" data-name="test">test & 123</div>
<div>
test & 123
</div>
<div id="foo">test & 123</div>
Very useful for reuse in more specific tag helpers.
$c->tag('div');
$c->tag('div', id => 'foo');
$c->tag(div => sub { 'Content' });
Results are automatically wrapped in Mojo::ByteStream objects to prevent
accidental double escaping.
tag_with_error¶
%= tag_with_error 'input', class => 'foo'
Same as "tag", but adds the class "field-with-error".
<input class="foo field-with-error" />
tel_field¶
%= tel_field 'work'
%= tel_field work => '123456789'
%= tel_field work => '123456789', id => 'foo'
Generate "input" tag of type "tel". Previous input values
will automatically get picked up and shown as default.
<input name="work" type="tel" />
<input name="work" type="tel" value="123456789" />
<input id="foo" name="work" type="tel" value="123456789" />
text_area¶
%= text_area 'foo'
%= text_area 'foo', cols => 40
%= text_area foo => 'Default!', cols => 40
%= text_area foo => (cols => 40) => begin
Default!
% end
Generate "textarea" tag. Previous input values will automatically get
picked up and shown as default.
<textarea name="foo"></textarea>
<textarea cols="40" name="foo"></textarea>
<textarea cols="40" name="foo">Default!</textarea>
<textarea cols="40" name="foo">
Default!
</textarea>
text_field¶
%= text_field 'first_name'
%= text_field first_name => 'Default name'
%= text_field first_name => 'Default name', class => 'user'
Generate "input" tag of type "text". Previous input values
will automatically get picked up and shown as default.
<input name="first_name" type="text" />
<input name="first_name" type="text" value="Default name" />
<input class="user" name="first_name" type="text" value="Default name" />
time_field¶
%= time_field 'start'
%= time_field start => '23:59:59'
%= time_field start => '23:59:59', id => 'foo'
Generate "input" tag of type "time". Previous input values
will automatically get picked up and shown as default.
<input name="start" type="time" />
<input name="start" type="time" value="23:59:59" />
<input id="foo" name="start" type="time" value="23:59:59" />
url_field¶
%= url_field 'address'
%= url_field address => 'http://mojolicio.us'
%= url_field address => 'http://mojolicio.us', id => 'foo'
Generate "input" tag of type "url". Previous input values
will automatically get picked up and shown as default.
<input name="address" type="url" />
<input name="address" type="url" value="http://mojolicio.us" />
<input id="foo" name="address" type="url" value="http://mojolicio.us" />
week_field¶
%= week_field 'vacation'
%= week_field vacation => '2012-W17'
%= week_field vacation => '2012-W17', id => 'foo'
Generate "input" tag of type "week". Previous input values
will automatically get picked up and shown as default.
<input name="vacation" type="week" />
<input name="vacation" type="week" value="2012-W17" />
<input id="foo" name="vacation" type="week" value="2012-W17" />
METHODS¶
Mojolicious::Plugin::TagHelpers inherits all methods from Mojolicious::Plugin
and implements the following new ones.
register¶
$plugin->register(Mojolicious->new);
Register helpers in Mojolicious application.
SEE ALSO¶
Mojolicious, Mojolicious::Guides, <
http://mojolicio.us>.