jQuery Validation , 自訂錯誤訊息位置

有時候想要透過 jQuery Validation 做簡單的做表單驗證,但是偏偏錯誤訊息顯示在輸入框位置的下方導致HTML排版跑板了

官方文件中提供的方法可以解決這個問題

參考連結 : https://jqueryvalidation.org/documentation/

舉例說明

假設我們有一段表單HTML如上,此時想要顯示必填錯誤訊息在問題之後而非選項之後,下列方法可以簡單做到

首先,在HTML上增加一個<sapn></span>,用來顯示必填錯誤訊息

接著在script的地方加入參數

其中,error是錯誤訊息的dom元件,element則是觸發必填錯誤的元件

所以我們依照HTML結構找到觸發錯誤的元件網上層找到.display_error span,將錯誤訊息append在這個span中,就完成啦~

其他方式可以參考官網文件

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *