2011-04-01 2 views
5

누구나 Ruby on Rails 3에서 jquery UI가있는 아약스 탭 구현을위한 예제 코드를 어디서 찾을 수 있는지 알고 있습니까? 양식 및 주석 처리에서 찾은 예제를 기반으로 작동하지 못하는 것을 찾을 수 없습니다. 나는 레일에서 루비를 처음 사용하기 때문에 새삼 스럽다. JQuery와 사이트에서 아약스 예와 JQuery와 UI 탭을 기반으로 Rails에서 ajax가있는 jquery UI를 구현 하시겠습니까?

, 나는 다음과 같은 코드를 가지고 :

간단한 컨트롤러 - maps_controller.rb

def index 
    end 

    def test1 
    @test = "test string" 
    end 

관련보기 - index.html을

<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를을 .erb tml.erb

<%= @test %> 

아약스 기능이 작동하는 것 같습니다. test1 탭을 클릭하면 전체 페이지가 해당 데이터와 함께 div에로드됩니다. 분명히 이것은 원하는 기능이 아닙니다. 단지 test1.html.erb에 application.html.erb로 렌더링하지 않고 표시하기 만하면됩니다.

또한 .js.erb 파일을 사용하는 규칙을 사용하는 다양한 레일 예제를 발견했습니다. ()

+0

시작할 코드가 있습니까? – Ant

+0

죄송합니다. 시작해야합니다. 편집을 참조하십시오. – Patm

+0

render : layout => false를 사용하면 문제가 해결된다는 것을 알았습니다. 그러나, 아약스가 눈에 거슬리지 않기 때문에 아약스를 사용하는 적절한 방법이라고 생각하지 않습니다. – Patm

답변

0

자바 스크립트 코드를 application.js 파일에 넣고보기에 포함 시키면 좋습니다.

관련 문제