Knockout Binding

Question

I use mathias bynen placeholder code , and I wanted to use it with a knockout if I do a simple custom binding, for example:

ko.bindingHandlers.placeholder = { init: function (element) { $(element).placeholder(); } }; 

and html

 <input placeholder = "Line 1" data-bind="placeholder: {}, value: addressLine1"> 

This works, but I would like to “merge” them into one custom binding to use it as

 <input placeholder = "First Name" data-bind="placeholderValue: firstName"> 

So, I tried this code:

 ko.bindingHandlers.placeholderValue = { init: function (element, valueAccessor) { $(element).placeholder(); ko.bindingHandlers.value.init(element, valueAccessor); }, update: function (element, valueAccessor) { ko.bindingHandlers.value.update(element, valueAccessor); } }; 

but he calls me

 Uncaught TypeError: undefined is not a function 

Actually I don't get a ko grasp

Answer 1

When you create a custom binding delegation as a best practice, you should always pass all the init and update arguments to the internal links, because you can never know what parameters the internal binding uses:

 ko.bindingHandlers.placeholderValue = { init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) { $(element).placeholder(); ko.bindingHandlers.value.init(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext); }, update: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) { ko.bindingHandlers.value.update(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext); } }; 

You have an exception because init uses the allBindingsAccessor parameter for the value allBindingsAccessor , but since you did not pass this, an exception is thrown.