knockout.js and listen to check event on checkbox

Question

I'm trying to get a function to execute when a checkbox is checked or unchecked to verify all checkboxes are unchecked but it never gets executed. I assume I'm not doing it correctly.

@Html.CheckBox("Subscription", new{ data_bind="disable: Disabled, checked: Checked, click: $parent.allSubscriptionsUnchecked"} )

Definitely not enough info for anyone to give you a good answer without just straight up guessing. — Brian Zengel, May 24 '12 at 00:27
I don't know if that's a typo but it should be data-bind not with an underscore. — kenny, May 24 '12 at 01:59
@kenny: the underscore is required otherwise it's not valid Razor syntax. Underscores get rendered as hyphens... — janv8000, Jul 03 '14 at 14:57

score 156 · Accepted Answer · answered May 24 '12 at 01:13

156

You can add both a checked and click binding to an input. However, you would want to return true; from the click handler. This will allow the default action to proceed (the checkbox will be checked/unchecked).

Here is a sample: http://jsfiddle.net/rniemeyer/cnkVA/

An alternative technique is to push this logic into your view model and subscribe to changes to a boolean observable and execute your action like: http://jsfiddle.net/rniemeyer/cnkVA/2/

answered May 24 '12 at 01:13

RP Niemeyer

114,592
18
291
211

1

Thanks I also didnt do the context correct, it should of been $parents[1]. – Mike Flynn May 24 '12 at 16:55
18

Thanks for the "return true from click handler" tip! – Paul Suart Nov 27 '12 at 20:43
2

2nd way (subscribe to observable) worked better for me. Thanks. – bob Apr 12 '13 at 04:01
1

Just a quick note, have the checked bind before the click bind otherwise the click bind will fire before the checked and get the wrong value – Richard Housham May 08 '19 at 09:14

knockout.js and listen to check event on checkbox

1 Answers1

Linked