2016-11-25 1 views
1

DropdownList 위젯 항목에 아이콘을 추가하는 방법은 무엇입니까?Yii2. DropdownList 위젯 항목에 아이콘 추가

나는이 (주었-DEV는 semantic-ui에서이 권리를했다)

enter image description here

을 갖고 싶어하지만 위젯을 사용 후에는 아이콘을 추가하는 것은 매우 어렵다. 여기

내 코드 및 출력

<?php $items = [ 
      '123' => '<i class="af flag"></i>aaa', 
      '124' => 'bbb', 
      '345' => 'ccc', 
     ] 
     ?> 
     <?=$form->field($model, 'country', [ 
      'template' => '{label} <div class="field">{input}{error}{hint}</div>', 
     ])->dropDownList($items, ['class' => 'ui dropdown selection', 'prompt' => 'Select Country']);?> 

enter image description here

어떤 코드 나이 작업을 수행하는 데 도움이 될 수/라이브러리? ActiveField으로 사용할 수있는 구현이 필요합니다.

는 [UPD]

scaisEdge가 옵션이 enter image description here

답변

2

DROPDOWNLIST 기본적인 UI 제어 염기성 SELECT 드롭 다운의 일 구현 하였다 (HTML 콘텐츠를 포함하지 않음). Select2 구성 요소 (http://demos.krajee.com/widget-details/select2) 과 같은 고급 드롭 다운 선택기가 필요하며 widget() 메서드를 사용하여 해당 클래스를 사용하는 컨트롤의 구성을 호출합니다.

$form->field($model, 'country', [ 
      'template' => '{label} <div class="field">{input}{error}{hint}</div>', 
    ])->widget(Select2::classname(),[ 
    'data' => $data, 
    'options' => ['placeholder' => 'Select a state ...'], 
    'pluginOptions' => [ 
     'templateResult' => new JsExpression("function format(state) { return '<img src=flag.png >';}"), 
     'templateSelection' => new JsExpression("function format(state) { return '<img src=flag.png >';}"), 
     'escapeMarkup' => $escape, 
     'allowClear' => true 
    ], 
]); 

그냥 다른 사람들을 위해 http://demos.krajee.com/widget-details/select2#usage-advanced

+1

에 몇 가지 예를 참조하십시오. 좀 더 간단하게 HTML을 마크 업에 넣었지만 이런 식으로 행동하는 것을 권장하지 않습니다. 이고르 방식이 더 좋습니다. –

관련 문제