Access knockout binding from child element

Question

Lets say i have this:

<div data-bind="enable: false">
    <div data-bind="someCustomBinding: myValue"></div>
</div>

Is is possible for me to access the 'enable' binding of the parent container from within the custom binding?

== Clarification: ==

In a custom binding you can gain access to the current binding value with the valueAssessor. you can also gain access to other bindings through allBindings and even values on different related contexts via the bindingContext.

I was just wondering if you could access the binding of a parent html element from within a custom binding (in a similar way to the valueAccessor)

Something like this (sudo code):

ko.bindingHandlers.someCustomBinding=
{
    init: (element, valueAccessor, allBindings) =>
    {
        var parentIsEnabled = 
             ko.GetContextFor($(element).parent()).get('enable');
    }
}

are you trying to see if the parent element is enabled/disabled or do you need access to any binding value and enable just happens to be the example you are using here? — Chuck Schneider, Apr 17 '14 at 05:24
I am looking to get the value of the binding and enable is just used in this example. — 4imble, Apr 17 '14 at 07:47
I'm guessing you want the current knockout evaluated value of the binding and not the expression in the binding? — Chuck Schneider, Apr 17 '14 at 14:07
To clarify..if you had "enable: vmObservableProperty" Do you want to know that enable is bound to vmObservableProperty or that enable is currently true or false? — Chuck Schneider, Apr 17 '14 at 14:45
Added some more information, i suspect it's not possible (without a lot of dirty hacks) — 4imble, Apr 22 '14 at 14:23
So, why not get the the parent element ($(element).parent()) and simply use jQuery to see if it is enabled or any other attribute you want? — Chuck Schneider, Apr 22 '14 at 14:37

score 8 · Accepted Answer · edited May 23 '17 at 12:34

8

You could access the parent node and parse its data-bind attribute:

JSON.parse('{' + $(element).parent().data("bind") + '}')

Be careful to put double quote (") in your binding definition, as in the following jsFiddle

Sadly I can't find a more elegant way to do it.

KO lets you access the viewmodel of a dom element using dataFor/contextFor, but I don't see any method to get the binding definition of a dom element.

EDIT: After further investigation, you can access the parents binding with the following:

ko.bindingProvider.instance.getBindings($(element).parent().get(0), bindingContext)

It will return an object with the bindings. For example if you declare a data-bind="style: { backgroundColor: myBackgroundColor }" you will be able to access the observable through ko.bindingProvider.instance.getBindings($(element).parent().get(0), bindingContext).style.backgroundColor

The only problem is that you can not get the observable name within the viewmodel (or at least I don't know how, except if you compare each property with your viewmodel like idiom for comparing knockout observables)

edited May 23 '17 at 12:34

Community

1
1

answered Apr 17 '14 at 13:13

GôTô

7,974
3
32
43

That will tell you what expression each binding is bound to but not the run-time value of the evaluated expression. I'm not sure if that is what he wants or not. – Chuck Schneider Apr 17 '14 at 14:42
@ChuckSchneider I believe it's the point: the value is a constant, not an observable – GôTô Apr 17 '14 at 14:44
In response to my comment above, he said that it was just an example. So I'm not sure that is the case. – Chuck Schneider Apr 17 '14 at 14:48
Meant to add... you could also use $(element).parent().data("bind") instead to get the data-binding. – Chuck Schneider Apr 17 '14 at 14:58
@ChuckSchneider It does work, thanks for the tip, I didn't know. Updated answer – GôTô Apr 17 '14 at 15:13
Apologies for my example, it's hard putting something up there that people don't then provide workarounds for :). I'd want the value of the binding, which would mean that i could then swap it out for any other observable or constant and it would still work if that makes sense? – 4imble Apr 22 '14 at 14:06
+1 to be fair it does do what i asked, just not quite what i wanted. – 4imble Apr 22 '14 at 14:08

score 0 · Answer 2 · answered Apr 16 '14 at 15:20

0

Yes. The bindingContext parameter of the custom bindings init and update functions exposes access to $parent, $parents and $root.

answered Apr 16 '14 at 15:20

PatrickSteele

14,489
2
51
54

That seems to give me access to the associated viewmodels, not to the bindings value itself. I want to get the value assigned to 'enable' in this case "false". Am i misunderstanding how to use $parent? – 4imble Apr 16 '14 at 15:27
1

Oh, I see. Sorry -- I misunderstood. I don't know if something like that exists. Could you update the question with more of a concrete example of what you're trying to solve? There may be a "knockout way" of doing it. – PatrickSteele Apr 16 '14 at 16:35

Access knockout binding from child element

2 Answers2

Linked