Rails 提交按钮和模式视图

Question

对不起，如果是菜鸟问题，这里有 100 次。 我有一个文章列表，上面是“到购物车”按钮。我阅读了很多关于模态视图和rails的内容，但它们都是针对link_to的，如何做到这一点，如果我按下我的按钮，它会向我显示一个带有我的购物车的模态窗口？ 这是我的代码的一部分，带有按钮（它没有 form_tag 等，它位于：

- @articles.each do |art|
  = button_to 'В корзину', line_items_path(ART_ID: art), :id => "to-cart"

我想要，如果我点击它，控制器方法会执行该操作，但它不会重定向到任何地方，我仍然必须在同一页面上，并且模式视图（使用 html 和 jquery）必须与我一起出现购物车部分：

-unless cart.line_items.empty?
  %table.zebra
    %tr
      %th Наименование
      %th Артикул
      %th Производитель
      %th Количество 
      %th Сумма
    = render(cart.line_items)
  %p
    Общая сумма
    = cart.total_price
  %p
    Наименований (количество):
    = cart.total_count
  = button_to 'Очистить корзину', cart, method: :delete, confirm: 'Вы уверены?'
  -if current_user
    = button_to "Оформить заказ", new_order_path, method: :get
  -else
    %p
      Пожалуйста, для оформления заказа войдите в систему:
      %a#cartlogin{:href => "#"} Логин
    %p
      Если у вас нет аккаунта, зарегистрируйтесь:
      = link_to "Регистрация", new_user_path 
-else
  Увы, ваша корзина пуста

Answer 1

你想要的事情都可以通过jQuery/JavaScript来完成。如果您正在寻找好看的模态，我建议您查看jQuery UI dialog。

您应该首先将事件处理程序附加到链接，如下所示。然后通过添加 event.preventDefault() 行来禁用默认操作（可能是重定向）。然后您可以使用 ajax（可能是 JSON 格式）请求视图数据并显示带有数据的模式。

$("#link").click(function(event) {
  event.preventDefault();

  //do an ajax call here and show modal
});

我建议您查看以下链接：

http://api.jquery.com/click/

http://api.jquery.com/event.preventDefault/

http://api.jquery.com/load/

..或者你可以看看这个插件，我自己没有尝试过，但它看起来真的很容易使用。

https://github.com/kylefox/jquery-modal