插入額外的內容到香菜錯誤

Question

我想我的香菜JS驗證錯誤渲染這樣的：

<span id="parsley-id-8333" class="form-error filled"> 
    <span class="parsley-required"> 
     <i class="fa fa-exclamation-triangle"></i> 
     Error Message Goes Here 
    </span> 
</span> 

如何修改功能增加我的errorTemplate內<i>？

window.ParsleyConfig = { 
    errorsWrapper: '<span class="form-error"></span>', 
    errorTemplate: '<span></span>' 
}; 

Answer 1

問題是：對於同一個字段的多個錯誤消息會發生什麼？

errorsWrapper: '<span class="form-error"><i class="fa fa-exclamation-triangle"></i></span>', 
errorTemplate: '<span></span>' 

你會得到兼容的東西與你正在尋找：

<span id="parsley-id-8333" class="form-error filled"> 
    <i class="fa fa-exclamation-triangle"></i> 
    <span class="parsley-required"> 
     Error Message Goes Here 
    </span> 
</span> 

如果有一個三角形是對你罰款，那麼它很容易增加你的圖標到包裝材料實現

當然，除非確實存在錯誤，否則您不希望它出現，否則您需要一些CSS規則來隱藏它，如：

.form-error:not(.filled) i { display: none; } 

如果你真的需要它在errorTemplate，那麼恐怕有沒有簡單的方法，但它不會很難用javascript自己添加它。您可以收聽parsley:form:error事件，搜索錯誤跨度並預先安排您的<i> ...