I'm using bind to call the function with parameters from my view:

<span data-bind="click: modifyByOne.bind($data, 'plus')"></span>

As per this answer I'm getting the event object by doing this:

self.modifyByOne = function(type){
    var span = $(event.currentTarget);
};

In Chrome everything works ok, but in Firefox I get the following console error:

event is not defined

How can I get it working in Firefox too? Knockout documentation doesn't provide much answers to this.

I'm using bind to call the function with parameters from my view:

<span data-bind="click: modifyByOne.bind($data, 'plus')"></span>

As per this answer I'm getting the event object by doing this:

self.modifyByOne = function(type){
    var span = $(event.currentTarget);
};

In Chrome everything works ok, but in Firefox I get the following console error:

event is not defined

How can I get it working in Firefox too? Knockout documentation doesn't provide much answers to this.

• javascript
• knockout.js
• knockout-3.2

• The code in you question uses a variable (?) named event but it's unclear where it es from. – Jeroen Commented Mar 10, 2016 at 16:23

2 Answers 2

The knockout click binding passes two arguments to the listener method: the current binding context ($data), and the event.

By using bind you can, like you did, specify additional arguments to pass to the method. These arguments are passed before the two default arguments. Your method should therefore accept a type, data and event argument.

self.modifyByOne = function(type, data, event){
  var span = $(event.target);
};

While this should work, it's considered bad practice to do stuff with the DOM from your code. Try creating a custom binding instead.

You don't declare the event parameter in your function signature. But besides that, if you need to access the actual DOM element in Knockout, you should be using a custom binding handler; you shouldn't be accessing the DOM from inside of your view model.