在jQuery滑塊中使用表單的Rails客戶端驗證

Question

我有一個網站，它有一個基於jQuery的滑塊Awkward Showcase。

在這些幻燈片中，我有一個用於新用戶註冊的Rails表單。我正在使用client side validation gem進行客戶端驗證。

問題是因爲表單在第二個.showcase-slide上，當頁面加載時，它不存在於DOM中，並且客戶端驗證不起作用。

我需要一種方式來使用在客戶端驗證的GitHub頁面找到的鉤子，以加載我的元素時激活客戶端驗證。

那麼如何在窗體上使用鉤子$('form#user_new[data-validate]').validate();，該窗體的ID爲user_new，並且在更改展示幻燈片時不會立即加載並從DOM中消失。

我嘗試了幾個.live和.bind變化，但顯然我的jQuery非常薄弱，我沒有運氣。

請幫忙嗎？

更新

我已經試過這樣：

$("body").delegate("#user_username", 'focus', function(){ 
    $('form#user_new[data-validate]').validate()}); 

但現在我每次點擊#user_username場時間，另一個驗證被添加到堆棧中，我得到多個錯誤（克隆）顯示一個領域。

另一個更新和醜陋的解決方案

好吧，這是我想出的，但可以肯定的是醜陋的。歡迎任何更好的解決方案！

$("body").delegate("#user_username", 'focus', function(){ 
    if ($('form#user_new[data-validate]').data('events') === undefined) { 
    $('form#user_new[data-validate]').validate() 
    }}); 

Answer 1

這可能不那麼矮胖。

您將需要添加一個類（即「validateme」）到你正在關注的領域，雖然。

$("body").delegate("#user_username.validateme", 'focus', function(){ 
    $(this).closest('form').removeClass('validateme').validate(); 
}); 

這樣，只有當被聚焦的元素具有validateme類時，纔會添加驗證。一旦集中，類將被刪除，並將驗證應用於表單。

Answer 2

我使用rails 3.2.8，simpleForm 2.0.2，client_side_validations 3.2.0.beta.4和client_side_validations-simple_form 2.0.0.beta.1和上述解決方案運行良好，但解決方案不完整，因爲當驗證被反彈（如果您更改了製表符並且返回），如果您多次以相同的字段以相同的形式觸發錯誤，則字符串錯誤會被重複，重複三次等等。

因此，對於此特定領域，您必須在您的js.coffee文件中添加「span橡皮擦」，因爲client_side_validations每次都會添加一個範圍，而您只希望看到最後一個範圍。

完整的解決方案是（把代碼放到你的* .js.coffee文件）：

# the above suggested works well 
$("body").delegate "#user_name", "focus", -> 
    $(this).closest("form").removeClass("validateme").validate() 

# my additional code 
$("#user_username").live "blur", -> 
    $(@).siblings("span:not(:last)").remove() 
    # $(@).siblings() is identical to $(@).parent().children() except @ 
    # in other words, select my "brothers" except me if yes or not match the selector 
    # (nicer!) 

這是一個例子;如果您的情況不同，請檢查生成的HTML並使用選擇器進行播放。