columnSelect: render initial selected state
This commit is contained in:
parent
2ad3aea16c
commit
2c5bfea046
3 changed files with 21 additions and 15 deletions
|
@ -1478,7 +1478,7 @@ class InputsRef extends App.ControllerContent
|
|||
name: 'project-name'
|
||||
id: 'project-name-123'
|
||||
placeholder: 'Enter Project Name'
|
||||
options: [{value:0,name:'Apple'},{value:1,name:'Microsoft',selected:true},{value:2,name:'Google'},{value:3,name:'Deutsche Bahn'},{value:4,name:'Sparkasse'},{value:5,name:'Deutsche Post'},{value:6,name:'Mitfahrzentrale'},{value:7,name:'Starbucks'},{value:8,name:'Mac Donalds'},{value:9,name:'Flixbus'},{value:10,name:'Betahaus'},{value:11,name:'Bruno Banani'},{value:12,name:'Alpina'},{value:13,name:'Samsung'},{value:14,name:'ChariTea'},{value:15,name:'fritz-kola'},{value:16,name:'Vitamin Water'},{value:17,name:'Znuny'},{value:18,name:'Max & Moritz'}]
|
||||
options: [{value:0,name:'Apple',selected:true},{value:1,name:'Microsoft',selected:true},{value:2,name:'Google'},{value:3,name:'Deutsche Bahn'},{value:4,name:'Sparkasse'},{value:5,name:'Deutsche Post'},{value:6,name:'Mitfahrzentrale'},{value:7,name:'Starbucks'},{value:8,name:'Mac Donalds'},{value:9,name:'Flixbus'},{value:10,name:'Betahaus'},{value:11,name:'Bruno Banani'},{value:12,name:'Alpina'},{value:13,name:'Samsung'},{value:14,name:'ChariTea'},{value:15,name:'fritz-kola'},{value:16,name:'Vitamin Water'},{value:17,name:'Znuny'},{value:18,name:'Max & Moritz'}]
|
||||
@$('.searchableSelectPlaceholder').replaceWith( searchableSelectObject.element() )
|
||||
|
||||
# selectable search
|
||||
|
|
|
@ -23,11 +23,17 @@ class App.ColumnSelect extends Spine.Controller
|
|||
|
||||
constructor: ->
|
||||
super
|
||||
@values = []
|
||||
@render()
|
||||
|
||||
render: ->
|
||||
@html App.view('generic/column_select')( @options.attribute )
|
||||
@values = []
|
||||
_.each @options.attribute.options, (option) =>
|
||||
if option.selected
|
||||
@values.push option.value
|
||||
|
||||
@html App.view('generic/column_select')
|
||||
attribute: @options.attribute
|
||||
values: @values
|
||||
|
||||
# keep inital height
|
||||
# disabled for now since controls in modals get rendered hidden
|
||||
|
|
|
@ -1,24 +1,24 @@
|
|||
<select
|
||||
class="columnSelect-shadow js-shadow"
|
||||
id="<%= @id %>"
|
||||
name="<%= @name %>"
|
||||
<%= @required %>
|
||||
<%= @autofocus %>
|
||||
value="<%= @value %>"
|
||||
id="<%= @attribute.id %>"
|
||||
name="<%= @attribute.name %>"
|
||||
<%= @attribute.required %>
|
||||
<%= @attribute.autofocus %>
|
||||
value="<%= @attribute.value %>"
|
||||
multiple
|
||||
>
|
||||
<% for option in @options: %>
|
||||
<% for option in @attribute.options: %>
|
||||
<option value="<%= option.value %>"><%= option.name %></option>
|
||||
<% end %>
|
||||
</select>
|
||||
<div class="columnSelect-column columnSelect-column--selected js-selected">
|
||||
<div class="u-placeholder u-unselectable js-placeholder"><%- @T('Nothing selected') %></div>
|
||||
<% for option in @options: %>
|
||||
<div class="columnSelect-option is-hidden js-remove js-option" data-value="<%= option.value %>"><%= option.name %></div>
|
||||
<div class="u-placeholder u-unselectable js-placeholder<%= ' is-hidden' if @values.length %>"><%- @T('Nothing selected') %></div>
|
||||
<% for option in @attribute.options: %>
|
||||
<div class="columnSelect-option js-remove js-option<%= ' is-hidden' if !option.selected %>" data-value="<%= option.value %>"><%= option.name %></div>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="columnSelect-column columnSelect-column--sidebar">
|
||||
<% if @options.length > 10: %>
|
||||
<% if @attribute.options.length > 10: %>
|
||||
<div class="columnSelect-search">
|
||||
<%- @Icon('magnifier') %>
|
||||
<input class="js-search">
|
||||
|
@ -28,8 +28,8 @@
|
|||
</div>
|
||||
<% end %>
|
||||
<div class="columnSelect-pool js-pool">
|
||||
<% for option in @options: %>
|
||||
<div class="columnSelect-option js-select js-option" data-value="<%= option.value %>" title="<%= option.name %>"><%= option.name %></div>
|
||||
<% for option in @attribute.options: %>
|
||||
<div class="columnSelect-option js-select js-option<%= ' is-hidden' if option.selected %>" data-value="<%= option.value %>" title="<%= option.name %>"><%= option.name %></div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
Loading…
Reference in a new issue