Можно ли запрограммировать вывод и работу страницы в модальном окне

[Serge_Bliznykov]

Добрый день.

Долго сомневался, где поместить свою тему с данным вопросом - в разделе HTML/CSS или в JS программировании. Выбрал всё таки JS. Но, возможно, я ошибся и задачу можно решить без скриптов.

поясню, в чём состоит задача.
есть страница, на ней выполняется вызов обработчика, на серверной стороне в PHP выполняется заполнение необходимой для работы страницы информации и вызов нужной страницы из папки WORK

	include(USERS_BASEPATH_TPL.'work/xxxx.tpl');

где xxxx.tpl - шаблон нужной страницы с включениями PHP, HTML разметкой и кучей jQuery кода.

Сейчас возникла необходимость сделать так, чтобы по обработчику данная страница открывалась и функционировала в модальном окошке.
Страницы эти навороченные, там куча скриптов на jQuery, формы, обработчики событий, темплейты и т.д. и т.п.

Подскажите, пожалуйста, существует ли возможность вызвать эту страницу в рамках некоего модального окна (ну, например, вызвать $.fancybox(что-то) ?
с сохранением работоспособности содержимого, разумеется!

Подскажите, эта задача имеет решение?

[Человек_Борща]

Подскажите, эта задача имеет решение?

фрейм в новом окне если там отдельная полноценная веб страница.

по умному же глобальные части отдать на откуп основной странице (все включения скриптов, стилей и прочего, что есть в основной), "модальный" кусок получать AJAX'ом и грузить в тот же jQuery.UI диалог.

Грубо говоря, пускай сервер генерирует некий кусок HTML, который вставится в div и будет нормально отображаться. А этот div можно потом как-то красиво показать, тут уже масса вариантов. Я пользуюсь jQuery.UI Dialog компонентом.

Опять же, засуньте фрейм в модальное окно jQuery а туда уже полноценную страницу.

[Serge_Bliznykov]

Человек_Борща, спасибо за ответ!
ничего, если я Вас помучаю вопросами? (мне, глупому, не всё понятно в вашем ответе)

фрейм в новом окне если там отдельная полноценная веб страница.

да, там полностью полноценная страница. Но значит "фрейм в новом окне"?
Это будет новое окно браузера? Тогда это мне не подходит. Задача как раз и состоит в том, чтобы на основной странице вы выбрали объекты, которые надо обработать, открылась форма для задания параметров их обработки (эта и есть эта самая полноценная страница) и потом мы выбрали или "Сохранить" или "Отменить" и модальное окно закрылось. При этом исходное окно (где был выбор объектов) закрываться не должно...

Грубо говоря, пускай сервер генерирует некий кусок HTML, который вставится в div и будет нормально отображаться. А этот div можно потом как-то красиво показать, тут уже масса вариантов. Я пользуюсь jQuery.UI Dialog компонентом.

Вот, эту вашу мысль я понял. Но, боюсь, что это потребует полностью переписать содержимое загружаемых страниц. Что мне совсем-совсем не хочется (да и времени столько мне не дадут!)

Опять же, засуньте фрейм в модальное окно jQuery а туда уже полноценную страницу.

простите, а как это? можно какой-нибудь совсем примитивны примерчик?
Если это не сложно и не долго, конечно.
Если же это сложно, то ничего страшного, я буду копать сам (или искать фрилансера в помощь). Главное, идея!


p.s. поиском нашёл некий FrameWarp, завтра попробую его задействовать,
если хватит знаний и опыта...
Похоже, что он делает именно то, что я хочу...

[Alex11223]

Наверно имелось в виду, что в содержимое диалога jQuery (или чем вы модальное окно выводите) можно положить iframe.

[Naive]

Борщ в целом все правильно сказал, тут три основных идиологически разных варианта:
1. window.open, открывает новую страницу, она не обязательно может быть поверх или в новой вкладке, там масса настроек еще от ИЕ4/NN2.0 осталось, можно собрать модалку, будет иметь собственное глобальное пространство, т.е. самостоятельная страница, но хитрым способом можно общаться между родителем и самим окном.
2. iframe, можно отобразить где угодно на странице, т.е. примерно помесь 1 и 3 варианта, глобальное пространство и общение так же как в 1 варианте, только открывается внутри дейсвующего окна.
3. Последняя мода на попапы, сами рисуем блок, сами задаем ему поведение, все шикарно, но все действия происходят в основном окне, а не в песочнице.

Я предпочитаю 3, больше управления в плане красивости, и вполне хорошо управляется, если руки из нужного места умеют правильно создавать инкапсуляцию. 1 в продакшене не юзал ни разу, использую тока если надо открыть скриптом несколько страниц, или по-бырому несколько результатов работы канваса сохранить))) 2. юзаю только если приходится работать с другим доменом, так проще, чем пинать бэкендеров писать jsonp))

