@daka said in hot to reference to the bordercolor?:
validateTextField(id, idError, borderColor) {
id.style.TextFieldStyle.background.border.color = "red"
}
First of all you could do it automatically by property binding, as the TextField has a property "acceptableInput":
TextField {
id: firstname
Layout.minimumWidth: 300
placeholderText: qsTr("type here your firstname")
activeFocusOnPress: true
background: Rectangle {
radius: 5
border.color: firstname.acceptableInput ? "green" : "red"
border.width: 1
}
validator: RegExpValidator {
regExp: /[A-Z a-z 0-9]+/
}
}
In case you want to stick to the validation function, you could do it e.g. like this:
TextField {
id: firstname
Layout.minimumWidth: 300
placeholderText: qsTr("type here your firstname")
activeFocusOnPress: true
background: Rectangle {
radius: 5
border.color: "gray"
border.width: 1
}
validator: RegExpValidator {
regExp: /[A-Z a-z 0-9]+/
}
// pass the current element and validation
// (validation could be addressed from the passed element as well)
onFocusChanged: validateTextField(this, acceptableInput)
}
/* validation function */
function validateTextField(el, valid) {
el.background.border.color = valid ? "green" : "red"
}
