Rails 4中的Link_to和Ajax請求

Question

我有以下幾點：

<%= link_to "Some_link", some_path, class: "btn btn-success btn-xs", id: "contact", "data-sid" => item.id %>

在我的application.js中，我有：

$('#contact').click(function (e) {
    e.preventDefault();

    var item_id = $(this).data('sid');

    $.ajax({
      type: 'GET',
      url: '/somepath'+ item_id,
      success: function(data) {
       $("#edit-project-modal").find("input[name='id']").val(data.id);
       $("#edit-project-modal").find("input[name='name']").val(data.name);

     },

      error: function() {
       window.alert('Error Loading Item!!');
      }
   });
});

路徑“ some_path”將具有供用戶填寫的表格。 也就是說，我真正想要實現的是當用戶單擊鏈接“ Some_link”時，該鏈接可以將用戶重定向到“ some_path”，但是在此之前，我要執行ajax請求以將數據加載到表單中。 我不知道在這種情況下是否可以使用：remote =>“ true”。 現在發生的是，當我單擊鏈接時，ajax起作用了，但並沒有將我發送到該頁面。

我究竟做錯了什么？ 有什么建議么。 先感謝您。

Answer 1

假設您要：

1. 單擊“某些鏈接”（通過AJAX）
2. 然后，“聯系表格”正出現在“某些鏈接”下方

您可以使用以下內容：

<%= link_to "Some_link", some_path, class: "btn btn-success btn-xs", id: "contact", "data-sid" => item.id %>
<section id='contact-form'></section>

$('#contact').click(function (e) {
  e.preventDefault();

  var item_id = $(this).data('sid');

  $('#contact-form').load('/somepath'+ item_id, function(response, status, xhr){
    if (status === "error") {
      window.alert('Error Loading Form!!');
    }
    else {
      window.alert('Success Loading Form!!');
    }
  })
);

Answer 2

好吧，現在我對您的要求有了更好的了解，我覺得我更有能力為您服務。 您的工作非常復雜，解決此問題的方法將行不通。

$('#contact').click(function (e)在捕獲點擊事件然后嘗試執行AJAX查詢時的狀態-我假設您正在從控制器發回數據並且不執行任何操作接收數據，然后嘗試填充表單字段，但是這些表單字段當然不存在……您還沒有導航到該頁面-此時您的jquery很可能會靜默失敗。

現在，由於吞下了事件並阻止了默認行為，因此不會遵循鏈接的原始路徑。 即使您允許事件傳播，它也將無法如前一段中突出顯示。

好吧，在不知道您的進一步要求的情況下，對我來說似乎您需要做的就是

1. 刪除所有的jQuery。

2. 允許link_to像普通HTTP GET一樣執行您的操作。

   <%= link_to edit_item_path(item), class: "btn btn-success btn-xs", id: "contact" %>

   **假設您有一個帶編輯操作的ItemController，並且路由設置為

   edit_item GET /items/:id/edit(.:format) items#edit

3. 將數據設置為控制器中的實例變量

   @item = Item.find(params[:id])

4. 使用實例變量將表單呈現為html.erb-

例如，

<%= form_for @item, url: item_path do |f| %>
  <%= f.label :name %>
  <%= f.text_field :name %>
  <input type='submit'/>
<% end %>

只需直接導航到表單即可。