othmane/ohif-viewer
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Fixing select2 re-rendering issues

Browse Source
This commit is contained in:
Bruno Alves de Faria 2017-03-31 12:07:38 -03:00
parent 25671c4e77
commit 4e54b21dd4
2 changed files with 49 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Packages/ohif-core/client/components/base/mixins/schemaData.js
View File

@ -100,7 +100,7 @@ OHIF.mixins.schemaData = new OHIF.Mixin({
// Fill the items if it's an array schema
if (!data.items && Array.isArray(currentSchema.allowedValues)) {
data.items = new ReactiveVar();
data.items = data.items instanceof ReactiveVar ? data.items : new ReactiveVar();
Tracker.autorun(() => {
const schemaDefs = getCurrentSchemaDefs(parent, data.pathKey);

28
Packages/ohif-core/client/components/base/mixins/select2.js
View File

@ -1,5 +1,6 @@
import { Template } from 'meteor/templating';
import { ReactiveVar } from 'meteor/reactive-var';
import { Tracker } from 'meteor/tracker';
import { _ } from 'meteor/underscore';
import { $ } from 'meteor/jquery';
import { OHIF } from 'meteor/ohif:core';
@ -53,6 +54,13 @@ OHIF.mixins.select2 = new OHIF.Mixin({
const instance = Template.instance();
const component = instance.component;
// Destroy and re-create the select2 instance
const rebuildSelect2 = () => {
// Destroy the select2 instance if exists and re-create it
if (component.select2Instance) {
component.select2Instance.destroy();
}
// Apply the select2 to the component
component.$element.select2(instance.data.options);
@ -76,6 +84,26 @@ OHIF.mixins.select2 = new OHIF.Mixin({
component.toggleMessage(false);
}
});
};
instance.autorun(() => {
// Run this computation every time the reactive items suffer any changes
const isReactive = instance.data.items instanceof ReactiveVar;
if (isReactive) {
instance.data.items.dep.depend();
}
if (isReactive) {
// Keep the current value of the component
const currentValue = component.value();
Tracker.afterFlush(() => {
rebuildSelect2();
component.value(currentValue);
});
} else {
rebuildSelect2();
}
});
},
onDestroyed() {