2011-04-01 85 views
5

有没有人知道我在哪里可以找到一些示例代码在Ruby on Rails 3中用jQuery UI实现ajax选项卡?根据我发现的用于表单和注释处理的示例,我无法找到任何我无法找到的工作。请注意,我对轨道上的红宝石很陌生。在Rails中使用ajax实现jquery ui选项卡?

根据与从jQuery站点AJAX例如jQuery的UI选项卡,我有以下代码:

简单的控制器 - maps_controller.rb

def index 
    end 

    def test1 
    @test = "test string" 
    end 

关联的视图 - 的index.html .erb

<script> 
     $(function() { 
      $("#tabs").tabs({ 
       ajaxOptions: { 
        error: function(xhr, status, index, anchor) { 
         $(anchor.hash).html(
          "Couldn't load this tab. We'll try to fix this as soon as possible. " + 
          "If this wouldn't be a demo."); 
        } 
       } 
      }); 
     }); 
     </script> 



<div class="demo"> 

<div id="tabs"> 
    <ul> 
     <li><a href="#content_area">Preloaded</a></li> 
     <li><%= link_to "Test1" , test1_path %></li> 
    </ul> 
    <div id="content_area"> 
     <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p> 
    </div> 
</div> 

</div><!-- End demo --> 

test1.h tml.erb

<%= @test %> 

ajax功能似乎工作。当单击test1选项卡时,整个页面将被加载到具有相应数据的div中。显然,这不是所需的功能 - 我只想显示test1.html.erb,而不是使用application.html.erb呈现。

我也发现了各种轨道使用具有.js.erb文件约定的具体示例。 (http://blog.bernatfarrero.com/jquery-and-rails-3-mini-tutorial/

对此的任何输入都会很好。

+0

你有任何启动代码吗? – Ant 2011-04-01 14:35:55

+0

对不起,应该已经开始了。请参阅编辑。 – Patm 2011-04-01 15:01:50

+0

我发现使用render:layout => false可以解决问题。不过,我不觉得这是使用ajax的正确方法,因为它并不显眼。 – Patm 2011-04-01 15:13:02

回答

0

把你的JavaScript代码放在application.js文件中,将它包含在你的视图中,你很好走。