Question

我试图在用户选择从列表中加载哪些数据后将新数据加载到页面上。在用户选择之前，我希望列表中的第一项显示其数据。

所以，在我的html.erb文件中：

<div id="detailsPA">
     <%=  render @app.snaps, :toolkit_view => false %>
   <div id="test">
     <%= render :partial =>'snaps/snap_details', :locals=> {:snap => @app.snaps[0]} %>
   </div>
</div>

@ app.snaps是一组包含大量数据的项目。这里，此数组中的项称为snap。

第一个渲染@ app.snaps将数组渲染为链接。第二个，呈现列表中项目的数据。

以下是链接列表的代码。

<%=link_to snap.name,{controller: 'snaps', action: 'snap_details', id: snap.id, remote: true}, {method: :get, class: 'snapButton'}%>

为了使第二个渲染工作，我必须告诉它选择了哪个项目（或者在这种情况下是snap）。

单击链接时，其数据应替换旧数据。我的控制器看起来像：

def snap_details
  @snap = Snap.find(params["id"])
  render :json=>{:key=> @snap.id}
end

然后我的js文件看起来像：

$(document).ready(function(){
   $('.snapButton').on('ajax:success', function(event, data, status, xhr){
      $('#test').empty();
      $('#test').html("<%=escape_javascript render(:partial =>'snaps/snap_details', :locals=> {:snap => @snap})%>");
  });

});

但是当我点击链接时，新数据不会替换旧数据。

我是Ruby on Rails和Javascript的新手。我觉得我接近我想要的东西，但我错过了一些非常重要的东西。

Answer 1

你正在渲染一个像这样的json对象：{ key: '123' }（只有id）。您无权访问实例变量@snap。

尝试以下方法：

def snap_details
  @snap = Snap.find(params["id"])
end

在snaps文件夹中创建新文件snap_details.js.erb。由于您在链接中使用remote: true，请求将在控制器中作为JavaScript处理。

<强> snap_details.js.erb

$('#test').empty();
$('#test').html("<%=escape_javascript render('snaps/snap_details', {snap: @snap})%>");

希望这有帮助！

我不认为我正确使用Ruby on Rails中的js文件

1 个答案: