pgadmin-org
/
pgadmin4
mirror of https://github.com/pgadmin-org/pgadmin4.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Improvise the Select2Cell 

Select2 does not allow to scroll any of the parent container once it was
opened, and if it was not properly closed.

Also, resolved an issue - existing selection was not working, while
re-rendering the Select2Cell.
pull/3/head
Ashesh Vashi 2016-04-15 11:01:11 +05:30
parent 7b344185b4
commit af680b724d
1 changed files with 18 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
web/pgadmin/static/js/backgrid/backgrid.pgadmin.js
View File

@ -398,14 +398,15 @@
defaults: _.defaults({ defaults: _.defaults({
select2: {}, select2: {},
opt: { opt: {
text: null, label: null,
value: null, value: null,
selected: false selected: false
} }
}, Backgrid.SelectCell.prototype.defaults), }, Backgrid.SelectCell.prototype.defaults),
enterEditMode: function() { enterEditMode: function() {
this.$el.addClass('editor'); if (!this.$el.hasClass('editor'))
this.$el.addClass('editor');
this.$select.select2('focus'); this.$select.select2('focus');
this.$select.on('blur', this.exitEditMode); this.$select.on('blur', this.exitEditMode);
}, },
@ -413,10 +414,11 @@
exitEditMode: function() { exitEditMode: function() {
this.$select.off('blur', this.exitEditMode); this.$select.off('blur', this.exitEditMode);
this.$el.removeClass('editor'); this.$el.removeClass('editor');
this.$select.select2('blur');
}, },
events: { events: {
"select2:open": "enterEditMode",
"select2:close": "exitEditMode",
"change": "onSave", "change": "onSave",
"select2:unselect": "onSave" "select2:unselect": "onSave"
}, },
@ -424,7 +426,7 @@
template: _.template([ template: _.template([
'<option value="<%- value %>" ', '<option value="<%- value %>" ',
'<%= selected ? \'selected="selected"\' : "" %>>', '<%= selected ? \'selected="selected"\' : "" %>>',
'<%- text %></option>'].join(''), '<%- label %></option>'].join(''),
null,{ null,{
variable: null variable: null
}), }),
@ -432,6 +434,8 @@
initialize: function() { initialize: function() {
Backgrid.SelectCell.prototype.initialize.apply(this, arguments); Backgrid.SelectCell.prototype.initialize.apply(this, arguments);
this.onSave = this.onSave.bind(this); this.onSave = this.onSave.bind(this);
this.enterEditMode = this.enterEditMode.bind(this);
this.exitEditMode = this.exitEditMode.bind(this);
}, },
render: function () { render: function () {
@ -447,7 +451,6 @@
if (this.$select) { if (this.$select) {
this.$select.select2('destroy'); this.$select.select2('destroy');
this.$select.off('change', this.onSave);
} }
this.$el.empty(); this.$el.empty();
@ -467,30 +470,29 @@
selectedValues = model.get(this.column.get("name")); selectedValues = model.get(this.column.get("name"));
delete this.$select; delete this.$select;
self = this,
selectedValues = model.get(this.column.get("name")), $select = self.$select = $('<select></select>').appendTo(this.$el);
self = this,
$select = self.$select = $('<select></select>').appendTo(this.$el);
for (var i = 0; i < optionValues.length; i++) { for (var i = 0; i < optionValues.length; i++) {
var opt = optionValues[i]; var opt = optionValues[i];
if (_.isArray(opt)) { if (_.isArray(opt)) {
optionText = opt[0]; optionText = opt[0];
optionValue = opt[1]; optionValue = opt[1];
$select.append( $select.append(
self.template({ self.template({
text: optionText, label: optionText,
value: optionValue, value: optionValue,
selected: (selectedValues == optionValue) || selected: (selectedValues == optionValue) ||
(_.indexOf(selectedValues, optionValue) > -1) (_.indexOf(selectedValues, optionValue) > -1)
})); }));
} else { } else {
opt = _.defaults(opt, { opt = _.defaults({}, opt, {
selected: ((selectedValues == opt.value) || selected: ((selectedValues == opt.value) ||
(_.indexOf(selectedValues, opt.value) > -1)) (_.indexOf(selectedValues, opt.value) > -1)),
}, self.defaults.opt); }, self.defaults.opt);
$select.append(self.template(opt)); $select.append(self.template(opt));
} }
} }
@ -508,11 +510,11 @@
_.extend(select2_opts, {disabled: !editable}); _.extend(select2_opts, {disabled: !editable});
} }
// Initialize select2 control.
this.$select.select2(select2_opts).on('change', self.onSave);
this.delegateEvents(); this.delegateEvents();
// Initialize select2 control.
this.$select.select2(select2_opts);
return this; return this;
}, },