Class: Ferro::Form::Select

Inherits:
BaseElement show all
Defined in:
opal/opal-ferro/elements/ferro_form.js.rb

Overview

Creates a select list with options. In the DOM creates a: <select> and <option>. Specify option :list = Hash to set selectable options.

Constant Summary

Constants included from Elementary

Elementary::RESERVED_NAMES

Instance Attribute Summary

Attributes inherited from BaseElement

#children, #domtype, #element, #parent, #sym

Instance Method Summary collapse

Methods inherited from BaseElement

#add_state, #add_states, #classify_state, #component, #dom_id, #factory, #get_text, #html, #initialize, #option_replace, #remove_attribute, #root, #router, #set_attribute, #set_text, #state_active?, #toggle_state, #update_state, #value, #value=

Methods included from Elementary

#_after_create, #_stylize, #add_child, #before_create, #cascade, #create, #creation, #destroy, #each_child, #forget_children, #method_missing, #remove_child, #style, #symbolize

Constructor Details

This class inherits a constructor from Ferro::BaseElement

Dynamic Method Handling

This class handles dynamic methods through the method_missing method in the class Ferro::Elementary

Instance Method Details

#_before_create ⇒ Object

Internal method.



199
200
201
202
203
 
# File 'opal/opal-ferro/elements/ferro_form.js.rb', line 199

def _before_create
  @domtype = :select
  @list = option_replace :list, {}
  super
end

#add_option(value, content) ⇒ ElementVar

Manually add an option to the select element

Parameters:

  • value (String, Symbol) —

    Key of the option

  • content (String) —

    Content to be displayed in the select list

Returns:

  • (ElementVar) —

    Returns the newly created element



225
226
227
228
229
230
231
232
233
 
# File 'opal/opal-ferro/elements/ferro_form.js.rb', line 225

def add_option(value, content)
  add_child(
    "opt_#{value}",
    Element::Var,
    domtype: :option,
    value: value,
    content: content
  )
end

#after_create ⇒ Object

Internal method. TODO Use _after_create



207
208
209
210
211
212
213
214
 
# File 'opal/opal-ferro/elements/ferro_form.js.rb', line 207

def after_create
  @list.each do |value, content|
    add_option(value, content)
  end

  `#{@element}.addEventListener("change",function(e){#{changed};document.activeElement.blur()})`
  super
end

#changed ⇒ Object

Override this method to specify what happens after the select elements value is changed.



218
 
# File 'opal/opal-ferro/elements/ferro_form.js.rb', line 218

def changed;end

#select(option) ⇒ Object

Set the selected option.

Parameters:

  • option (String, Symbol) —

    Key of the option



247
248
249
250
251
252
253
254
 
# File 'opal/opal-ferro/elements/ferro_form.js.rb', line 247

def select(option)
  `for(var i=0; i < #{element}.options.length; i++) {
    if (#{element}.options[i].value === #{option}) {
      #{element}.selectedIndex = i;
      break;
    }
  }`
end

#selection ⇒ Hash

Returns the currently selected option.

Returns:

  • (Hash) —

    Returns a hash with keys: :option and :text



238
239
240
241
242
 
# File 'opal/opal-ferro/elements/ferro_form.js.rb', line 238

def selection
  option = `#{element}.options[#{element}.selectedIndex].value`
  text   = `#{element}.options[#{element}.selectedIndex].text`
  { option: option, text: text }
end