Is there a way to swap partnered schedulers with a component state?
Support Forum
Sure, that's easily done with basic DOM manipulation. Please read on MDN: https://developer.mozilla.org/en-US/docs/Web/API/Node/appendChild
How do you swap positions? Seems to work fine for me, try at https://www.bryntum.com/examples/scheduler/partners/
to run in console:
scheduler.element.parentElement.appendChild(scheduler.element);
can you test it with your react/ drag-between-schedulers demo, your answer is not react specific, it is just a simple DOM manipulation
try to swap scheduler positions (bottom scheduler to top view and and top scheduler to bottom view)
https://www.bryntum.com/examples/scheduler/react/javascript/drag-between-schedulers/build/index.html
ex:
<div id="content">
<BryntumScheduler
{...scheduler2Config}
schedulerClass={BottomScheduler}
/>
<BryntumWidget type="splitter" />
<BryntumScheduler {...scheduler1Config} ref={scheduler1Ref} />
</div>
Do you have a fix for this?
The proof of concept:
- navigate to https://www.bryntum.com/examples/scheduler/react/javascript/drag-between-schedulers/build/index.html
- in the console, execute:
c = document.getElementById('container');c.appendChild(document.querySelector('.b-splitter'));c.appendChild(document.getElementById('top-scheduler'));
This does not do anything with the components it only moves splitter to the end of container and then moves top scheduler after the splitter. It's all.
In the real life you may want to adjust sizes of schedulers before or after swap, you may want to write a universal routine that would be able to swap schedulers back, etc.
The position of partners is irrelevant, in fact the scheduler code does not know if its partner is above or below. That is also the reason that simple swap of DOM elements does not break anything and the partnered schedulers continue to work.
I don't know the details of your "component way" of swap but I'd guess that it does more than just mere swap of DOM, perhaps destroy an re-create or anything else in addition to the DOM swap.