ons-radio

実例

Radio buttons

Radio buttons are defined using the <ons-radio> element.

<ons-radio checked></ons-radio>

To create a group of radio buttons the name attribute is used:

<ons-radio name="group" value="first"></ons-radio>
<ons-radio name="group" value="second"></ons-radio>

This will enable switching between radio buttons.

Inner input element

For normal input elements is possible to define a <label> tab with the for attribute to link it to an input element.

Unfortunately this does not work with custom elements like <ons-label> so in order to do it we need to set the id attribute of the inner input element. This is done using the input-id attribute.

<label for="username">Username</label>
<ons-input input-id="username"></ons-input>

This work with any input in Onsen UI such as checkboxes, radios, etc.

関連情報

名前 型 / デフォルト値 概要
input-id String Specify the “id” attribute of the inner <input> element. This is useful when using <label for="..."> elements. (翻訳中) Optional.
名前 概要
value The current value of the radio button. (翻訳中)
checked Whether the radio button is checked or not. (翻訳中)
disabled 無効化されている場合にtrue
Name 概要
material Displays a Material Design radio button. (翻訳中)
シグネチャ 概要
focus() Focuses the radio button. (翻訳中)
blur() Removes focus from the radio button. (翻訳中)
focus()

Focuses the radio button. (翻訳中)

blur()

Removes focus from the radio button. (翻訳中)

お困りですか?

Onsen UIに関する質問は、Stack Overflowにてonsen-uiタグを付与してください。Onsen UIチームはあなたの問題解決をお手伝いします。

バグ報告や機能要望については、GitHub Issuesに記載をお願いいたします。

あわせて、下記の情報も参考にしてください。