UpdatePanel - перемещение элемента управления в DOM приводит к тому, что такие элементы управления возвращаются в исходное состояние при частичной обратной передаче

Question

Все элементы управления находятся в одной панели обновления.

При начальной загрузке страницы я перемещаю элементы управления в DOM следующим образом:

DIV_Child.Parent.Controls.Remove(DIV_Child) 'Remove from original parent'
DIV_NewParent.Controls.Add(DIV_Child)

При начальной загрузке страницы я также манипулирую этими элементами управления, добавляя стили.

DIV_Child.Style("position") = "absolute"
DIV_Child.style("background-color") = "black"
'etc.

Когда происходит частичная обратная передача, DIV_Child возвращается в исходное состояние: без движения и без стиля.

• Эта проблема возникает только для тех элементов управления, которые перемещаются в DOM. Если я удаляю те линии, которые перемещают элементы управления, элементы управления сохраняют стиль и расположение DOM между частичными обратными передачами.

Как предотвратить перемещение перемещенных элементов управления стилями и новыми позициями в DOM при частичной обратной передаче?

Answer 1

Вам нужно использовать ContentTemplateContainer свойство программно добавлять или удалять элементы управления внутри UpdatePanel ContentTemplate,

В вашем сценарии вы должны добавить как содержащие DIV (родительский объект DIV_Child и DIV_NewParent), так и DIV_Child в коллекцию элементов управления ContentTemplateContainer в PageLoad: -

    upd.ContentTemplateContainer.Controls.Add(DIV_OldParent);
    upd.ContentTemplateContainer.Controls.Add(DIV_NewParent);

    upd.ContentTemplateContainer.Controls.Add(DIV_Child);

Проблема возникает из-за того, что ваша разметка содержит элемент div в его исходном положении и стиле, и поскольку он отличается от того, что передается при частичной обратной передаче, UpdatePanel возвращает его как изменение (упрощенное объяснение).

Пожалуйста, дайте это попробовать.

Я бы обычно рекомендовал использовать UpdatePanel для чего-то быстрого и грязного, но для лучшей производительности вместо этого используйте jQuery Ajax и серверный HttpHandler. Хотя это (немного) больше работы, это дает вам большую гибкость, и вы гарантированно, что ничто не будет мешать разделу DOM, который не находится внутри UpdatePanel.

Я согласен, что использование UpdatePanels - это более быстрый опыт разработки, но у них есть ряд проблем, не в последнюю очередь из-за того, что они отправляют ViewState туда и обратно при каждой частичной обратной передаче, что не очень эффективно.