0

The background: I am trying to build a website using JSF and xhtml for university, deploying Eclipse EE as my IDE. At the moment, I am trying to find a way to include a "header.xhtml" in my "index.xhtml" in a way that works both offline (Tomcat 8 as part of Eclipse) and online (an online server by the German provider "Alfahosting").

When trying to include the "header.xhtml" (located in the same directory as the index.xhtml) via Javascript, it works fine offline, while online it doesnt (just shows the page without the header, as visible here: http://danielmethner.com/ ) However, JavaScript itself DOES work when used on the webseite, as I found out by including a "hello world"-alert which works fine online and offline.

The index.xhtml bit with Javascript is here:

<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html>

<!--=============== Doctype Declaration =================-->

<html xmlns="http://www.w3.org/1999/xhtml"
        xmlns:f="http://xmlns.jcp.org/jsf/core"
        xmlns:h="http://xmlns.jcp.org/jsf/html"
        xmlns:ui="http://java.sun.com/jsf/facelets">

<!--==================== Header =========================-->
<h:head>
    <h:outputStylesheet library="css" name="body.css"/>  
    <title>Web Development Project</title>

    <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
    <script type="text/javascript">
        $(function(){
            $("#header").load("header.xhtml"); 
            $("#footer").load("footer.xhtml"); 
        }); 
    </script>
    <div id="header"></div>
    <style>
        #index {
            font-weight: bolder;
        }
    </style>
</h:head>

The alternative I've found on the internet was iframe (which I used in the footer of the page in the link). However, iframe does not work offline but only online. When used offline, it moves every time I click on it. When using online instead, it doesnt move anymore but it opens any links in the same window (which seems to be inherent of iframe?).

So basically, I was wondering if anyone knows why this piece of javascript would work offline on my localhost but not online?

Or if I should maybe concentrate fully on iframe instead or even use a different approach which I don´t know yet?

ps. Please excuse any formal & language mistakes in this post since this is my first question asked on stackoverflow (and I'm a "foreigner"). Also I am aware that there have been quite a number of similar questions, which I have done research on for two days straight now so here I am asking one of these questions again.

Either way, many thanks Your help!

EDIT: I just realised that my question looks a bit like an ad-post. If I should remove the external links/ the name of my online provider I shall be happy to do so.

Daniel Methner
  • 509
  • 1
  • 6
  • 18
  • The link to the header that is not shown in the example is http://danielmethner.com/header.xhtml – Daniel Methner May 18 '16 at 08:48
  • The best practice is to use instead of – Radhakrishna Sharma Gorenta May 18 '16 at 08:57
  • Your technical problem is answered in abovelinked duplicate. Your http://xyproblem.info is answered here: http://stackoverflow.com/q/4792862 – BalusC May 18 '16 at 09:10
  • So the tag in the index.xhtml would be and the JavaScript code in the separate file "jquery.js" in the directory "resources/js/" would be $(function(){ $("#header").load("header.xhtml"); $("#footer").load("footer.xhtml"); }); ? – Daniel Methner May 18 '16 at 09:10

0 Answers0