阻止驗證無法正確使用jqTransform

我正在使用jqTransform對我的表單進行樣式設計，效果非常好。但是，當我添加Bassistance的Validation插件時，驗證錯誤消息顯示在jqTransformwrapper div（即文本框內）中，而不是父元素（輸入後）。阻止驗證無法正確使用jqTransform

所以DOM表明這一點：

<label for="firstname">Firstname</label> 
<div class="jqTransformInputWrapper"> 
    <div class="jqTransformInputInner"> 
     <div><input class="required jqtranformdone jqTransformInput error" name="firstname" id="firstname"> 
     <label for="firstname" generated="true" class="error">This field is required.</label> 
     </div> 
    </div>

而應該是：

<label for="firstname">Firstname</label> 
<div class="jqTransformInputWrapper"> 
    <div class="jqTransformInputInner"> 
     <div> 
     <input class="required jqtranformdone jqTransformInput error" name="firstname" id="firstname"> 
     </div> 
    </div> 
</div> 
<label for="firstname" generated="true" class="error">This field is required.</label> 
</div>

有沒有什麼辦法可以讓插件插入錯誤標籤3家長的高？

我注意到在Bassistance的示例頁面上他們使用了不同的表單樣式插件，並沒有這個問題，但我不知道他們是如何做到的。 http://jquery.bassistance.de/validate/demo/themerollered.html

來源

2010-09-02 iltdev

作爲解決方法，我將行div設置爲相對定位，並將錯誤消息設置爲絕對，以便它相對於div。

#myForm label.error { 
    color:#dd0000; 
    position:absolute; 
    float:none; 
    font-style:italic; 
    left:350px; 
    top:4px; 
}

這種方式出現的錯誤並肩輸入，而不是在它裏面:)

來源

2010-09-02 10:06:22 iltdev

查找這在調用驗證功能：

errorPlacement: function(error, element) { 
        if (element.is(":text")) 
         error.appendTo(element.parent().parent().parent().parent()); 
        else 
         error.appendTo(element.parent().next()); 
       }

通知.parent（）序列。你可以像這樣定位不同的區域。它被稱爲jquery選擇器。其他選項包括：.children（）.next（）.prev（）

請注意，我指定了文本輸入作爲原點。通過使用這個許多parent（）選擇器，你可以逃避jqtransform包裝divs併到達外部世界。

玩組合玩具，將標籤貼在你想要的地方！

來源

2012-02-10 23:08:24

阻止驗證無法正確使用jqTransform

回答

相關問題