fix: Form validation - fix red text CSS selector and add focus-to-clear

This commit is contained in:
Hermes Agent 2026-06-18 17:45:28 +08:00
parent 37f46ed1bd
commit 937d6575ed
2 changed files with 14 additions and 1 deletions

View File

@ -649,7 +649,7 @@ hr {
.inputbox.field-error {
border-color: #e74c3c;
}
.field-error-msg .bricks-text {
.bricks-text.field-error-msg {
color: #e74c3c !important;
}

View File

@ -71,6 +71,13 @@ bricks.FieldGroup = class {
box.add_widget(errw);
form.name_error_widgets[fields[i].name] = errw;
form.field_rules[fields[i].name] = fields[i].rules;
// Bind focus event to clear error
var fname = fields[i].name;
if (w.dom_element){
w.dom_element.addEventListener('focus', function(){
form.clear_field_error(fname);
});
}
}
} else {
bricks.debug(fields[i], 'createInput failed');
@ -222,6 +229,12 @@ bricks.FormBase = class extends bricks.Layout {
var box = bricks.getWidgetById(name + '_box', this);
if (box && box.dom_element) box.dom_element.classList.add('field-error');
}
clear_field_error(name){
var ew = this.name_error_widgets[name];
if (ew){ ew.set_otext(''); ew.hide(); }
var box = bricks.getWidgetById(name + '_box', this);
if (box && box.dom_element) box.dom_element.classList.remove('field-error');
}
clear_all_errors(){
for (var name in this.name_error_widgets){
var ew = this.name_error_widgets[name];