单选按钮选中了绑定html5，durandal [英] radio button checked binding html5, durandal

问题描述

即使我在该网站上看到了很多类似的问题，也没有一个人对我的问题 answer . 如此恳请，不要生我的气，我会再次讨论这个话题. 我在durandal项目中工作，我的html页面后面带有javascript文件. 我在其中一页中有两个单选按钮. 我希望它们的"checked"属性绑定到后面的视图模型中的变量. 看起来很简单...但事实并非如此！ 我尝试了两种方法，其中任何一种都不成功:

even that I see very many similar questions in this site, no one of them answer to my question. So pleas, don't be angry with me that I discuss this subject again. I work in durandal project, I have html pages with javascript files behind. I have two radio button in one of the pages. I want their "checked" attribute to be binding to a variable in the view-model behind. It is looked simple... but it is not! I try two ways, any one of them didn't succeed:

入门方式:

                             <input type="radio"
                                    name="radSearchBy"
                                    id="byNo"
                                    data-bind:"checked:isId" />

          in javascript:
                         isId: ko.observable(true)      

在HTML中

第二种方式:

          in javascript:
                         isId: ko.observable("checked")        

我知道是什么问题. 即使我只是写

I know what is the problem. even if I simply write

                           <input type="radio"
                                    name="radSearchBy"
                                    id="byNo"
                                    data-bind:"checked:true" />  

或:

                     <input type="radio"
                                    name="radSearchBy"
                                    id="byNo"
                                    checked="checked" />     

它不起作用. 我写的只是一时兴起:

it doesn't work. only whem I write:

                     <input type="radio"
                                    name="radSearchBy"
                                    id="byNo"
                                    **checked** />    

是的，没有任何后跟的已检查"字词-效果很好.

但这是问题，因为我该怎么做* 绑定? *

请尽快帮助我.

推荐答案

不幸的是，答案有点复杂.单选按钮使可观察值与单选按钮的value属性匹配.在布尔型情况下，不可能仅仅因为HTML将以字符串而不是布尔值返回"true"或"false"的方式来处理.

Unfortunately, the answer is a bit complicated. Radio buttons match the value of your observable to the value attribute of the radio button. In the boolean case, it is impossible to handle simply because HTML will return 'true' or 'false' as strings, not as booleans.

解决方案需要 AFAIK计算的可观察物:

The solution requires AFAIK computed observables:

<input type="radio"
    name="radSearchBy"
    value="true"
    data-bind="checked: value" />True
<input type="radio"
    name="radSearchBy"
    value="false"
    data-bind="checked: value" />False

JavaScript

radSearchBy = ko.observable(true);
value = ko.computed({
    read: function() { return radSearchBy.toString(); },
    write: function(val) { radSearchBy(val === 'true'); }
});

这篇关于单选按钮选中了绑定html5，durandal的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！