如何在Python WTForms库中使用Bootstrap工具提示?

克拉默65

我正在使用(很棒的)Flask框架WTForms插件构建一个网站我现在想在输入字段的焦点上使用show Bootstrap工具提示这里工作小提琴),但是为此,我必须为input标签赋予data-toggleandtitle属性,如下所示:

<input data-toggle="tooltip" title="tooltip on focus!" type="text" placeholder="Focus me!" name="thename"/>

所以我只是将它们添加到表达式中:

{{ form.plotting_value(title='tooltip on focus!', data-toggle='tooltip', class='form-control') }}

title属性没问题,但是data-toggle导致

TemplateSyntaxError:函数调用表达式的语法无效

有人知道我可以data-toggle使用WTForms将其添加到输入字段吗?

杜贝

Python不喜欢连字符,您可以给它一个字典:

{{ form.example(**{'data-toggle': 'tooltip'}) }}

或者,wtform可以帮助将下划线解码为连字符:

{{ form.example(data_toggle: 'tooltip') }}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何在Bootstrap工具提示中使用MathJax?

如何在React中使用引导工具提示?

如何在工具提示模板中使用剑道图表数据?

如何在 ReactJS、JSX 中使用工具提示,而不使用 npm-module 或 react-bootstrap?

如何在Ajax验证中使用WTForms?

如何使用bootstrap4工具提示禁用本机浏览器工具提示

如何在python 3.6中使用类型提示?

加载对象时如何在Python中使用类型提示

如何在角度图表的自定义工具提示中使用HTML?

如何在HTML工具提示中使用回车符?

如何在asp.net Web表单页面中使用引导工具提示?

如何在引导程序中使用输入类型=密码上的工具提示显示输入的密码?

如何在react-highcharts中使用图表工具提示格式化程序?

如何在Xamarin中使用Syncfusion自定义工具提示的内容和位置?

如何在角度组件中使用引导语法将对象显示为工具提示

Vue + Element UI:如何在表格中使用动态工具提示

如何在Angularjs ng-repeat中为div使用Bootstrap工具提示

如何在Angular 2中使用Bootstrap CSS库?

如何在禁用按钮上启用Bootstrap工具提示?

如何在PHP的工具提示Bootstrap 4中显示图像

如何在react-bootstrap中删除箭头工具提示

如何在Bootstrap中检索按钮的工具提示文本?

如何在python的请求库中使用变量

如何在MySQL数据库中使用python 3.5.1

如何在python中使用for循环读取多值库

如何在python请求库中使用mashape?

如何在DoJo中使用dojox工具?

如何在AJAX中使用Flask-WTForms CSRF保护?

如何在 angular 2 应用程序中使用 npm 为工具提示安装 qtip2?