#8581 closed bug (notabug)

Opened September 14, 2012 10:57PM UTC

Closed September 16, 2012 01:31AM UTC

Combobox doesn't allow source to be set after creation (fix)

Reported by: rzhevskiy Owned by:
Priority: minor Milestone: 1.9.0
Component: ui.autocomplete Version: 1.8.23
Keywords: Cc:
Blocked by: Blocking:
Description

The combobox code given at http://jqueryui.com/demos/autocomplete/#combobox doesn't allow the source to be set after creation. It ignores the changes to the source.

The below change fixes this:

Function _create: set this.input, the rest stays the same:

_create: function() {

var input,

self = this,

select = this.select = this.element.hide(),

selected = select.children( ":selected" ),

value = selected.val() ? selected.text() : "",

wrapper = this.wrapper = $( "<span>" )

.addClass( "ui-combobox" )

.insertAfter( select );

input = this.input = $( "<input>" )

Add function _setOption:

_setOption: function(key, value) {

if (key == "source") {

// Create new option elements for the select

this.element.empty();

for (var i in value) {

var val = i;

var text = value[i];

if (typeof value[i] == "object") {

val = value[i].value;

text = value[i].label;

}

this.element.append('<option value="' + val + '">' + text + '</option>');

}

Empty the current value

this.input.val("");

Have the autocomplete reread the source

this.input.data("autocomplete")._initSource();

} else {

// Delegate to parent class

this.input.data("autocomplete")._setOption(key, value);

}

}

Attachments (0)
Change History (2)

Changed September 14, 2012 11:00PM UTC by rzhevskiy comment:1

I'm reposting the code with correct formatting, apologies.

_create: function() {
	var input,
		self = this,
		select = this.element.hide(),
		selected = select.children( ":selected" ),
		value = selected.val() ? selected.text() : "",
		wrapper = this.wrapper = $( "<span>" )
			.addClass( "ui-combobox" )
			.insertAfter( select );

	input = this.input = $( "<input>" )

_setOption: function(key, value) {
	if (key == "source") {
		// Create new option elements for the select
		this.element.empty();
		for (var i in value) {
			var val = i;
			var text = value[i];
			if (typeof value[i] == "object") {
				val = value[i].value;
				text = value[i].label;
			}
			this.element.append('<option value="' + val + '">' + text + '</option>');
		}
		// Empty the current value
		this.input.val("");
		// Have the autocomplete reread the source
		this.input.data("autocomplete")._initSource();
	} else {
		// Delegate to parent class
		this.input.data("autocomplete")._setOption(key, value);
	}
}

Changed September 16, 2012 01:31AM UTC by scottgonzalez comment:2

resolution: → invalid
status: new → closed

Combobox is just a demo, it is not a full supported widget.