Question

我对Rails（和网络）编程非常陌生，所以我甚至不确定我应该为此寻找什么技术。

我已经下载并浏览了Rails tutorial的前五章，但现在有一个非常简单的请求。

在网页的左侧，我会有一张桌子。如果用户点击该表中的元素，我希望页面的右侧显示一些新内容。

我已经有一个显示表格的页面，即：

<div class="center hero-unit">
   <div class="container">
   <h2>2012 Yearly Report</h2>
     <div class="row-fluid">
       <div class="span12">
           <div class="span4">
            <table border="1">
            </table>
           </div>
           <div class="span6">
                <!-- load stuff here based on what someone clicks on in the table -->
           </div>
         </div>
      </div>
   </div>
</div>

我正在使用bootstrap layouts来展示所有内容。我只是不明白如何改变＆＃39; span6＆＃39;的内容。 div基于＆span;＆＃39; span4＆＃39;。

中的用户行为

Answer 1

这是一个难以回答的问题。这实际上取决于您尝试显示的数据类型以及您正在寻找的交互方式。

您实际上并没有提供有关您要完成的内容的大量信息，但如果我不得不猜测，您正在尝试从数据库加载数据并将其插入元素而不会离开当前页面。这就是AJAX的用途（你的教程在第11章中进行了一些介绍）并涉及大量的javascript，这通常超出了像Ruby这样的服务器端语言的范围。幸运的是，rails包含帮助程序，可以轻松地将AJAX功能包含到您的Web应用程序中，而无需编写大量的javascript（尽管您必须编写一些）。

例如，假设您的表有一个文章列表，并且您希望在单击其链接时显示div中文章的内容。

首先是链接：

<%= link_to article.name, article_url(article), :remote => true %>

远程选项告诉Rails它是一个AJAX链接。

接下来，您需要为文章的show动作呈现javascript模板。你可以将它命名为show.js.erb。

假设您希望加载数据的div看起来像这样，

<div id='article-content'></div>

您希望show.js.erb包含以下内容：

$('#article-content').html("<%=javascript_escape @article.content %>");

当点击其中一个远程链接时，将评估此javascript（带嵌入式ruby）代码，并将用文章的内容替换div的内容。

网上有大量资源可以为您提供更多信息。一周前，railscasts似乎刚刚发布episode on this topic。它需要订阅才能查看，但非常值得（特别是如果你刚刚开始）。

如何在rails中加载div来响应另一个div的点击？

1 个答案: