Project

General

Profile

Custom Validator

Added by Stefan Kurek over 2 years ago

Hello there,

I know there are examples in the widget-gallery ([[https://www.webtoolkit.eu/widgets/forms/validation]]), but it just seems not to work for me:
I made a class based on Wt::WValidator and implemented the virtual functions validate (as a test, returning Wt::ValidationState::Invalid), format (just returning ""), inputFilter (accepting .*) and javaScriptValidate.

javaScriptValidate() is implemented like this:

    return "{"
           "    validate: function(text) {"
           "        var val = false;"
           "        var msg = \"test-\" + text;"
           "        return {"
           "            valid:val,"
           "            message:msg"
           "        };"
           "    }"
           "}";

I also added some debug-output (std::cout << "something" << std::endl;) and now noticed the WLineEdit I assigned an instance of my Validator to is not even checking the input (as the debug-outputs can be seen upon loading the widget but not when changing its content).

Can someone help me figure out why the Validator does not what it's supposed to do?


Replies (2)

RE: Custom Validator - Added by Stefan Kurek over 2 years ago

Guys, it's been over two weeks and I still have no idea how to make the Validator work.

The custom Validator I made does not even check the input and a premade Validator limits the input to a format, but does not change the style. Any ideas?

RE: Custom Validator - Added by Korneel Dumon over 2 years ago

Sorry for the delay. I think the answer is that it depends on the theme.

Your javascript validation seems fine and Wt indeed puts the 'Wt-invalid' class on the input. When you're not using the bootstrap theme, the input should show up in red.

But bootstrap has its own style classes for indicating errors. In a bootstrap 3 form, an input is supposed to be wrapped in a <div class="form-group"> and when there is an error, the wrapper gets an additional has-error style class (Wt does this by looking up the parent of the input using javascript). My suspicion is that you are using bootstrap 3 and didn't wrap your input in such an element?
See here for bootstrap doc: https://getbootstrap.com/docs/3.3/css/#forms-control-validation

Regarding your debug output in WValidator::validate(), this function only gets called when you explicitly call it on the server (it's a sort fallback for the client-side validation).

    (1-2/2)