SelectButton

/scss/controls/selectbutton.scss

v.0.1.0 javascript

생성 옵션

  <div class="new-selectButtons"></div>
  <div class="new-selectButtons-v"></div>

  Gn.create('selectbutton', {
    target: '.new-selectButtons', 
    size: 'normal',
    value: 'menu2',
    onChange: function(option){
      console.log('선택된 옵션은 ' + option );
    },
    data: [{
      text: 'menu1',
      value: 'menu1'
    },{
      text: 'menu2',
      value: 'menu2'
    },{
      text: 'menu3',
      value: 'menu3'
    },{
      text: 'menu4',
      value: 'menu4'
    }]
  });
  Gn.create('selectbutton', {
    target: '.new-selectButtons-v', 
    size: 'normal',
    value: 'menu1,menu2',
    multiple: true,
    align: 'vertical',
    onChange: function(option){
      console.log('선택된 옵션은 ' + option );
    },
    data: [{
      text: 'menu1',
      value: 'menu1'
    },{
      text: 'menu2',
      value: 'menu2'
    },{
      text: 'menu3',
      value: 'menu3'
    },{
      text: 'menu4',
      value: 'menu4'
    }]
  });

name	type	default	description
target	string		컴포넌트 생성대상 선택자(selector)
size	string		'small','normal','medium','large'
align	string	horizontal	'horizontal', 'vertical'
data	Array[{text, value, icon}]		옵션 목록
disabled	boolean	false	버튼 비활성화 여부
multiple	boolean	false	다중선택 가능 여부
onChange	function(value, text)		옵션 변경 시 수행될 이벤트

메소드

name	return	description
change(value)	void	버튼 선택값을 변경한다.
getValue()	string	선택된 값을 반환한다.
disable()	void	Disabled 처리한다.
enable()	void	Enabled 처리한다.