Helpex - Trao đổi & giúp đỡ Đăng nhập
29

Tôi có một biểu mẫu cho nút thích / không giống bằng cách sử dụng ajax:

= form_for like, :html => { :method => :delete}, :remote => true do |f|
= f.submit pluralize(@video.likes.count, 'like'), :class => "btn btn-warning btn-mini", "data-disable-with"=> "Just a moment..."

Hình thức hoạt động hoàn hảo.

Tôi muốn thêm một biểu tượng vào phía trước văn bản trong nút gửi. Mã haml để thêm biểu tượng như sau (twitter bootstrap):

%i.icon-heart.icon-white

Có cách nào để thêm html này vào nút không? Tôi đã thử thêm nó dưới dạng html thuần túy, nhưng rails lại hiển thị nó dưới dạng văn bản.

CẬP NHẬT

Tôi đã quản lý để đóng gói nút gửi trong một lớp span có chứa biểu tượng và kiểu dáng thích hợp. Bây giờ tôi cần xóa mọi kiểu dáng trên nút ...

%span.btn.btn-danger.btn-mini
  %i.icon-heart.icon-white
  = f.submit pluralize(@video.likes.count, 'like')
29 hữu ích 0 bình luận 35k xem chia sẻ
98

Cảm ơn ismaelga, tôi đã tìm thấy câu hỏi SO này .

Đây là giải pháp:

<%= button_tag(type: 'submit', class: "btn btn-primary") do %>
 <i class="icon-ok icon-white"></i> Save
<% end %>
98 hữu ích 2 bình luận chia sẻ
3

Một lựa chọn khác có thể buttonthay chosubmit

xem tài liệu Rails nút FormBuilder #

= f.button :class => "btn btn-warning btn-mini" do
  %i.icon-heart.icon-white
    = pluralize(@video.likes.count, 'like')
3 hữu ích 0 bình luận chia sẻ
3

Bản thân câu trả lời được chấp nhận cho câu hỏi sẽ hoạt động nhưng giống như một bản vá thay vì giải pháp hoàn hảo giữ cho phong cách mã rõ ràng và nhất quán. Nó backtracks vào sử dụng phương pháp chế độ xem chuẩn và hướng dẫn: #button_tag. Tôi có xu hướng tránh những phương pháp thủ công đó như #submit_tag, #form_tag, #input_tag ... v.v vì chúng không liên quan đến chính mô hình được hỗ trợ hoặc mô hình biểu mẫu và bạn cần phải thực hiện thủ công mọi thứ trên chúng. Mặc dù bản đệ trình không có mối liên hệ nào với cái f.mà mọi đầu vào trong a form_forđều có f.input ..., chẳng hạn , đó là về phong cách, khả năng đọc mã và các thực hành lập trình tốt. Mã này hoạt động hoàn toàn tốt (form_for và simple_form):

= f.button :button, type: :submit, class: 'class1 class2 ... classN' do
    = 'button call to action text'
    %i.fa.fa-download.ml5 // => haml icon as requested

Hy vọng nó sẽ giúp những người khác tiếp cận bài đăng này như tôi đang cố gắng tránh _tagcác phương pháp.

3 hữu ích 0 bình luận chia sẻ
2

Thử cái này. Tôi chưa thử nghiệm nhưng tôi nghĩ có thể làm được điều gì đó như thế này.

= f.submit :class => "btn btn-warning btn-mini", "data-disable-with"=> "Just a moment..." do
  %i.icon-heart.icon-white
  = pluralize(@video.likes.count, 'like')
end

Vì vậy, điều này có thể xảy ra nếu bạn sử dụng simple_form. Tôi xin lỗi.

Vì vậy, một lần thử khác sẽ là

= f.submit "#{pluralize(@video.likes.count, 'like')} <i class='icon-heart icon-white'/>".html_safe, :class => "btn btn-warning btn-mini", "data-disable-with"=> "Just a moment..."
2 hữu ích 5 bình luận chia sẻ
2

Câu trả lời của Justin D cũng giúp tôi. Nếu bạn đến đây từ Google và bạn đang tìm kiếm một triển khai Slim, bạn có thể làm như sau:

= button_tag(type: 'submit', class: 'btn btn-default') do
    span.glyphicon.glyphicon-floppy-disk>
    | Save
end

Người dùng mỏng sẽ nhận ra sự >cần thiết của '.

Điều này đã làm việc cho tôi với Rails 4.1.5, Ruby 2.1.2 và bootstrap-sass 3.2 kể từ ngày 24 tháng 9 năm 2014.

2 hữu ích 1 bình luận chia sẻ
0

Sự hấp dẫn

= button_to('Add', line_item_path, method: :post , class: "btn btn-warning btn-lg" , params: { param1: 'value1',  param2: 'value2' })

http://qiita.com/tomomomo1217/items/a5f790c31670587e2d87

Làm thế nào để đặt một hình ảnh bên trong một liên kết?

0 hữu ích 0 bình luận chia sẻ
-3

Vui lòng thử mã dưới đây. Nó hoạt động

<%= f.submit :class => "btn btn-success btn-mini" %>
-3 hữu ích 3 bình luận chia sẻ
loading
Không tìm thấy câu trả lời bạn tìm kiếm? Duyệt qua các câu hỏi được gắn thẻ ruby-on-rails twitter-bootstrap , hoặc hỏi câu hỏi của bạn.

Có thể bạn quan tâm

loading