jjczopek
jjczopek

Reputation: 3379

Knockout.js - binding called multiple times

In my app I have an add dialog (jquery ui). Code creates new viewmodel instance and binds it this dialog and dialog is displayed.

ViewModel has also save method which is bound to button in the dialog (not standard jquery dialog button, but custom) using click: binding. This save method in ViewMode performs post to server and server persists data.

When user opens add dialog, enters data and click save button, data is sent to server, dialog is closed and ko.cleanNode() on dialog node.

When user opens add dialog again, enters new data and clicks save, save binding in ViewModel is called twice, and POST to server is sent twice. When he opens dialog for third time, there are 3 posts.

I tried to make a global var for viewmodel instance and set it to null when dialog is closed, but that did not help - save is called twice and more still.

Did you ever encounter something similar?

Upvotes: 0

Views: 1721

Answers (1)

Alexandros B
Alexandros B

Reputation: 1891

I suspect you bind the click event every time you open your dialog

As @rp-niemeyer mentiones in this question

ko.cleanNode is used internally by Knockout to clean up data/computeds that it created related to the element. It does not remove any event handlers added by bindings

His recomendation

So, I would not recommend using this pattern. A better pattern is to use with or the template binding around a section and allow it to be re-rendered with the new bindings.

Upvotes: 2

Related Questions