Question

假设我有一组单选按钮：

<span data-dojo-type="Scripts/Framework/UI/Form/RadioButton" data-dojo-props="value:1,name:'Foo'"></span>
<span data-dojo-type="Scripts/Framework/UI/Form/RadioButton" data-dojo-props="value:2,name:'Foo'"></span>
<span data-dojo-type="Scripts/Framework/UI/Form/RadioButton" data-dojo-props="value:3,name:'Foo'"></span>

如何将其绑定到模型属性Foo，以便将其值设置为所选单选按钮的值？我尝试将它绑定到checked属性然后应用转换，但是在取消选中按钮时会遇到覆盖模型值的问题。

<span data-dojo-type="Scripts/Framework/UI/Form/RadioButton"
data-dojo-props="value:3,checked:at('rel:', 'Foo').transform({format:function(x) { return x == this.value; }, parse:function(x) { return x ? this.value : /* ok, now what??? */ }})"
></span>

感觉这应该比这更简单......

Answer 1

dojox/form/CheckMultiSelect小部件可轻松为get和set所选单选按钮提供功能。

如果您将tutorial中的示例代码用于单选按钮，然后尝试设置并从组中获取value，您很快就会看到可以开始绑定a的值模范国家。

我必须阅读有关窗口小部件的API文档以扩展教程。要获取和设置组中所选广播的值，我使用standard get("attr")/set("attr", value)和CheckMultiSelect小部件...

// NOTE: make sure you have imported the dijit/registry module
// If my multi select widget has the id "multi".

// get selected value
var selectedValue = registry.byId("multi").get("value");

// set selected value
registry.byId("multi").set("value", newValue);

// getting a handle on all radio buttons
var options = registry.byId("multi").get("options");

CheckedMultiSelect窗口小部件还扩展了_FormSelectWidget，因此您可以按照基于选择的窗口小部件的需要对商店执行所有操作，这可以帮助您绑定模型。

Answer 2

您可以使用"watch"来观看窗口小部件的值以进行更改。第一个参数是要监视的值，第二个参数是在该值更改时调用的函数。

radioButton.watch("checked", updateFoo);

这是在原生dijit单选按钮上显示它的小提琴。

http://jsfiddle.net/a2SEP/2/

Answer 3

您可以像这样使用query('selector').on('event', callback)

query('.claro [type="radio"]').on('change', function(event) {
    textBox.set('value', event.target.id);
});

有关完整示例，请参阅http://jsfiddle.net/542uw/。

NB：基本上您将用户name属性分组到单选按钮。

将属性绑定到无线电组值

3 个答案: