Форум программистов
 
Контакты: о проблемах с регистрацией, почтой и по другим вопросам пишите сюда - alarforum@yandex.ru, проверяйте папку спам! Обязательно пройдите активизацию e-mail.

Вернуться   Форум программистов > Web > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail


Донат для форума - использовать для поднятия настроения себе и модераторам

А ещё здесь можно купить рекламу за 25 тыс руб в месяц! ) пишите сюда - alarforum@yandex.ru

Ответ
 
Опции темы
Старый 02.02.2016, 18:36   #1
Serge_Bliznykov
МегаМодератор
СуперМодератор
 
Регистрация: 09.01.2008
Сообщений: 25,855
Репутация: 5617
По умолчанию Можно ли запрограммировать вывод и работу страницы в модальном окне

Добрый день.

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

поясню, в чём состоит задача.
есть страница, на ней выполняется вызов обработчика, на серверной стороне в PHP выполняется заполнение необходимой для работы страницы информации и вызов нужной страницы из папки WORK
Код:
	include(USERS_BASEPATH_TPL.'work/xxxx.tpl');
где xxxx.tpl - шаблон нужной страницы с включениями PHP, HTML разметкой и кучей jQuery кода.

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

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

Подскажите, эта задача имеет решение?
Serge_Bliznykov вне форума   Ответить с цитированием
Старый 02.02.2016, 18:43   #2
Человек_Борща
Профессионал
 
Аватар для Человек_Борща
 
Регистрация: 30.12.2009
Адрес: Республика Беларусь, г. Минск
Сообщений: 11,432
Репутация: 2785
По умолчанию

Цитата:
Подскажите, эта задача имеет решение?
фрейм в новом окне если там отдельная полноценная веб страница.

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

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

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

Последний раз редактировалось Человек_Борща; 02.02.2016 в 18:47.
Человек_Борща вне форума   Ответить с цитированием
Старый 02.02.2016, 18:59   #3
Serge_Bliznykov
МегаМодератор
СуперМодератор
 
Регистрация: 09.01.2008
Сообщений: 25,855
Репутация: 5617
По умолчанию

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

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

Цитата:
Грубо говоря, пускай сервер генерирует некий кусок HTML, который вставится в div и будет нормально отображаться. А этот div можно потом как-то красиво показать, тут уже масса вариантов. Я пользуюсь jQuery.UI Dialog компонентом.
Вот, эту вашу мысль я понял. Но, боюсь, что это потребует полностью переписать содержимое загружаемых страниц. Что мне совсем-совсем не хочется (да и времени столько мне не дадут!)

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


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

Serge_Bliznykov вне форума   Ответить с цитированием
Старый 02.02.2016, 19:26   #4
Alex11223
Модератор
Заслуженный модератор
 
Аватар для Alex11223
 
Регистрация: 12.01.2011
Сообщений: 19,016
Репутация: 3738

icq: 512-765
skype: alexp.frl
По умолчанию

Наверно имелось в виду, что в содержимое диалога jQuery (или чем вы модальное окно выводите) можно положить iframe.
Alex11223 на форуме   Ответить с цитированием
Старый 02.02.2016, 21:59   #5
Naive
Раздолбайских Дел
Профессионал
 
Аватар для Naive
 
Регистрация: 22.05.2009
Адрес: Екатеринбург
Сообщений: 3,808
Репутация: 2359
По умолчанию

Борщ в целом все правильно сказал, тут три основных идиологически разных варианта:
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)
__________________
Работаю. В этот раз за деньги.
Жду ваши искренние спасибы на яндекс-кошелек: 410011068154587

Последний раз редактировалось Naive; 02.02.2016 в 22:09.
Naive вне форума   Ответить с цитированием
Старый 02.02.2016, 22:53   #6
Человек_Борща
Профессионал
 
Аватар для Человек_Борща
 
Регистрация: 30.12.2009
Адрес: Республика Беларусь, г. Минск
Сообщений: 11,432
Репутация: 2785
По умолчанию

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

Смотрите:
Пускай у нас некое отображение таблицы из БД в веб, в 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 не панацея, просто удобный способ показывать диалоговые окна, которые можно перемещать, с кнопками, событиями и т.д. и т.п.

Последний раз редактировалось Человек_Борща; 02.02.2016 в 23:10.
Человек_Борща вне форума   Ответить с цитированием
Старый 02.02.2016, 23:46   #7
Naive
Раздолбайских Дел
Профессионал
 
Аватар для Naive
 
Регистрация: 22.05.2009
Адрес: Екатеринбург
Сообщений: 3,808
Репутация: 2359
По умолчанию

Большая пролема в том, что многие дятлы, когда пишут код не осознают, что они подкладывают падлу действительно адекватному программисту.
Тут я снимаю шляпу перед PHP, они знали кто будет юзать их язык. А теперь, даже в CSS можно так насрать, что убераешь говно - полсистемы не работает, вернешь - надо как-то обходить. Реально пукан разрывает.
__________________
Работаю. В этот раз за деньги.
Жду ваши искренние спасибы на яндекс-кошелек: 410011068154587
Naive вне форума   Ответить с цитированием
Старый 03.02.2016, 00:10   #8
Человек_Борща
Профессионал
 
Аватар для Человек_Борща
 
Регистрация: 30.12.2009
Адрес: Республика Беларусь, г. Минск
Сообщений: 11,432
Репутация: 2785
По умолчанию

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

Согласен, когда приходится переписывать чужой код, остаётся только тихо матерится. Про PHP не понял, проблема скорее в плотнике, а не в молотке.
CSS - отдельная тема. Меняется кусками, неравномерно, ущербно, тут уже зоопарк браузеров виновен.
Человек_Борща вне форума   Ответить с цитированием
Старый 03.02.2016, 00:55   #9
Вадим Мошев

Заслуженный модератор
 
Аватар для Вадим Мошев
 
Регистрация: 12.11.2010
Адрес: programmersforum
Сообщений: 8,364
Репутация: 4056
По умолчанию

Цитата:
Про PHP не понял
Это был камень в огород PHP
Вадим Мошев на форуме   Ответить с цитированием
Старый 03.02.2016, 12:10   #10
Naive
Раздолбайских Дел
Профессионал
 
Аватар для Naive
 
Регистрация: 22.05.2009
Адрес: Екатеринбург
Сообщений: 3,808
Репутация: 2359
По умолчанию

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

Опции темы

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.

Быстрый переход

Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Анимация на модальном окне Alex870 HTML и CSS 1 13.08.2015 20:09
форма обратной связи в модальном окне Zugelman JavaScript, Ajax 1 12.10.2014 02:28
Регистрация пользователей в модальном окне alnik-75 PHP 2 12.02.2012 20:01
Проблема с (авторизация в модальном окне) Vitaliy> JavaScript, Ajax 5 20.07.2011 07:14
Вывод результата работы скрипта в модальном окне snikers987 JavaScript, Ajax 2 06.06.2011 23:27


20:33.


Powered by vBulletin® Version 3.8.11
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.