Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Template Questions

Modal Design


Reply

6 Posts   588 Views

Avatar
oldsql

9 March 2014 at 12:42am (Last edited: 9 March 2014 12:46am), Community Member, 6 Posts

Hey guys,
this is my first project with Silverstripe. Until now everything worked fine and I'm really happy with this CMS. But now I have no idea how to solve this problem and I hope you can help me.
Its about this Website: http://silver.bayernkruege.de/
I want that the "Bierkrüge" page always stays in the background and the other pages should look like the "Modal" page. But I have no idea how to manage that the "Bierkrüge" page is in the background.

Thanks.

Avatar
martimiz

9 March 2014 at 3:17am Forum Moderator, 1091 Posts

I'm thinking this could be done by always staying on the Bierkruge page itself and filling a modal box with other page data using AJAX? You could use an action on pages that should appear in the modelbox, and have it return the page partially rendered...

Avatar
oldsql

11 March 2014 at 5:33am Community Member, 6 Posts

Hey,

thank you. Do you know any Tutorial where this is explained ?

Avatar
martimiz

11 March 2014 at 6:43am Forum Moderator, 1091 Posts

Not really... But basically what you'd do is use jQuery to load the page url into some div container (for instance using jQuery load() )

Next make sure to render the page differently for Ajax requests, by using the index() function in the Page_Controler. Off the top of my head, something like:

public function index() {
   if ($this->request->isAjax()) {
      return $this->renderWith('PageAjaxTemplate');
   }
   else {
      return array();
   }
}

This would of course only work if javascript is enabled, so you'd have to make sure there is a fallback.

If I wanted to 'fake' it, I could probably do something like managing the Bierkruge in ModelAdmin, then have a pagetype template that is by default filled with the Bierkruge, and a covering div that plays 'modal dialog' and holds the $layout placeholder for the individual page... Something like that - but there are probably other options :)

Avatar
oldsql

14 March 2014 at 11:07pm Community Member, 6 Posts

Thank you for your answer :-)

So I managed to load page content with ajax and jquery load. But he doesn't load the child pages or the child page navigation, have you any idea how i can do this ?

Avatar
oldsql

15 March 2014 at 8:22am Community Member, 6 Posts

Hey,

okay I found a solution without ajax:

I added this to the Pages:
<% control page('bierkruege/') %>
<% control Children %>
<%--Include BierkrugElemente recursively --%>
...
...
<% end_control %>
<% end_control %>

So on every Page is the Bierkrug Page in the Background, exactly what i needed.