Validate field in observablearray not working (using knockout validation plugin)

Question

I am using the knockout validation plug in and am trying to compare a date field in the observablearray to a static date. I know the code is not complete, but here is what i have-

EDIT: VIEW CODE-

                                         <tbody data-bind="foreach: allCertificates">
                                        <tr id="AllCertRow" style="cursor: pointer" data-bind="click: $parent.selectThing, css: { highlight: $parent.isSelected() == $data.lwCertID }">
                                            <td>
                                                <ul >

                                                   <li><H5><b><span data-bind="    text: clientName"></span>&nbsp;(<span data-bind="    text: clientNumber"></span>)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span data-bind="    text: borrowBaseCount"></span>&nbsp;Loan(s)&nbsp;</b></H5></li>
                                                    Collateral Analyst:&nbsp;<span data-bind="    text: userName"></span>
                                                    <br />
                                                Certificate:&nbsp;<span data-bind="text: lwCertID"></span>&nbsp;&nbsp;Request&nbsp;Date:&nbsp;<span data-bind="    text: moment(requestDate).format('DD/MMM/YYYY')"></span>
                                                    </ul>
                                            </td>
                                        </tr>
                                    </tbody>

My viewmodel code-

         var LucasSystemDate = ko.observableArray('4/22/2013');
     var allCertificates = ko.observableArray([]);

        ko.validation.configure({
        registerExtenders: true,
        messagesOnModified: true,
        insertMessages: true,
        parseInputAttributes: true,
        messageTemplate: null,
        grouping: {
            deep: true
        }
    });

        ko.validation.rules['Expired'] = {
        validator: function (val, otherVal) {
            return val < otherVal;
        },
        message: 'Request has expired. Please reject and initiate client contact.'
    };

    var activate = function () {
        // go get local data, if we have it
        return true;
    };


    var vm = {
        activate: activate,
        LucasSystemDate: LucasSystemDate,
    allCertificates: allCertificates[
        { lwCertID: '2', clientID: '1EX', requestDate: '7/3/2013 12:34:00 PM', userName: 'Peter Rabbit', statusDescription:     'Submitted', statusCode: '1', statusDesc: 'Submitted', clientName: 'Test Company 1                     ', clientNumber: '1EX',  borrowBaseCount: '1', advRequestCount: '1', ceoUserName: 'Woodall, Chris' },
{ lwCertID: '5', clientID: '1EX  ', requestDate: '7/3/2013 1:00:00 PM', userName: 'Bugs Bunny', statusDescription: 'Submitted',     statusCode: '1', statusDesc: 'Submitted', clientName: 'Test Company 2                     ', clientNumber: '1EX',   borrowBaseCount: '1', advRequestCount: '1', ceoUserName: 'Woodall, Chris' },
{ lwCertID: '6', clientID: '1EX  ', requestDate: '7/8/2013 6:31:00 AM', userName: 'Jack Frost', statusDescription: 'Submitted',     statusCode: '1', statusDesc: 'Submitted', clientName: 'Test Company 3                     ', clientNumber: '1EX',   borrowBaseCount: '1', advRequestCount: '1', ceoUserName: 'Woodall, Chris' }
    ]
}

//NOT SURE HOW TO COMPARE requestDate IN THE allCertificates OBSERVEABLEARRAY TO 
//THE LucasSystemDate.  IF LucasSystemDate < allCertificates.requestDate
//THEN FAIL VALIDATION AND DISPLAY ERROR MESSAGE.  THIS CHECK SHOULD 
//BE PERFORMED EACH TIME THE DATA IS INITIALLY LOADED.

Under the commented out code at the bottom of the code above, what code would I put here to use the Expired validation rule to compare the requestDate in the allCertificates observablearray to the LucasSystemDate?

Answer 1

The first problem is that our date is not an array, it is simply a date value, so fix that and you should be able to compare it to anything you want -

var LucasSystemDate = ko.observableArray('4/22/2013');

should be

var LucasSystemDate = ko.observable('4/22/2013');

This should be an example of how to create a rule and then apply it to something, but I can't be 100% sure this will compile and run like you want. You may need to tweak it.

// Create a new rule called expired
ko.validation.rules['expired'] = {
    validator: function (val, otherVal) {
        // val appears to be the value of the observable, otherVal appears to be the value you set the rule equal to
        return val < otherVal;
    },
    message: 'Request has expired. Please reject and initiate client contact.'
};
// It looks like you need to register these extensions
ko.validation.registerExtenders();

// No sense in making the date either observable nor an observable array, as you won't be using it in the DOM
var LucasSystemDate = new Date('4/22/2013');

var allCertificates = ko.observableArray();

// This doesn't need to be observable but to save time I made it an observable array so I could use the arrayForEach util
var certsArray = ko.observableArray([
{ lwCertID: '2', clientID: '1EX', requestDate: '7/3/2013 12:34:00 PM', userName: 'Peter Rabbit', statusDescription:     'Submitted', statusCode: '1', statusDesc: 'Submitted', clientName: 'Test Company 1                     ', clientNumber: '1EX',  borrowBaseCount: '1', advRequestCount: '1', ceoUserName: 'Woodall, Chris' },
{ lwCertID: '5', clientID: '1EX  ', requestDate: '7/3/2013 1:00:00 PM', userName: 'Bugs Bunny', statusDescription: 'Submitted',     statusCode: '1', statusDesc: 'Submitted', clientName: 'Test Company 2                     ', clientNumber: '1EX',   borrowBaseCount: '1', advRequestCount: '1', ceoUserName: 'Woodall, Chris' },
{ lwCertID: '6', clientID: '1EX  ', requestDate: '7/8/2013 6:31:00 AM', userName: 'Jack Frost', statusDescription: 'Submitted',     statusCode: '1', statusDesc: 'Submitted', clientName: 'Test Company 3                     ', clientNumber: '1EX',   borrowBaseCount: '1', advRequestCount: '1', ceoUserName: 'Woodall, Chris' }]);

// Iterate through the array, extend with the validator, and push the cert into the all certs observable array
ko.utils.arrayForEach(certsArray(), function (cert) {
    cert.extend({ expired: LucasSystemDate });
    allCertificates.push(cert);
});

// Expose the functions / observables to the DOM
var vm = {
    activate: activate,
    LucasSystemDate: LucasSystemDate,
    allCertificates: allCertificates
};

// Apply your bindings, you may not need to do this if you are using a framework which binds for you
ko.applyBindings(new vm());