Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Comparing two fields with knockout-validation

I have a viewmodel for a form that I'm trying to add validation to using knockout-validation.

fromDate: ko.observable(
            moment().subtract('days', 1).startOf('day').format(dateFormat)
          ),
toDate: ko.observable(
            moment().startOf('day').format(dateFormat)
        ),

I need to make sure that the from date is less than the to date. I can't seem to get any form of custom validator to pick up the reference to the second observable. I need something along the lines of:

toDate: ko.observable(moment().startOf('day').format(dateFormat)).extend({
          validation: {
            validator: function (val, someOtherVal) {
                return moment(val) >= moment(someOtherVal);
            },
            message: 'Must be greater or equal to From Date',
            params: viewModel.fromDate()
          }
        }),

Any ideas?

Update

I'm sure I'd already tried this, but moving the extension method into the onload function works.

$(function () {
    ko.validation.configure({ decorateElement: true });

    viewModel.toDate.extend({
    validation: {
            validator: function (val, someOtherVal) {
                return moment(val) >= moment(viewModel.fromDate());
            },
            message: 'To date must be greater than from date',
        }
    });

    ko.applyBindings(viewModel);
});
like image 483
Matt Avatar asked Jan 29 '13 12:01

Matt


2 Answers

knockout-validation's core rules are not able to handle observables as parameters for validations. But there is already a push request which should fix that: https://github.com/ericmbarnard/Knockout-Validation/pull/217

Therefore you have to use a custom role for that. You should insert the param as a function (by omitting the parenthesis). That will enable knockout-validation to react to changes in the param.

function ViewModel() {
    var self = this; // capture this to be able to reference properties

    self.fromDate = ko.observable(
        moment().subtract('days', 1).startOf('day').format(dateFormat)
    );
    self.toDate = ko.observable(
        moment().startOf('day').format(dateFormat)
    ).extend({
      validation: {
        validator: function (val, someOtherVal) {
            return moment(val) >= moment(someOtherVal());
        },
        message: 'Must be greater or equal to From Date',
        params: self.fromDate
      }
    }),
}
like image 140
delixfe Avatar answered Nov 15 '22 08:11

delixfe


Looking at the documentation for it, this looks like the way that you could do it:

ko.validation.rules['greaterThan'] = {
    validator: function (val, otherVal) {
        return val > otherVal;
    },
    message: 'The field must be greater than {0}'
};

ko.validation.registerExtenders();

fromDate: ko.observable(
            moment().subtract('days', 1).startOf('day').format(dateFormat)
          ),
toDate: ko.observable(
            moment().startOf('day').format(dateFormat)
        ).extend({ greaterThan: fromDate() });

It's untested, and I don't know if you want to pass in fromDate(), or fromDate and then in the validator use otherVal().

like image 41
Paul Manzotti Avatar answered Nov 15 '22 08:11

Paul Manzotti