軌道4：顯示微調與形式的JavaScript提交

在我的Rails 4的應用程序，它使用Turbolinks，我有以下形式：軌道4：顯示微調與形式的JavaScript提交

<%= form_for [@calendar, @post], html: { multipart: true } do |f| %> 
[...] 
    <div class="actions" id="post_submit_before_spinner"> 
    <%= f.submit @post.new_record? ? "CREATE POST" : "UPDATE POST", :id => :post_submit %> 
    </div> 
    <div class="spinner" id="post_submit_spinner"> 
    <i class="fa fa-refresh fa-spin"></i> Please wait... 
    </div> 
<% end %>

我想目前在post_submit_spinner DIV使用JavaScript來顯示微調錶單提交時。

我有這樣的app/assets/javascripts/posts.coffee：

$(document).ready -> 
    $('#post_submit_spinner').hide() 
    return 

$(document).getElementById('post_submit').on click() -> 
    $('#post_submit_spinner').show() 
    return

微調器是隱藏在頁面加載 - 這正是我想要的 - 但是當用戶在post_submit_before_spinner DIV與按鈕提交表單它不顯示。

任何想法我的代碼有什麼問題？

來源

2015-12-15 Thibaud Clement

我固定用下面的代碼的問題app/assets/javascripts/posts.coffee：

$(document).ready -> 
    $('#post_submit_spinner').hide() 

$(document).ready -> 
    $("#post_submit_before_spinner").click -> 
    $('#post_submit_spinner').show() 
    return 
    return

來源

2015-12-15 23:08:08

我建議增加$.ready函數調用內部的點擊偵聽器定義（自post_submit元素可以不存在尚未）如下：

$(document).ready -> 
    $('#post_submit_spinner').hide() 
    $('#post_submit').on click() -> 
    $('#post_submit_spinner').show() 
    return 
    return

來源

2015-12-15 22:52:36

感謝您的回答。我明白你的意思，這是有道理的。我實現了代碼，它似乎還沒有工作。我在控制檯中得到以下錯誤：'Uncaught TypeError：$（...）。getElementById不是函數'。任何想法？ –

@ThibaudClement，很高興知道...如果它有幫助，那麼選擇最佳答案:) –

好吧，正如我的評論中提到的那樣，它還沒有工作。如果沒有解決問題，則不能接受答案。 –

軌道4：顯示微調與形式的JavaScript提交

回答

相關問題