2.1.41. readonly 項目切替えイベントアクション¶

2.1.41.1. コードサンプル¶

以下のソースコード例では、ある入力項目のグループについて、 その readonly属性を、一括で切り替えるラジオボタンを実装する例である。

<n:form>
  <event:listen
    event="input[type='radio'].editProfile click">
    <event:toggle_readonly
      condition="[value='edit']"
      reverse="true"
      toggleTarget="div.profile :input:not('.editProfile')">
    </event:toggle_readonly>
  </event:listen>

  ... (中略) ...

</n:form>

2.1.41.2. 仕様¶

このアクションを実行するイベントは ページ内イベント定義 (もしくは サブウィンドウ内イベント定義 ) を用いて定義する必要がある。

このアクションが実行されると、まず、イベントの発生元要素が condition 属性の セレクタにマッチするかをチェックする。

マッチした場合、このタグと同じ <event:listen> タグ内に存在し、 target 属性のセレクタにマッチする全ての要素の readonly 属性を設定する。 設定する値は、イベントの発生元要素の選択状態に一致するが reverse 属性が true であった場合のその逆の値を設定する。

マッチしなかった場合、読取専用を解除する(reverse属性がtrueの場合、読取専用にする)。

属性値一覧 [◎ 必須属性 ○ 任意属性 × 無効(指定しても効果なし)]

2.1.41.3. 内部構造・改修時の留意点¶

本ウィジェットは以下のファイルによって実装されている。

部品一覧