The checked binding not working in case of radio buttons

[sudhanshu singh]

Hi,

I need to write a code in which on click of one button radio button, a div section becomes visible and on click of another radio button it dis-appears.

I have written following code:

View Code:

<label><input type="radio" name="welcome" data-bind="checked: displayMessage" /> Display message</label>

 <label><input type="radio" name="welcome" /> DontDisplay message</label>

<div data-bind="if: displayMessage">Here is a message. Astonishing.</div>

Source code: View model

ko.applyBindings({

    displayMessage: ko.observable(false)

});

It is working once i.e. on first click message appears but after that it becomes permanent and do dis-appears on click of next radio button.

Please help me out,its urgent.

Thanks,

Sudhanshu Singh

[parwej ahamad]

Please can you put in jsfiddle to look into this issue.

On Mon, Jun 24, 2013 at 7:12 PM, <jorv...@gmail.com> wrote:

I believe the "if" should be "visible" in order for this to work properly

 

<label><input type="radio" name="welcome" data-bind="checked: displayMessage" /> Display message</label>

 <label><input type="radio" name="welcome" /> DontDisplay message</label>

<div data-bind="visible: displayMessage">Here is a message. Astonishing.</div>

--
You received this message because you are subscribed to the Google Groups "KnockoutJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to knockoutjs+...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[Val]

<label><input type="radio" name="welcome" value="true" data-bind="checked: displayMessage" /> Display message</label>
 <label><input type="radio" value="false" name="welcome" data-bind="checked: displayMessage" /> DontDisplay message</label>
<div data-bind="if: displayMessage=='true'">Here is a message. Astonishing.</div>

try this

[Anil Singh]

visit for details.

http://aspdotnetblogspot.blogspot.in/2013/07/knockout-js-filter-array-list-or.html

Thanks,

--------------------------------------------------------------------------------------------------------------------

[Michael Best]

If you're using Knockout 3.0 beta, you can use the new checkedValue binding:

<label><input type="radio" data-bind="checked: displayMessage, checkedValue: true" /> Display message</label>
<label><input type="radio" data-bind="checked: displayMessage, checkedValue: false" /> DontDisplay message</label>

<div data-bind="if: displayMessage">Here is a message. Astonishing.</div>

-- Michael

[art0r...@gmail.com]

You forgot to bind the second radiobutton. Here I have added it to both and it works. http://jsfiddle.net/k63tK/2/