FIX: Selecting default option without changing HTML markup.

I also filed a bug on Ember.js with details on the error.
This commit is contained in:
Robin Ward 2014-12-04 15:21:47 -05:00
parent 5ec77d4be4
commit dd7b3d313e

View file

@ -7,7 +7,7 @@
@module Discourse @module Discourse
**/ **/
export default Discourse.View.extend({ export default Discourse.View.extend({
tagName: 'span', tagName: 'select',
attributeBindings: ['tabindex'], attributeBindings: ['tabindex'],
classNames: ['combobox'], classNames: ['combobox'],
valueAttribute: 'id', valueAttribute: 'id',
@ -27,7 +27,6 @@ export default Discourse.View.extend({
none = this.get('none'); none = this.get('none');
// Add none option if required // Add none option if required
buffer.push('<select class=\'combobox\'>');
if (typeof none === "string") { if (typeof none === "string") {
buffer.push('<option value="">' + I18n.t(none) + "</option>"); buffer.push('<option value="">' + I18n.t(none) + "</option>");
} else if (typeof none === "object") { } else if (typeof none === "object") {
@ -47,11 +46,10 @@ export default Discourse.View.extend({
buffer.push("<option " + selectedText + " value=\"" + val + "\" " + self.buildData(o) + ">" + Handlebars.Utils.escapeExpression(Em.get(o, nameProperty)) + "</option>"); buffer.push("<option " + selectedText + " value=\"" + val + "\" " + self.buildData(o) + ">" + Handlebars.Utils.escapeExpression(Em.get(o, nameProperty)) + "</option>");
}); });
} }
buffer.push('</select>');
}, },
valueChanged: function() { valueChanged: function() {
var $combo = this.$('select'), var $combo = this.$(),
val = this.get('value'); val = this.get('value');
if (val !== undefined && val !== null) { if (val !== undefined && val !== null) {
$combo.val(val.toString()); $combo.val(val.toString());
@ -66,9 +64,15 @@ export default Discourse.View.extend({
}.observes('content.@each'), }.observes('content.@each'),
didInsertElement: function() { didInsertElement: function() {
var $elem = this.$('select'), var $elem = this.$(),
self = this; self = this;
// Workaround for https://github.com/emberjs/ember.js/issues/9813
// Can be removed when fixed. Without it, the wrong option is selected
this.$('option').each(function(i, o) {
o.selected = !!$(o).attr('selected');
});
$elem.select2({formatResult: this.template, minimumResultsForSearch: 5, width: 'resolve'}); $elem.select2({formatResult: this.template, minimumResultsForSearch: 5, width: 'resolve'});
$elem.on("change", function (e) { $elem.on("change", function (e) {