选择多个元素semantic-ui下拉列表

时间:2016-06-15 15:19:53

标签: semantic-ui

以编程方式选择一个或多个,我可以为选择字段执行此操作,但如果我使用<div class="ui fluid multiple search selection dropdown">然后我无法设置它们,这很重要,因为我想格式化项目。

根据您可以设置的文档(selected([value1, value2])添加一组选定的值)

http://semantic-ui.com/modules/dropdown.html#multiple-search-selection

1 个答案:

答案 0 :(得分:0)

如果你的模板是

<div class="ui fluid search selection dropdown multiple countries">
    <input type="hidden" name="country">
    <i class="dropdown icon"></i>
    <div class="default text">Select Country</div>
    <div class="menu">
      <div class="item" each={ c, co in countries } data-value={c.abbr}>
        <i class={c.abbr + ' flag'}></i>
        {c.name}
      </div>
    </div>
  </div>

你有很多项目你必须设置数据值传递一个数组,假设我们有数组

countries = [{name: 'Afganistan', abbr: 'af'},
    {name: 'Bolivia', abbr: 'bo'}, 
    {name: 'Brazil', abbr: 'br'},
    {name: 'Canada', abbr: 'ca'},
    {name: 'Colombia', abbr: 'co'},
    {name: 'Ecuador', abbr: 'ec'},
    {name: 'Peru', abbr: 'pe'},
    {name: 'USA', abbr: 'us'}
    ]

// to select

$('.ui.fluid.multiple').dropdown('set selected', ['bo', 'ec'])