【问题标题】:Rendering JSON from AJAX call in Rails在 Rails 中从 AJAX 调用渲染 JSON
【发布时间】:2012-09-25 15:55:37
【问题描述】:

我有一个 ajax 调用来从返回 JSON 数据的 Flickr API 获取信息。我想在我的视图中显示来自 JSON 数据的值。我通过使用 jQuery 编辑一些 innerHTML 来做到这一点。我遇到的问题是数据未定义,因此看起来像是范围问题。

照片.js

jQuery(function() {
  $('#<%=p[:id]%>').click(function (e) {

    //ajax call to fetch photo info

    var fetch_id = '<%=p[:id]%>';
    var fetch_secret = '<%=p[:secret]%>';  

    $.ajax({
      type: 'GET',
      url: '/photos/fetch_info',
      dataType: 'json',
      data: { 'id' : fetch_id, 'secret' : fetch_secret },
      success: function(data){

        console.log(data)  //returns Object
        console.log(data.title)  //returns appropriate title

        //edit innerHTML of basic_modal
        $('.basic_modal').html(
          "<div id='modal_image'><%= escape_javascript(image_tag p[:url]) %></div><div id='photo_title'><%=data.title %></div>"
         );

        //load modal
          $('.basic_modal').modal({
          overlayClose:true
        });

      } //end success: function(result)
    });

当我将 data.title 打印到控制台时,我得到了适当的标题。但是,当我尝试编辑 HTML 并呈现 &lt;%=data.title %&gt; 时,我收到未定义的变量/方法错误。

关于如何在视图的模式中显示数据的任何提示?

这是我的控制器:

def fetch_info

  @info = flickr.photos.getInfo(:photo_id => params[:id], :secret=> params[:secret])

  respond_to do |format|
    format.json { render :json => @info }
  end

end

【问题讨论】:

    标签: ruby-on-rails ajax ruby-on-rails-3 jquery


    【解决方案1】:
     var result = jQuery.parseJSON(data);
    

    你不需要这样做,因为datatype:JSON已经解析了数据

    $('.basic_modal').html(
              "<div id='modal_image'><%= escape_javascript(image_tag p[:url]) %>
    </div><div id='photo_title'><%="+data.title+" %></div>"
             );
    

    这可能对你有帮助

    【讨论】:

    • 我在上面的问题中解决了这个问题。我将它打印到控制台并看到它返回 NULL 所以我认为它已经被解析了。为了便于阅读和避免混淆,我将其删除。
    • &lt;%="+data.title+"%&gt; 在我看来显示字符串 +data.title+,而不是实际标题。
    • 标题的实际值。例如,如果我在 DOM 中有以下可用 JSON:{"title":"Cheeseburger"},我想渲染“Cheeseburger”
    • 我是 php 开发者,请正确格式化您的代码,以便我能正确回答
    • 我认为这更像是一个 Rails 问题。不过我很感激你的帮助:)
    猜你喜欢
    • 2023-03-31
    • 1970-01-01
    • 2013-06-19
    • 2020-11-17
    • 2016-06-19
    • 1970-01-01
    • 2014-02-09
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多