提交简单表格后如何显示通知

Question

我使用的是简单的表单和Ajax，我想在成功提交表单后显示一个通知（可以闪烁）之类的东西。我该如何实现？

这是我的控制器：

def create
    @order = current_order
    @order_item = @order.order_items.new(order_item_params)
    @order.user_id = current_user.id
    @order.save
    session[:order_id] = @order.id
  end

和我在视图中的形式：

<%= form_for OrderItem.new,  html: {class: "add-to-cart"}, remote: true do |f| %>

        <div class="input-group">
          <%= f.hidden_field :quantity, value: 1, min: 1 %>
          <div class="input-group-btn">
            <%= f.hidden_field :product_id, value: product.id %>
            <%= f.submit "Add to Cart", data: { confirm: 'Are you sure?'}, class: "btn btn-default black-background white" %>
          </div>
        </div>
      <% end %>
    </div>

Answer 1

您可以在提交表格时对JavaScript请求做出响应。

控制器：

# app/controllers/mycontroller.rb
def create
  @order = current_order
  @order_item = @order.order_items.new(order_item_params)
  @order.user_id = current_user.id
  @order.save
  session[:order_id] = @order.id
  respond_to do |format|
    format.js { flash[:notice] = "Created order" } 
  end
end

然后创建一个视图以显示消息：

# app/mycontroller/create.js.erb
<% flash.each do |key, value| %>
  $('.add-to-cart').append('<%= j content_tag :div, value, class: "flash #{key}" %>')
<% end %>

它应该起作用！

Answer 2

您可以使用bootstrap警报来实现它。控制器：

    def create
      @order = current_order
      @order_item = @order.order_items.new(order_item_params)
      @order.user_id = current_user.id
      if @order.save
         flash[:success] = "Successfully Submitted"
      end
      session[:order_id] = @order.id
    end

您可以在要使用此

的地方显示该闪存消息

查看：

    <% flash.each do |message_type, message| %>
       <div class="alert alert-<%= message_type %>"><%= message %></div>
    <% end %>