2011-04-01 86 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文件中,將它包含在你的視圖中,你很好走。