Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I've searched this before as I started using breeze with knockout and then I had the exact same question about how to validate stuff, and how to show validation inline. </p> <p>Considering that breeze already has validation built in, I decided to write a custom Knockout Binding to show the validation result every time the observable value changes and it was quite easy afterall:</p> <p>Here's the custom binding:</p> <pre><code> ko.bindingHandlers.breezeValidate = { init: function (element, valueAccessor, allBindingsAccessor, context) { var isOk = context.entityAspect.validateProperty(valueAccessor()); var errors = context.entityAspect.getValidationErrors(valueAccessor()); var message = ""; if (errors.length &gt; 0) message = errors[0].errorMessage; $(element).html(message); }, //update the control when the view model changes update: function (element, valueAccessor, allBindingsAccessor, context) { debugger; this.init(element, valueAccessor, allBindingsAccessor, context) } }; </code></pre> <p>And the usage is like this:</p> <pre><code>&lt;span data-bind="text: Name"&gt;&lt;/span&gt; &lt;span data-bind="breezeValidate: 'Name'"&gt;&lt;/span&gt; </code></pre> <p>This works because of this line:</p> <pre><code>var isOk = context.entityAspect.validateProperty(valueAccessor()); </code></pre> <p>When breeze is requested to validate the property it ends up calling the observable and it gets registered by knockout, so every time it is changed, this binding will be invoked again and the error message will be updated accordingly.</p> <p>I'm just showing the first validation message, but of course you can iterate thru all of them and even add a different styling to the element.</p> <p>Hope this helps!! </p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload