Closed omeraha closed 5 years ago
Hi,
I wrote a cell validator according to this example (following is a shorter version of the original code):
{ text: 'IPv4', dataField: 'IPv4', validator: (newValue, row, column) => { if (!isValidIP(newValue)) { return { valid: false, message: 'Must be a valid IP address' }; } return true; } };
The logic works well, but for some reason the error message isn't aligned with the field and doesn't fully appear:
Update:
I inspected the html, and saw that when the validation method returns, the following component is added to the html file:
<div class="alert alert-danger in" role="alert"> <strong>Must be a valid IP address</strong> </div>
When I removed the 'alert' property from the class, the message appeared properly:
<div class="alert-danger in" role="alert"> <strong>Must be a valid IP address</strong> </div>
Am I doing something wrong here? Can I somehow remove the 'alert' attribute from the returned component?
Found the problem. The misalignment were due to the following css configurations:
.alert { left: -50%; z-index: 100; }
Hi,
I wrote a cell validator according to this example (following is a shorter version of the original code):
The logic works well, but for some reason the error message isn't aligned with the field and doesn't fully appear:![image](https://user-images.githubusercontent.com/43315856/58707714-5d120e00-83be-11e9-9cc0-c13fcd6716d2.png)
Update:
I inspected the html, and saw that when the validation method returns, the following component is added to the html file:
When I removed the 'alert' property from the class, the message appeared properly: