RadioGroup 클래스의 주요 기능은 다음과 같습니다.
1. 다수의 radio 엘리먼트를 한 번에 설정할 수 있습니다.
- options에 작성한 순서로 radio 엘리먼트가 생성/표시됩니다.
- name은 지정하지 않으며 MethodChain에서 자동 부여합니다.
2. 다수의 Radio를 나타내는 Label을 설정할 수 있습니다.
3. linefeed ccode를 사용하여 한 라인에 표시되는 radio 수를 조정할 수 있습니다.
4. radio 엘리먼트 width를 지정할 수 있으며 자동으로 설정할 수도 있습니다.
example
new mc.types.RadioGroup({
eachWidth: [60, 70, 60],
width: 450,
component: [
{ccode: 'label', text: '가장 좋아하는 스포츠', width: 150},
{ccode: 'radio', text: '축구'},
{ccode: 'radio', text: '농구'},
{linefeed: true},
{ccode: 'radio', text: '수영'},
{text: '마라톤'},
{text: '탁구'}
]
})
| Options | Component |
|---|---|
| ccode {String} | types.RadioGroup |
|
component code : 'radiogroup'
|
|
| defaultCcode {String} | types.RadioGroup |
|
default component code : 'radio'
|
|
| eachWidth {Array} | types.GroupModel |
|
라인의 각 radio/checkbox 엘리먼트에 적용할 width
아래의 공식으로 산출한 값의 범위내에서 지정할 수 있습니다.
공식: options.width - ccode[label].width - ccode[label].paddingLeft
값을 지정하지 않으면 공식에서 산출한 값을 options.maxNumber 값으로 균등 분할합니다.
반올림에 의한 차이는 라인의 마지막 엘리먼트에 반영합니다.
|
|
| insideClass {String} | types.GroupModel |
|
inside 엘리먼트에 적용할 className.
|
|
| insideStyle {Hash} | types.GroupModel |
|
inside 엘리먼트에 적용할 style
|
|
| labelClass {String} | types.GroupModel |
|
label 엘리먼트에 적용할 className. default: 'mc-boxgroup-label'
|
|
| labelStyle {Hash} | types.GroupModel |
|
label 엘리먼트에 적용할 style.
|
|
| linesideClass {String} | types.GroupModel |
|
라인 단위의 wrapper 엘리먼트에 적용할 className
|
|
| linesideStyle {Hash} | types.GroupModel |
|
라인 단위의 wrapper 엘리먼트에 적용할 style
|
|
| middleClass {String} | types.GroupModel |
|
라인 단위의 middle 엘리먼트에 적용할 className.
|
|
| middleStyle {Hash} | types.GroupModel |
|
라인 단위의 middle 엘리먼트에 적용할 style
|
|
| outsideClass {String} | types.GroupModel |
|
outside에 적용할 className.
|
|
| outsideStyle {Hash} | types.GroupModel |
|
outside에 적용할 style
|
|
| prefix {String} | types.RadioGroup |
|
id 접두사. default: 'mc_radiogroup_'
|
|
| Method | Component |
|---|---|
mc.types.RadioGroup
(Hash)
|
types.RadioGroup |
|
생성자
|
|
mainRadioGroup
(HTMLElement/String)
|
types.RadioGroup |
|
option 설정, HTMLElement생성, Event를 설정합니다.
|
|
clickEvent
(EventObjct, HTMLElement)
|
types.GroupModel |
|
outside에서 click 이벤트가 발생했을 때 실행되며 오버라이드용 메소드입니다.
|
|
getOutside
() : HTMLElement
|
types.GroupModel |
|
outside 엘리먼트를 반환합니다.
|
|
mainGroupModel
(HTMLElement/String)
|
types.GroupModel |
|
option 설정, HTMLElement생성, Event를 설정합니다.
|
|
removeEvents
()
|
types.RadioGroup |
|
outside에 설정한 click 이벤트를 해제합니다.
|
|
setEvents
()
|
types.RadioGroup |
|
outside에 click와 keyup 이벤트를 설정합니다.
|
|
| Custom Event | Component |
|---|---|
| click (EventObject e, HTMLElement tg, Object this) | types.RadioGroup |
|
Radio를 click했을 때 fire됩니다.
|
|
| keyup (EventObject e, HTMLElement tg, Object this) | types.RadioGroup |
|
Radio를 keyup했을 때 fire됩니다.
|
|
| ready (Object this) | types.GroupModel |
|
라디오그룹/체크박스그룹에 속한 컴포넌트를 전부 생성한 후에 fire 됩니다.
|
|
| Examples | |
|---|---|
| RadioGroup | |
|
component에 지정한 radio를 생성하고 이를 통합하여 제어합니다.
|
|