Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

added create_with_enter option that means a user can type a new value an... #48

Open
wants to merge 5 commits into
base: option_adding
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
29 changes: 27 additions & 2 deletions coffee/chosen.jquery.coffee
Original file line number Diff line number Diff line change
Expand Up @@ -187,7 +187,7 @@ class Chosen extends AbstractChosen
@search_choices.find("li.search-choice").remove()
else if not @is_multiple
this.single_set_selected_text()
if @disable_search or @form_field.options.length <= @disable_search_threshold
if @disable_search or @form_field.options.length <= @disable_search_threshold and not @create_option
@search_field[0].readOnly = true
@container.addClass "chosen-container-single-nosearch"
else
Expand Down Expand Up @@ -332,6 +332,10 @@ class Chosen extends AbstractChosen
if @result_highlight
high = @result_highlight

if high.hasClass "create-option"
this.select_create_option(@search_field.val())
return this.results_hide()

this.result_clear_highlight()

if @is_multiple and @max_selected_options <= this.choices_count()
Expand Down Expand Up @@ -407,17 +411,38 @@ class Chosen extends AbstractChosen
no_results: (terms) ->
no_results_html = $('<li class="no-results">' + @results_none_found + ' "<span></span>"</li>')
no_results_html.find("span").first().html(terms)

@search_results.append no_results_html
@form_field_jq.trigger("chosen:no_results", {chosen:this})

show_create_option: (terms) ->
create_option_html = $('<li class="create-option active-result"><a>' + @create_option_text + '</a>: "' + terms + '"</li>')
@search_results.append create_option_html

create_option_clear: ->
@search_results.find(".create-option").remove()

select_create_option: (terms) ->
if $.isFunction(@create_option)
@create_option.call this, terms
else
this.select_append_option( {value: terms, text: terms} )

select_append_option: ( options ) ->
option = $('<option />', options ).attr('selected', 'selected')
@form_field_jq.append option
@form_field_jq.trigger "chosen:updated"
@form_field_jq.trigger "change"
@search_field.trigger "focus"

no_results_clear: ->
@search_results.find(".no-results").remove()

keydown_arrow: ->
if @results_showing and @result_highlight
next_sib = @result_highlight.nextAll("li.active-result").first()
this.result_do_highlight next_sib if next_sib
else if @results_showing and @create_option
this.result_do_highlight(@search_results.find('.create-option'))
else
this.results_show()

Expand Down
37 changes: 34 additions & 3 deletions coffee/chosen.proto.coffee
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,9 @@ class @Chosen extends AbstractChosen
# HTML Templates
@single_temp = new Template('<a class="chosen-single chosen-default" tabindex="-1"><span>#{default}</span><div><b></b></div></a><div class="chosen-drop"><div class="chosen-search"><input type="text" autocomplete="off" /></div><ul class="chosen-results"></ul></div>')
@multi_temp = new Template('<ul class="chosen-choices"><li class="search-field"><input type="text" value="#{default}" class="default" autocomplete="off" style="width:25px;" /></li></ul><div class="chosen-drop"><ul class="chosen-results"></ul></div>')
@no_results_temp = new Template('<li class="no-results">' + @results_none_found + ' "<span>#{terms}</span>"</li>')
@no_results_temp = new Template('<li class="no-results">' + @results_none_found + ' "<span>#{terms}</span>".</li>')
@new_option_temp = new Template('<option value="#{value}">#{text}</option>')
@create_option_temp = new Template('<li class="create-option active-result"><a>#{text}</a>: "#{terms}"</li>')

set_up_html: ->
container_classes = ["chosen-container"]
Expand Down Expand Up @@ -181,7 +183,7 @@ class @Chosen extends AbstractChosen
@search_choices.select("li.search-choice").invoke("remove")
else if not @is_multiple
this.single_set_selected_text()
if @disable_search or @form_field.options.length <= @disable_search_threshold
if @disable_search or @form_field.options.length <= @disable_search_threshold and not @create_option
@search_field.readOnly = true
@container.addClassName "chosen-container-single-nosearch"
else
Expand Down Expand Up @@ -325,6 +327,11 @@ class @Chosen extends AbstractChosen
result_select: (evt) ->
if @result_highlight
high = @result_highlight

if high.hasClassName "create-option"
this.select_create_option(@search_field.value)
return this.results_hide()

this.result_clear_highlight()

if @is_multiple and @max_selected_options <= this.choices_count()
Expand Down Expand Up @@ -406,15 +413,39 @@ class @Chosen extends AbstractChosen
@search_results.insert @no_results_temp.evaluate( terms: terms )
@form_field.fire("chosen:no_results", {chosen: this})

