Load an 'add page' screen in Modal frame (Lightbox), a kick-start example
We are working on a Drupal project that uses a lot of dialog in Modal frame
This really awesome module provides a 'lightbox' feature, where you can load all content you want dynamicly. We especially use it for dialog screens, like:
Login
Sign up
Add articles
Modal Frame Contrib Package
There also is a 'Modal Frame Contrib Package', this module package provides examples of how modal frame can be used in you Drupal websystem. The one example that I missed is: how to load a custom build form with form API. Or, for this example, how to load the 'add page' screen in Modal frame.
Here is howto
Create a new module that handles you coding like for example 'cst_modalframe_addpage'. For basics add three files:
- cst_modalframe_addpage.info (define your module)
- cst_modalframe_addpage.module (your allmighty code)
- cst_modalframe_addpage.js
Then place the following code in 'cst_modalframe_addpage.module' file:
/** * Implementation of hook_init(). * This is to load the modal frame for node/add/page */ function cst_modalframe_addpage_init() { modalframe_child_js(); } if ($_GET['q'] == 'dummypage'){ // optional: only load the script on certain page when needed modalframe_parent_js(); drupal_add_js(drupal_get_path('module', 'cst_modalframe_addpage') .'/cst_modalframe_addpage.js'); } }
In cst_modalframe_addpage.js, place the following code
(function ($) { Drupal.behaviors.modalFrameFilterTips = function(context) { $('a[href$="node/add/page"]:not(.dummyclass-not)', context).addClass('dummyclass').click(function() { Drupal.modalFrame.open({url: $(this).attr('href'), width: 800, height: 600}); return false; }); }; })(jQuery);
Off course, this is just a start that hopefully gives you a kickstart to coding such cases.
Because, for example, when you save the page: your whole site layout will load into the modalframe. You can solve this by altering the form redirect to a custom page that is loaded correct in modalframe.
Related links
Modal frame API
'Modal Frame Contrib Package'
Over Joris Snoek

Joris Snoek is Full time Drupal verslaafd, Project leider bij Lucius & Technology-freak. Tevens afgestudeerd in bedrijfskundige informatica en houdt veel van: muziek productie, snowboarden, tennis & fitness. En: heeft een zwak voor Duitse herders.
Over Peter Terpstra

Peter Terpstra is accountmanager bij Lucius.
Relatiebeheer en trajectbegeleiding van begin tot eind vallen onder zijn hoede.
Laatste tweet van Joris
joris_lucius: Looking into #mongodb #drupal implementation. Looks promising so far. #performance http://drupal.org/project/mongodb
Volg alle tweets van Joris