Knockout Custom BInding

[Samps]

I'm trying to create a binding handler for the datepicker. When I create the picker the events do not fire and the calendar will not open. If I create the datepicker in the viewAttached function of the viewmodel the calendar opens and closes. I would like to handle this in a ko handler. Can you provide a ko binding handler for the datePicker?

ko.bindingHandlers.datePicker = {

    init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {

        $(element).ejDatePicker();     

    },

    update: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {

    }

};

[Saravanan G]

Hi Samps,

 

Thanks for using Syncfusion products.

 

We are sorry for inconvenience caused. We are unable to reproduce the issue, We have prepared a simple sample and the same can be downloaded from the following links.

KO binding.zip

Could you please try the above sample and get back to us whether you are able to reproduce the issue? If not, could you please give more information or by reproducing the issue in the above sample so that we could sort out the issue and provide you with solution. The information provided would be of great help in resolving the issue.

 

Please let us know if you have any concerns.

 

Regards,

Saravanan G

KO_binding_34432d04.zip

[Samps]

Thanks Saravanan. I should have mentioned that I am using Durandal.js. This library loads the view after the DOM has been rendered. If I use SetTimeout, the control will work. This appears to be a known issue with Durandal. I may be able to get this to work using jQuery deferred since setting a timeout is not a good solution.

ko.bindingHandlers.ejDatePicker = {

    init: function (element, valueAccessor, allBindingsAccessor, viewModel) {

        setTimeout(function () {

            var el = $(element);

            el.ejDatePicker();

            var modelValue = valueAccessor();

            var value = ko.utils.unwrapObservable(valueAccessor());            

            el.val(value);

            }, 1000);

    },

    update: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {

    }

};

Thanks,

Samps

[Saravanan G]

Hi Samps,

 

Thanks for your update.

 

We suspect that this issue is not from our side, we will call the KO model once the control is completely rendered, otherwise we can use the delay rendering logic using setTimeOut function as you mentioned in the update.

 

Please let me know if you have any other query.

 

Regards,

 

Saravanan G

[Hostilio]

Can Saravanan G [Syncfusion] please re upload the example, i am trying to download it but shows an error

[Harikrishnan P]

Hi Hostilio,

 

Thanks for using Syncfusion products.

 

We have reattached the sample (KO binding handler for DatePicker control) and the same can be downloaded from the below location,

 

Sample location: KObinding

 

Please let us know if you have further queries.

Regards,

HariKrishnan.