radio html markup initialization

Webix JS
1

Pressing issue: how do I initialize a radio control with options and initial value in html markup?

Nice to have:

I would like to use a radio in the same way as a combo.

code snippet http://webix.com/snippet/8f2b2637

The combo initialization works fine

<div view="combo" id="cloneFromCombo" 
webix-data="cloneablePerfiles" label="{{translations.CloneFrom}}" 
value="{{cloneFromPerfilId}}"></div>

I would like to initialize the radio in the same way as the combo; however, introducing webix-data attribute prevents it from rendering (see intended radio control commented out.)

<div view="radio" id="cloneFromRadio" 
webix-data="cloneablePerfiles" label="{{translations.CloneFrom}}" 
value="{{cloneFromPerfilId}}">

can this be done?

2

Hello,

Unfortunately, there’s a limitation. Radio options cannot be set in such a way. But you can set them dynamically after form is initialized:

<div webix-ui webix-ready="setOptions(root)" view="form" id="htmlForm">
     <div view="radio" id="cloneFromRadio" options="-"></div>
</div>

$scope.setOptions = function(){
  $$("cloneFromRadio").define({options:$scope.cloneablePerfiles});
  $$("cloneFromRadio").refresh();
}

Please, check the snippet: http://webix.com/snippet/2319c9d0

We will consider improvements to this functionality.

3

Cheers for that, works a treat!

Please note in order for the rendering not to break down, options="-" above cannot be removed or even replaced by options="" (you are probably aware of this)

4

Yep, radio requires the initial set of options, so at least some meaningful value should be provided. The cleaner solution is to define an empty array: http://webix.com/snippet/abba1c48

5

appreciated