How to add multiple messages for validation based on the condition knockout js?

Question

I have two error messages but only one is shown based on vendor value. The initial value for vendor as application starts is null. After that, based on the user input the vendor value is changed. However, the validation error message says "Input is required" regardless of vendor value - even the condition is met. It seems to me that the value for self.agreement is not updated.

I have looked at here and here , and applied the techniques but none of them worked for me.

index.js

 self.agreement = (vendor == "BAS")? ko.observable().extend({
      required:{message:"Should be 9 digit "},
      pattern:{
        params:/^\d{9}$/
      }
    }):ko.observable().extend({ required:{message:"Input is required", onlyIf:function(){return !self.sample()}} });

index.cshtml

<input data-bind="init, value: agreement" class="form-control" type="text" value="@(Model.Ani)" />

score 0 · Answer 1 · answered Feb 02 '22 at 23:30

I think you're re-scoping the observable.

ko.observable().extend({}):ko.observable().extend({})

Try it like this instead

ko.observable().extend({}).extend({}).extend({})......

Here's a sample.

Price: local.Price.extend({ required: true }).extend({ number: true }).extend({ pattern: '(\$\s*)?(([1-9]\d*)(\.\d+)?|0?\.\d*[1-9]\d*)' })

How to add multiple messages for validation based on the condition knockout js?

1 Answers1