Fetch content from other page in Moovweb

86 views Asked by At

I am transforming a site using Moovweb. On one of the pages I want includes content from a seperate page/url. I just want to include partial content. Presently I have two options in mind:

  1. Achieve this using AJAX, but this requires new content to be loaded once the page has loaded. The content doesn't appear to be on the page or in the source.
  2. I include an iframe with the new URL and retrieve the content using javascript once the page has loaded.

Both the above options would require parsing and manipulating the DOM once the page has loaded. Is there any way to do it using tritium so that the content is already a part of the page.

2

There are 2 answers

0
chonax On

iframe: If the content is from your site (www.yoursite.com/anotherpage.html), then yes you can transform it, by creating a special ts file for "anotherpage.html" and doing the transformations there. But as far as I know you cannot touch iframed 3rd party content (www.anothersite.com) in any way. You --might-- be able to style the new content with css, but thats something you'll just have to try.

AJAX: You can transform lateload content using CSS Animations and Javascript. Whatever you do don't use MutationObservers or DOMNodeInserted. Bad for pageload speed on mobile and old versions of IE and Android don't even recognize it.

0
vcxz On

No, that is not possible. You can not call two different pages and merge content before serving it to end user.

Only browser makes a request for page/resource to server.

You can not make request to server for additional resources/content using tritium when you are handling one. If you want to add content in your page, you can

  1. insert static content or
  2. add iframe or
  3. use ajax

Now if the content you want to insert is from another page, you can use option 2 or 3. And you can manipulate the DOM structure using tritium.

In simple words, each single request you handle comes with its own closed scope like a black box where you can manipulate the resource before serving it to browser. You can add something to it from outside(like static content) as long as you are in that black box(scope) but can not copy/use from another black box(request). I hope this can answer your question. :)