我正在尝试将HTML5占位符属性添加到Deform 2.0 TextInputWidget
。但是我不确定这是否应该得到支持或者应该如何支持它,因为文档不是很明确 - 似乎有一些mask_placeholder功能并不是我想要的。
如何添加HTML5占位符以变形文本输入(2.0 +)?
答案 0 :(得分:2)
编辑:从Deform 2.0.7开始,支持HTML5属性。
https://docs.pylonsproject.org/projects/deform/en/latest/changes.html
好的 - 诀窍是拥有一个自定义模板 - Deform模板还没有对占位符的支持:
<!--! This adds placeholder attribute support for TextInput.
-->
<span tal:define="name name|field.name;
css_class css_class|field.widget.css_class;
oid oid|field.oid;
mask mask|field.widget.mask;
mask_placeholder mask_placeholder|field.widget.mask_placeholder;
style style|field.widget.style;
placeholder field.widget.placeholder|nothing;
type field.widget.type|'text';
"
tal:omit-tag="">
<input type="${type}" name="${name}" value="${cstruct}"
tal:attributes="class string: form-control ${css_class};
style style;
placeholder placeholder;"
id="${oid}"/>
<script tal:condition="mask" type="text/javascript">
deform.addCallback(
'${oid}',
function (oid) {
$("#" + oid).mask("${mask}",
{placeholder:"${mask_placeholder}"});
});
</script>
</span>
然后您可以将小部件定义为:
class InviteFriends(CSRFSchema):
email = c.SchemaNode(
c.String(),
missing=None,
validator=c.Email(),
widget=w.TextInputWidget(template="textinput_placeholder", type="email", placeholder="Friend's email"),
)
phone_number = c.SchemaNode(
c.String(),
missing=None,
validator=c.Length(min=7),
widget=w.TextInputWidget(template="textinput_placeholder", type="tel", placeholder="Friend's phone number"),
)