Question

我在Rails应用程序中有一个用户'提交'列表，当点击用户提交时，我希望将完整提交加载到视图中，而不必转到新页面。

以下是提交列表的代码：

<div id="submission-list-container">
    <% current_user.submissions.each do |i| %>
        <a href='#'>
            <div id="post-container">
                <%= i.title %> 
            </div>
        </a>
    <% end %>
</div>

我创建的部分<%= render "show", :submission => i %>,工作正常，但我希望在点击上面的链接时将完整提交加载到视图（index.html.erb）中。有这么好的方法吗？我应该在JavaScript中执行其他类似AJAX调用的操作吗？我喜欢这些偏爱，因为它感觉更干净，更有条理地分离代码。

我的偏见现在非常简单：

<%= submission.title %>
<%= dat_markdown(submission.content) %>

Answer 1

您可以使用Dojo Toolkit中的TitlePane执行此操作，可能还有一个与jQueryUI类似的小部件。

我只能谈论Dojo Toolkit的版本

您可以这样做：

<div data-dojo-type="dijit/TitlePane" data-dojo-props="href: '/blah', title: '<%= submission.title %>', open: false">

您可以在应用程序布局中包含此内容，以便从CDN加载dojo的精简版：

<script data-dojo-config="async: true, parseOnLoad: true"></script>
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/dojo.js"></script>

TitlePane已连线，因此在展开时，它会自动加载提供给href参数的内容。

虽然这不是直接的rails解决方案，但它可以作为替代方案。

对于Rails解决方案，您只需对呈现部分的控制器使用AJAX调用即可。您甚至可以使用

将其连接起来

def blah
  @submission = Submission.find(...)
  respond_to do |format|
    format.html # default render
    format.js # js behavior
  end
end

然后是blah.html.erb

<%= render partial: 'submission/submission', object: @submission %>

部分

<div id='submission-<%= submission.id %>'>
  <div id='submission-<%= submission.id %>-title'><%= link_to(submission.title, 'blah/blah', remote: true) %></div>
  <div id='submission-<%= submission.id %>-content'></div>
</div>

和blah.js.erb

$.get('/submission/content', function(data) { $('#submission-<%= @submission.id %>-content').html(data) } );

以及带路径

的submissions_controller的条目

def content
  @submission = Submission.find(...)
  render text: @submission.content
end

这可能不是一个确切的解决方案，但希望它会让你走上正确的道路。

如何在单击链接时将部分加载到视图中？

1 个答案: