fix: Form validation - fix red text CSS selector and add focus-to-clear
This commit is contained in:
parent
37f46ed1bd
commit
937d6575ed
@ -649,7 +649,7 @@ hr {
|
|||||||
.inputbox.field-error {
|
.inputbox.field-error {
|
||||||
border-color: #e74c3c;
|
border-color: #e74c3c;
|
||||||
}
|
}
|
||||||
.field-error-msg .bricks-text {
|
.bricks-text.field-error-msg {
|
||||||
color: #e74c3c !important;
|
color: #e74c3c !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -71,6 +71,13 @@ bricks.FieldGroup = class {
|
|||||||
box.add_widget(errw);
|
box.add_widget(errw);
|
||||||
form.name_error_widgets[fields[i].name] = errw;
|
form.name_error_widgets[fields[i].name] = errw;
|
||||||
form.field_rules[fields[i].name] = fields[i].rules;
|
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 {
|
} else {
|
||||||
bricks.debug(fields[i], 'createInput failed');
|
bricks.debug(fields[i], 'createInput failed');
|
||||||
@ -222,6 +229,12 @@ bricks.FormBase = class extends bricks.Layout {
|
|||||||
var box = bricks.getWidgetById(name + '_box', this);
|
var box = bricks.getWidgetById(name + '_box', this);
|
||||||
if (box && box.dom_element) box.dom_element.classList.add('field-error');
|
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(){
|
clear_all_errors(){
|
||||||
for (var name in this.name_error_widgets){
|
for (var name in this.name_error_widgets){
|
||||||
var ew = this.name_error_widgets[name];
|
var ew = this.name_error_widgets[name];
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user