Knock foreach binding click event during iteration

Question

I use the foreach knockout to draw the table using the click buttons. The first column and table headers are used for abundance values ​​inside the table.

<tbody> <!--ko foreach: $root.schedules --> <tr> <td data-bind="text: FromTo "></td> <!-- ko foreach: $root.weekdays --> <td data-bind="css:{selected:$root.objectForEdit().isSelected(id, $parent.Id) }, click: $root.changeEditObj(id, $parent.Id), with: $root.getDetailsModel(id, $parent.Id)"> <span data-bind="text: lesson"></span> </td> <!-- /ko --> </tr> <!--/ko--> </tbody> 

As you can see from the code snippet, I am using css binding, as well as attaching a modal popup dialog to the mouse click event.

The table is drawn, as expected, everything works fine, but the first time the form loads, my modal form appears even if there is no click on the cell. I tried to understand why this happened, and found that inside the iteration, the knockout is not only a binding of the click event, but also a call to the click event handler function (which shows the pop-up window).

I assume the problem is with knockout binding. Are there any solutions for this problem? How can I avoid calling a function inside a foreach iteration?

Answer 1

Thanks Chaim . I accidentally deleted his answer.

I changed

 click: $root.changeEditObj(id, $parent.Id) 

to

 click: $root.changeEditObj.bind(this, id, $parent.Id) 

and he solved the problem.

This also works great:

 click: function{$root.changeEditObj(id, $parent.Id)} 

More information on this can be found here.