Attach a custom binding?

Showing 1-10 of 10 messages
Attach a custom binding? brian....@frontflip.com 2/20/12 7:03 AM
I would like to attach a custom binding on document ready instead of specifying it on the data-bind attribute.

So instead of this: <input type="text" data-bind="text: firstName, uniform: true" class="uniform"/>

do this: 
<input type="text" data-bind="text: firstName" class="uniform"/> 

and then $(".uniform").bindings.add({uniform:true});

Is this possible?

Thanks

Brian
Re: Attach a custom binding? Emanuele Ziglioli 2/20/12 12:10 PM
Hi,

I've got a similar problem and was looking for a solution somewhere.
I want to dynamically attach a custom binding to a jQuery slider
handler:

var handle = slider.slider().find(".ui-slider-handle").last();

So I'm curious to try with the example you showed
$(handle).bindings.add(...);
Re: Attach a custom binding? Emanuele Ziglioli 2/20/12 12:29 PM
mmm, I think I can call ko.applyBindings() on the handle element when
it's available, but how can I apply the data-bind property at runtime?

http://stackoverflow.com/questions/7342814/knockoutjs-ko-applybindings-to-partial-view


On Feb 21, 9:10 am, Emanuele Ziglioli <theb...@emanueleziglioli.it>
wrote:
Re: Attach a custom binding? Emanuele Ziglioli 2/20/12 12:51 PM
Not that easy using knockout!

http://flowplayer.org/tools/forum/30/37281#post-74746

surely other people have the same problem, binding to dynamic elements

See also:

http://www.knockmeout.net/2011/04/event-delegation-in-knockoutjs.html

On Feb 21, 9:29 am, Emanuele Ziglioli <theb...@emanueleziglioli.it>
wrote:
> mmm, I think I can call ko.applyBindings() on the handle element when
> it's available, but how can I apply the data-bind property at runtime?
>
> http://stackoverflow.com/questions/7342814/knockoutjs-ko-applybinding...
Re: Attach a custom binding? Emanuele Ziglioli 2/20/12 1:56 PM
Success!!!

I've managed to dynamically bind a custom binding to an element.
First I have an observable:

value: ko.observable()

Then I create a custom binding called 'tooltip':

        ko.bindingHandlers.tooltip = {
            init: function(element, valueAccessor,
allBindingsAccessor, viewModel) {
              console.log("init " + element );
            },

            update: function(element, valueAccessor, viewModel) {
              var handle = $(element);
              var value = ko.utils.unwrapObservable(valueAccessor());
              console.log("update " + value );
            }
        };

Then I attach that binding to a slider handle:

                var handle = slider.slider().find(".ui-slider-
handle").first();

                $(handle).attr("data-bind", "tooltip: value");  //
dynamically add the data-bind attr to that handle, binding to the
'value' model
                ko.applyBindings( Sirtrack.Filters.lowerlimit, $
(firsthandle)[0] ); // tell ko to bind the two

It looks very nice and elegant to me (I'm loving ko!). It seems to
work, but I need to do some more testing.

Cheers,
Emanuele @ZiglioNZ

On Feb 21, 9:51 am, Emanuele Ziglioli <theb...@emanueleziglioli.it>
wrote:
Re: Attach a custom binding? Emanuele Ziglioli 2/20/12 5:31 PM
Example: http://jsfiddle.net/tzD4T/48/


On Feb 21, 10:56 am, Emanuele Ziglioli <theb...@emanueleziglioli.it>
wrote:
> Success!!!
Re: Attach a custom binding? Michael Best 2/20/12 5:58 PM
You'd use ko.applyBindingsToNode, which is exported, but isn't
mentioned in the documentation. It takes three parameters: node,
bindings, viewModel. Here's how you'd use it with your example:

$(".uniform").each(function(index, element) {
    ko.applyBindingsToNode(element, {uniform:true}, null);
});

-- Michael
Re: Attach a custom binding? brian....@frontflip.com 2/21/12 5:56 AM
Michael, thanks, that is exactly what I was looking for.

Emanuele, thanks, I can use that what you figured out in a different area. 
Re: Attach a custom binding? Leandro de los Santos 2/21/12 6:49 AM
Hi, why do you want to do this? In general, i just do a custom binding
with a "init" function for all the DOM initialization. Also using
"with", "if", "foreach", etc. i create all the doms items withouth
need a "dinamyc dom binding" (for my point of view, it's just the
opposit, i create dom from bindings, not bindings from dom).

I'm curious about why you want to add bindings to dom items on the
fly.

Sorry for my english,
Leandro
> > Brian- Hide quoted text -
>
> - Show quoted text -
Re: Attach a custom binding? Craig Beck 2/21/12 8:44 AM
I believe that this is what binding providers are for. (though i haven't used them)

take a look at:
http://www.knockmeout.net/2011/09/ko-13-preview-part-2-custom-binding.html

and for an example of the "unobtrusive javascript" style you're talking about:
http://joel.net/unobtrusive-data-binding-for-knockout-js