ps. Забыл добавить, за первым примером далеко ходить не надо: размести любой видос с ютуба у себя на странице в ВК или ФБ, через ютуб, конечно, тебе и всплывет этот window.open.
p.p.s. jq.ui dialog позволяет напрямую открывать адрес фреймом, уи штука крутая, но черезчур, к сожалению. Очень много конфликтует с другими фреймворками, тяжелая и слишком уж "мы можем все". Для нуба самое то, сам юзал в начале, сейчас же считаю, что я лучше напишу свое под конкретную задачу=)
p.p.p.s. Для мобилок рекомендуется юзать таки window.open)

[Человек_Борща]

да, там полностью полноценная страница. Но значит "фрейм в новом окне"?
Это будет новое окно браузера? Тогда это мне не подходит. Задача как раз и состоит в том, чтобы на основной странице вы выбрали объекты, которые надо обработать, открылась форма для задания параметров их обработки (эта и есть эта самая полноценная страница) и потом мы выбрали или "Сохранить" или "Отменить" и модальное окно закрылось. При этом исходное окно (где был выбор объектов) закрываться не должно...

У вас не правильный подход к задаче. Разве для редактирования нужна полноценная страница? Зачем?

Смотрите:
Пускай у нас некое отображение таблицы из БД в веб, в table, где каждая строка (TR) имеет атрибут (ROWID) содержащий значения уникального составного ключа записи из базы, это мы используем чтобы из базы тянуть правильные данные.

Юзер ставит курсов на запись, нажимает редактировать.
AJAX'ом мы передаем на некий edit.php тип изменения (в нашем случае это EDIT) и ROWID.

Сервер (программист), по скольку веб-страница состоит из кусков (шаблонов), форма редактирования так же является шаблоном, не полноценная страница, содержимое которой просто опирается на основной шаблон, а тот обеспечивает работоспособность этого куска кода (CSS, JS и т.д.).

И так, сервер получив данные с клиента, заполняет шаблон данными из таблицы, передает клиенту.
Браузер вставляет кусок шаблона в тело основного документа, пускай внутрь некого:

<div id="modalWnd" style="display:none">
</div>

Затем вызывает тот же jQuery.dialog:

$("#modalWnd").dialog(); //это вообще надо делать когда страница загружена, т.е. 1 раз за всю жизнь страницы.

$("#modalWnd").dialog('open'); //Открываем диалог
$("#modalWnd").dialog('close'); //Закрываем диалог

Нам красиво показывает форму редактирования. По нажатию кнопок в диалоге, можно тем же AJAX'ом передавать изменения записи назад на сервер, а после JS'ом обновлять и строку в таблице. Красиво, современно, просто и удобно.

Так можно любые данные отображать.

простите, а как это? можно какой-нибудь совсем примитивны примерчик?
Если это не сложно и не долго, конечно.
Если же это сложно, то ничего страшного, я буду копать сам (или искать фрилансера в помощь). Главное, идея!

Ну к примеру так: http://jsfiddle.net/P2Q5U/ (обсуждение)

Но тогда вам надо будет допилить реакцию фрейма на размеры модального окна, окошко растягивается а фрейму пофигу.

В туже степь, ещё обсуждения. Как предложил Naive, есть модальные видосы и картинки с других веб-сайтов.


Но кусками грузить только тот HTML, который нужен и будет 100% работать и отображаться красиво т.к. он часть существующей страницы, думаю правильнее. Да и на самом деле - меньше гемороя, хотя зависит от того чем сайт дышит.

P.S. jQuery.UI не панацея, просто удобный способ показывать диалоговые окна, которые можно перемещать, с кнопками, событиями и т.д. и т.п.

[Naive]

Большая пролема в том, что многие дятлы, когда пишут код не осознают, что они подкладывают падлу действительно адекватному программисту.
Тут я снимаю шляпу перед PHP, они знали кто будет юзать их язык. А теперь, даже в CSS можно так насрать, что убераешь говно - полсистемы не работает, вернешь - надо как-то обходить. Реально пукан разрывает.

[Человек_Борща]

Большая пролема в том, что многие дятлы, когда пишут код не осознают, что они подкладывают падлу действительно адекватному программисту.
Тут я снимаю шляпу перед PHP, они знали кто будет юзать их язык. А теперь, даже в CSS можно так насрать, что убераешь говно - полсистемы не работает, вернешь - надо как-то обходить. Реально пукан разрывает.

Походу крик души, но ладно

Согласен, когда приходится переписывать чужой код, остаётся только тихо матерится. Про PHP не понял, проблема скорее в плотнике, а не в молотке.
CSS - отдельная тема. Меняется кусками, неравномерно, ущербно, тут уже зоопарк браузеров виновен.

[Вадим Мошев]

Про PHP не понял

Это был камень в огород PHP

[Naive]

Сообщение от Вадим Мошев

Это был камень в огород PHP

Наоборот, в пыхе мне нравится мощная инкапсуляция. Обычно каждая внутренняя область видимости наследует и переписывает для себя все родительские. В РНР создал функцию и она ваще не в курсах чо тут ваще происходит и нахрен она такая пришла, чтобы узнать о происходящем вокруг приходится вылазить из нее через глобальный объект, либо передавать все необходимое в качестве параметров.
Я про быдло-код режим, ООП в пыхе заставил кровоточить мой мозг, я решил сохранить психику и закрыл это.