show_create_option: (terms) ->
create_option_html = @create_option_temp.evaluate( terms: terms, text: @create_option_text )
@search_results.insert create_option_html
@search_results.down(".create-option").observe "click", (evt) => this.select_create_option(terms)

create_option_clear: ->
co = null
co.remove() while co = @search_results.down(".create-option")

select_create_option: ( terms ) ->
if Object.isFunction( @create_option )
@create_option.call this, terms
else
this.select_append_option( value: terms, text: terms )

select_append_option: ( options ) ->
option = @new_option_temp.evaluate( options )
@form_field.insert option
Event.fire @form_field, "chosen:updated"
if typeof Event.simulate is 'function'
@form_field.simulate("change")
@search_field.simulate("focus")

no_results_clear: ->
nr = null
nr.remove() while nr = @search_results.down(".no-results")


keydown_arrow: ->
if @results_showing and @result_highlight
next_sib = @result_highlight.next('.active-result')
this.result_do_highlight next_sib if next_sib
else if @results_showing and @create_option
this.result_do_highlight(@search_results.select('.create-option').first())
else
this.results_show()

Expand Down
23 changes: 21 additions & 2 deletions coffee/lib/abstract-chosen.coffee
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,10 @@ class AbstractChosen
@inherit_select_classes = @options.inherit_select_classes || false
@display_selected_options = if @options.display_selected_options? then @options.display_selected_options else true
@display_disabled_options = if @options.display_disabled_options? then @options.display_disabled_options else true
@create_option = @options.create_option || false
@create_with_enter = @options.create_with_enter || false
@persistent_create_option = @options.persistent_create_option || false
@skip_no_results = @options.skip_no_results || false

set_default_text: ->
if @form_field.getAttribute("data-placeholder")
Expand All @@ -39,6 +43,7 @@ class AbstractChosen
@default_text = @options.placeholder_text_single || @options.placeholder_text || AbstractChosen.default_single_text

@results_none_found = @form_field.getAttribute("data-no_results_text") || @options.no_results_text || AbstractChosen.default_no_result_text
@create_option_text = @form_field.getAttribute("data-create_option_text") || @options.create_option_text || AbstractChosen.default_create_option_text

mouse_enter: -> @mouse_on_container = true
mouse_leave: -> @mouse_on_container = false
Expand Down Expand Up @@ -101,6 +106,9 @@ class AbstractChosen

this.outerHTML(group_el)

append_option: (option) ->
this.select_append_option(option)

results_update_field: ->
this.set_default_text()
this.results_reset_cleanup() if not @is_multiple
Expand Down Expand Up @@ -128,11 +136,13 @@ class AbstractChosen
this.no_results_clear()

results = 0
exact_result = false

searchText = this.get_search_text()
escapedSearchText = searchText.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&")
zregex = new RegExp(escapedSearchText, 'i')
regex = this.get_search_regex(escapedSearchText)
eregex = new RegExp('^' + escapedSearchText + '$', 'i')

for option in @results_data

Expand All @@ -156,6 +166,8 @@ class AbstractChosen
option.search_match = this.search_string_match(option.search_text, regex)
results += 1 if option.search_match and not option.group

exact_result = eregex.test option.html

if option.search_match
if searchText.length
startpos = option.search_text.search zregex
Expand All @@ -171,11 +183,14 @@ class AbstractChosen

if results < 1 and searchText.length
this.update_results_content ""
this.no_results searchText
this.no_results searchText unless @create_option and @skip_no_results
else
this.update_results_content this.results_option_build()
this.winnow_results_set_highlight()

if @create_option and (results < 1 or (!exact_result and @persistent_create_option)) and searchText.length
this.show_create_option( searchText )

get_search_regex: (escaped_search_string) ->
regex_anchor = if @search_contains then "" else "^"
new RegExp(regex_anchor + escaped_search_string, 'i')
Expand Down Expand Up @@ -217,6 +232,10 @@ class AbstractChosen
this.results_search()
when 13
evt.preventDefault()
searchText = this.get_search_text()
if @create_option and @create_with_enter and @results_showing and searchTe
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

there are characters chopped of the end of this line..

@select_create_option(searchText)
return this.results_hide()
this.result_select(evt) if this.results_showing
when 27
this.results_hide() if @results_showing
Expand Down Expand Up @@ -269,4 +288,4 @@ class AbstractChosen
@default_multiple_text: "Select Some Options"
@default_single_text: "Select an Option"
@default_no_result_text: "No results match"

@default_create_option_text: "Add Option"
Loading