Перетащите скрытые события в Fullcalendar

Question

Я застрял здесь и мне нужна серьезная помощь.Я должен был сделать некоторую работу, используя fullcalendar, я сделал все, следуя стандартной процедуре.В календаре отображаются все события в правильных слотах, что прекрасно работает.Некоторые события нужно рендерить, но они остаются скрытыми и ждут, пока событие не будет показано, поэтому я только установил атрибут отображения css в none, когда скрыт, и заблокирован, когда он виден.Пока все работает отлично, проблема возникает при перетаскивании и событии из слота A в слот B, по какой-то странной причине, когда начинается событие перетаскивания, поле события должно быть рядом с курсором, но это не так, окно событияустановить около 200px ниже и 100px справа от курсора.

Я провел некоторую отладку и обнаружил, что, хотя атрибуты top и left окна событий установлены правильно (скажем, top: 300px, left: 150px), когда начинается событие перетаскивания, левое значение переходит в 0px, а top - как 580px.Я не понимаю, почему это происходит, что я делаю неправильно, или если я что-то должен делать

Answer 1

Проблема в том, что FullCalendar использует утилиту Position пользовательского интерфейса jQuery, чтобы выяснить, где отображаются события, и большинство браузеров плохо справляются с заданием верхнего / левого скрытых элементов.Поэтому, когда вы делаете события видимыми, jQuery не имеет реального представления о том, где они находятся, и заканчивает тем, что делает сумасшедшие вещи, которые вы видите.

Самое простое решение: не используйте CSS для отображения / скрытия ваших событий.Используйте API FullCalendar, чтобы создать событие, как только оно должно быть показано. renderEvent - это то, что вам нужно:

$('#mycalendar').fullCalendar( 'renderEvent', event [, stick ] )

Альтернативная возможность: дополнительно укажите top: 0px; left: 0px в вашем CSS, который также устанавливает display: none;.Иногда это помогает правильно работать.