如何讓jQuery Tools驗證在覆蓋對話框中工作？

我有一個簡單的文本輸入對話框，使用jQT疊加 - 單擊一個鏈接，疊加打開窗體，填寫表單，點擊提交，並處理表單。我現在試圖向表單添加驗證，但驗證從未發生過。如果我禁用鏈接上的覆蓋並讓窗體在一個單獨的窗口中打開，驗證工作正常，所以我相對確定我已經正確設置了基本驗證內容。這個無覆蓋版本實際上是http://flowplayer.org/tools/demos/validator/index.html中發生的事情 - 包含表單的頁面被加載，驗證被設置，並且驗證代碼在表單提交上運行。如何讓jQuery Tools驗證在覆蓋對話框中工作？

覆蓋版本的問題，我認爲是驗證沒有得到正確設置，很可能是因爲表單沒有找到。覆蓋表單直到點擊鏈接纔會存在，因此對validator（）的調用不能位於包含鏈接的主頁面中。我已經嘗試將包含validator（）調用的SCRIPT標記添加到表單代碼的末尾，但它不起作用。在構建覆蓋表單的jQuery代碼中，也不會從validator（）調用適當的ID。在所有情況下，我都沒有看到控制檯中顯示任何javascript錯誤。 Arggh。我認爲這是jQT表單和驗證的常用用法，但我只是無法弄清楚這裏發生了什麼（或者不在這裏）。有什麼建議？謝謝！

來源

2011-01-06 Jim Miller

嘗試此處使用的方法：http://stackoverflow.com/questions/4515269/4530234#4530234 – ifaour 2011-01-06 02:11:38

你應該能夠只需輕按到覆蓋中onLoad事件：

$("#dialog").overlay({ 
    load: true, 
    onLoad: function() { 
     $("#form").validator(); 
    }, 
    onBeforeClose: function() { 
     $("#form").data("validator").reset(); 
    } 
});

編輯：新增onBeforeClose處理程序表單驗證在關閉覆蓋復位。

此外，請確保z-index CSS屬性的錯誤是以上覆蓋的z-index。

但是，我不確定爲什麼你不能將覆蓋設置代碼之外的電話撥打validator()。

疊加形式不存在，直到鏈接被點擊，所以調用驗證（）不能在主頁包含鏈接

這不是非常正確：如果你使用FireBug檢查你的HTML，你會發現疊加元素只是隱藏起來，並且會顯示出來，並且CSS會被應用到div上，使它看起來像一個模態對話框。 form應該始終存在於DOM中。

退房工作的例子在這裏：http://jsfiddle.net/andrewwhitaker/SYPSG/

來源

2011-01-06 02:18:23

這看起來很接近 - 我還有幾件事在我的結尾那不是，但它看起來很有希望。更多後... – 2011-01-06 02:41:28

@Jim：很高興聽到。隨意發佈任何您遇到特定問題的HTML/JS。 – 2011-01-06 02:48:27

@Andrew - 就像我說的，非常接近。我遇到的唯一問題，也存在於您的示例中，如果您未能正確填寫表單，顯示錯誤div，然後通過單擊頁面背景（或關閉）取消表單小部件在我的形式），形式消失，但錯誤的div仍然可見。有什麼想法嗎？ – 2011-01-06 04:58:32

如何讓jQuery Tools驗證在覆蓋對話框中工作？

回答

相關問題