【问题标题】:Adding icon in data-loading-text in Rails submit_tag在 Rails submit_tag 的数据加载文本中添加图标
【发布时间】:2016-05-24 08:15:38
【问题描述】:

我有以下代码: <%= submit_tag t('submit'), class: "btn btn-primary", id: "email_submitbutton", "data-loading-text" => "<i class='fa fa-circle-o-notch fa-spin'></i> Processing Order" %>

data-loading-text 中的图标标签被 Rails 处理为纯文本。

我尝试使用data {...} 包裹它,但没有任何变化

【问题讨论】:

    标签: ruby-on-rails twitter-bootstrap


    【解决方案1】:

    我认为您正在寻找的是 disable_with 选项并使用按钮。

    http://apidock.com/rails/ActionView/Helpers/FormTagHelper/submit_tag http://apidock.com/rails/ActionView/Helpers/FormTagHelper/button_tag

    html 在提交标签中不起作用的原因是它们被转换为类型为提交的 HTML 输入标签。

    <%= submit_tag "<p>Hi</p>" %>
    
    <input type="submit" value="<p>Hi</p>">
    

    Rails 3 Submit Tag + html_safe

    <%= button_tag t('submit'), class: "btn btn-primary", id: "email_submitbutton", data: { disable_with: "<i class='fa fa-circle-o-notch fa-spin'></i> Processing Order".html_safe } %>
    

    另外,我强烈建议使用 Font-Awesome gem。

    https://github.com/FortAwesome/font-awesome-sass

    这很酷,因为这意味着您无需在 Ruby 代码中手写 HTML。

    【讨论】:

    【解决方案2】:

    我找到了一种替代方法来实现与 Bootstrap 的 data-loading-text 相同的效果(单击时更改按钮中的文本)。

    我将data-loading-text 更改为disable_with 并将submit_tag 更改为button_tag

    &lt;%= button_tag t('submit'), class: "btn btn-primary", id: "email_submitbutton", data: {disable_with: "&lt;i class='fa fa-circle-o-notch fa-spin'&gt;&lt;/i&gt; Processing Order".html_safe} %&gt;

    按预期工作

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2017-12-30
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-11-16
      • 2020-04-22
      • 2020-01-13
      • 1970-01-01
      相关资源
      最近更新 更多