有没有一种方法可以使用 Rails 表单助手来生成用于提交的按钮标签

发布于 2024-08-21 06:55:39 字数 607 浏览 9 评论 0原文

我正在尝试创建按钮 ala Wufoo (重新发现按钮元素

我会喜欢编写如下代码:

<%form_tag search_path, :method => :get, :class => 'search' do %>
  <%=text_field_tag :search, params[:search] -%>
  <%=button_tag 'search', :name => nil-%>
<%end%>

生成以下 HTML(而不是 input[type="submit"] 标记)

<button type="submit" class="positive">
    <img src="/images/icons/tick.png" alt=""/> 
    Save
</button>

是否已经存在方法?或者我应该推出自己的帮手?

I am trying to create buttons ala Wufoo (Rediscovering the button element)

I would like to write the following code like the following:

<%form_tag search_path, :method => :get, :class => 'search' do %>
  <%=text_field_tag :search, params[:search] -%>
  <%=button_tag 'search', :name => nil-%>
<%end%>

To generate the following HTML (instead of the input[type="submit"] tag)

<button type="submit" class="positive">
    <img src="/images/icons/tick.png" alt=""/> 
    Save
</button>

Does a method exist already? Or should I roll my own helper?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

毅然前行 2024-08-28 06:55:39

您可以使用 content_tag 来实现此目的。这是做你想做的事情的更合理的方式。但它比原始 HTML 更长。

<% content_tag :button :type => :submit, :class => :positive do %>
   <%= image_tag "icons/tick.png"%>
   Save
<% end %>

然而

<button type="submit" class="positive">
    <img src="/images/icons/tick.png" alt="Tick"/> 
    Save
</button>

,使用它作为起点,您应该可以毫无问题地滚动自己的强大助手,或将其抽象为部分。

You could use content_tag to achieve this. It's the more railsy way of doing what you want. But it's longer than the raw HTML.

<% content_tag :button :type => :submit, :class => :positive do %>
   <%= image_tag "icons/tick.png"%>
   Save
<% end %>

Which produces

<button type="submit" class="positive">
    <img src="/images/icons/tick.png" alt="Tick"/> 
    Save
</button>

However using this as a starting point you should have no problem rolling your own robust helper, or abstracting it to a partial.

小苏打饼 2024-08-28 06:55:39

您可以使用 image_submit_tag 帮助程序创建图像提交标记,而不是将整个内容包装在一个按钮中:

<%
image_submit_tag("login.png")
# => <input src="/images/login.png" type="image" />

image_submit_tag("purchase.png", :disabled => true)
# => <input disabled="disabled" src="/images/purchase.png" type="image" />

image_submit_tag("search.png", :class => 'search-button')
# => <input class="search-button" src="/images/search.png" type="image" />
%>

如果您需要“保存”文本出现在 上方,这可能不是您想要的

You can use the image_submit_tag helper to create an image submit tag, rather than wrapping the whole thing in a button:

<%
image_submit_tag("login.png")
# => <input src="/images/login.png" type="image" />

image_submit_tag("purchase.png", :disabled => true)
# => <input disabled="disabled" src="/images/purchase.png" type="image" />

image_submit_tag("search.png", :class => 'search-button')
# => <input class="search-button" src="/images/search.png" type="image" />
%>

This might not be what you're looking for, if you require the "Save" text to appear above the <img>

蹲在坟头点根烟 2024-08-28 06:55:39

使用 JQuery Cheats Gem https://github.com/plowdawg/jquery_cheats 在你看来它只是

<%= submitimage("/path/to/image.png","Alternate Text") %>

注意:替代文本是可选的。

Use The JQuery Cheats Gem https://github.com/plowdawg/jquery_cheats and in your view it is just

<%= submitimage("/path/to/image.png","Alternate Text") %>

NOTE: Alternate text is optional.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文