I got a page running SilverStripe 3.1.

My HomePage has a content <div>. When I click on a menu <a> it loads the pages content into the content <div> via AJAX (see below).

This works fine.

My Root Page is a Redirector Page.

So I call / and it redirects me to /HomePage/. Works.

Now I click through my subpages which are loaded via AJAX. Works.

I use the history.js to achieve something like this when a subpage is loaded via AJAX: /HomePage/Subpage1/ This works too.

Now: If a user calls /HomePage/Subpage1/ directly I get the plain HTML which should be loaded into the content div via Ajax (which is logical but not nice).

I thought about checking if the call isAjax(). Implemented this. Works.

Now the challenge is to get the /HomePage/Subpage1/ URL, decide if it's AJAX or not (this part works) and call /HomePage/ PLUS the Javascript function to do the Ajax request.

I really really appreciate your help! Thank you all!

Here's some code:

(P.S. page/1 => Subpage is a news page with pagination ..., it does /HomePage/SubPage/page/1)

This is the JS of the /HomePage/
.link - classes are the menu where you can navigate through all subpages.

$(document).ready(function() {
$(".link").click(function(e) {
if ($(this).hasClass("SubPage")) {
e.preventDefault();
var content = $(this).attr("href")+'page/1';
history.pushState('', '', content);
$(".subcontent").load(content);
$(".link").removeClass("current");
$(this).addClass("current");
}
});

$(function() {
$(document).ajaxStart(function() {

});
$(document).ajaxStop(function() {

});
});
});