Rails - 如何编写 jQuery 来处理服务器响应的 JSON 数据？答案

【问题标题】：Rails - How do I write jQuery to handle the JSON Data that server respond?Rails - 如何编写 jQuery 来处理服务器响应的 JSON 数据？
【发布时间】：2014-03-16 08:50:48
【问题描述】：

在 Rails 中，如果我将 remote: true 添加到链接中，那么它将使用 Ajax 请求，但是当服务器在客户端将 JSON 发送回时，我应该为处理这些数据写什么？

谁能帮助我？谢谢。

更新

在Rails中，像这样的代码，只需添加remote: true，它将使用Ajax发送请求：

<%=  form_tag(add_link_to_a_shared_list_url, :method => "post", :remote => true) do %>
    <%= select_tag "shared_list_id", options_from_collection_for_select(@shared_lists, "id", "title") %>
    <%= hidden_field_tag(:link_id, link.id) %>
    <%= submit_tag "submit", :class => "btn btn-default" %>
<% end %>

我想编写一些 jQuery 代码来捕获 JSON 并将其放入 DOM。

确切地说，处理Ajax请求的代码我们不需要编写，因为它是由Rails处理的，但是我们需要编写处理来自服务器的JSON数据响应的代码。

【问题讨论】：

您能否添加一个您希望服务器发回的示例响应？

标签： ruby-on-rails ajax json

【解决方案1】：

https://api.jquery.com/jQuery.ajax/

一个简单的例子是：

    $.ajax({
            type: "GET",
            url: "url",
            data: {
                   input : yourInput
            },
            success: function(output){
                   // do something with the output
            }
    })

【讨论】：

【解决方案2】：

你应该区分 UJS 和 JSON API。

UJS：服务端返回Javascript，客户端接收直接执行（不需要remote: true，但有format.json）。

$("new_reply_form").on "submit", (event) ->
  $.ajax(
    url: $(this).prop("action")
    dataType: "json"
).done (data) ->
  # local logic
  return

JSON API：服务端返回数据，客户端接收本地处理后再执行。

第一：远程：真

<%= form_for(@reply, remote: true) do |f| %>
  <div class="field">
    <%= f.label :body %><br />
    <%= f.text_area :body %>
  </div>
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

二：format.js

   def create                                                                          
     @entry = Entry.new(params[:entry])                                                

     respond_to do |format|                                                            
       if @entry.save                                                                  
         format.html { redirect_to @entry, notice: 'Entry was successfully created.' } 
         format.js                                                                     
       else                                                                            
         format.html { render action: "new" }                                          
         format.js                                                                     
       end                                                                             
     end                                                                               
   end

第三：action_name.js.erb

<% if @reply.errors.empty? %>                                                          
  $('<%= j(render :partial => 'reply', :object => @reply) %>').appendTo($('#replies'));
<% else %>
  alert('@reply.errors.full_messages.join(',')');                                      
<% end %>

更多请参考Working with JavaScript in Rails

【讨论】：