knockout-amd-helpers icon indicating copy to clipboard operation
knockout-amd-helpers copied to clipboard

Bubbling up an event from within a module for the parent to handle / take some action on.

Open vishnurk opened this issue 10 years ago • 2 comments

Hi Ryan,

Quick question.Here's my setup again-

//parent page Html
<div data-bind="module: moduleInfo"></div>

//parent view model
this.moduleInfo=ko.observable(
{ data: "",
  disposeMethod: "dispose",
  id: "moduleId",
  initializer: "initialize",
  name: "modulevm",
  template: "moduleTmpl"
}
);

//module's view model - modulevm
//function that handles a button click event
this.ButtonClick=new function(){
//Do some work.
//How do I let parent know of this event?
}

Is there a recommended way of doing this? Any thoughts / suggestions?

vishnurk avatar Mar 03 '14 14:03 vishnurk

Not sure this is the answer you are looking for:

JS

this.ButtonClick = function(data, event) {
  parent = ko.contextFor(event.target).$parent;
  // or get the root
  root = ko.contextFor(event.target).$root;
  alert(root.name);

HTML

<a href="#" data-bind="click: ButtonClick"> Click me</a>

thestephenmarshall avatar Mar 03 '14 22:03 thestephenmarshall

Thanks. I think this will work. I am using KO Lite async command to wire up events to the view model. I am trying to figure out how I can make the recommendation work with async commands.

vishnurk avatar Mar 07 '14 19:03 vishnurk