2013-03-01 45 views
0

我有一個Rails 3應用程序與一些jQuery UI選項卡來顯示發佈和未發佈的故事。這裏是erb模板:jQuery UI選項卡持久性(coffeescript)

<ul class="tabs"> 
    <li><strong>Filter:</strong></li> 
    <li class="active"><%= link_to 'Published', '#published_stories' %></li> 
    <li><%= link_to 'Unpublished', '#unpublished_stories' %></li> 
</ul> 

<div id="published_stories"> 
    <% @published_stories.each do |published_story| %> 
    <article class="story_article"> 
     <h2><%= published_story.title %></h2> 

     <ul> 
     <li><%= link_to "Update", edit_story_path(published_story) %></li> 
     <li><%= link_to "Destroy", story_path(published_story), method: "delete", confirm: "Are you sure?" %></li> 
     </ul> 

     <%= time_tag published_story.published_at, pubdate: true %> 
     <%= markdown published_story.content.truncate(400, separator: " ") %> 
    </article> 

    <%= paginate @published_stories %> 
    <% end %> 
</div> 

<div id="unpublished_stories"> 
    # As above to show unpublished stories 
</div> 

我正在監聽li元素上的click事件以設置活動選項卡的樣式。現在我想使用jquery.cookie.js,以便在頁面刷新後,先前選擇的選項卡仍然存在。這是我已經:

jQuery -> 
    $(".tab_container").tabs(
    active : ($.cookie('saved_tab') || 0), 
     activate : -> (event ui) 
     newIndex = ui.newTab.parent().children().index(ui.newTab) 
     $.cookie('saved_tab', newIndex, { expires: 1 }) 
) 

    $(".tabs li").click -> 
    $(this).addClass("active").siblings().removeClass("active") 

我得到的錯誤消息是它找不到變量ui。任何幫助深表感謝。

回答

0

我可以在CoffeeScript中看到一些關閉的東西。

(arg, arg, ...) -> function_body 
在CoffeeScript中

所以你想說activate: (event, ui) -> ...

首先,功能等規定。您的-> (event ui)被解釋爲:

-> event(ui) 

並且這沒有多大意義。其次,你必須非常小心你在CoffeeScript中的縮進,縮進幾乎是你定義代碼結構的所有東西,所以你必須非常小心。當你這樣說:

activate : -> (event ui) 
    newIndex = ui.newTab.parent().children().index(ui.newTab) 
    $.cookie('saved_tab', newIndex, { expires: 1 }) 

CoffeeScript中沒有看到newIndex轉讓或$.cookie召喚爲activate方法的一部分,CoffeeScript的看到三個獨立的和無關的聲明。

應用上面給我們:

$(".tab_container").tabs(
    active : ($.cookie('saved_tab') || 0), 
    activate : (event, ui) -> 
    newIndex = ui.newTab.parent().children().index(ui.newTab) 
    $.cookie('saved_tab', newIndex, { expires: 1 }) 
)