locked
IE 11 Compatibility View, problem with JSP, CSS, JQUERY RRS feed

  • Question

  • Hi,

    I have a project that already running on IE with compatibility view setting. Recently, I made some organization chart use JSP, CSS, and JQuery. But the chart doesn't appear correctly. All connecting lines between boxes doesn't appear. 

    For your information here the codes in my jsp :   

    <html>
    <head>
    <!doctype html>
    <%
    javax.servlet.http.HttpSession ses = request.getSession();   
    if (ses.getAttribute("TxtEmployee") == null){
    %>
    <jsp:forward page="../general/MustLogin.html"/>
    <%
    }
    %>

    <link rel="stylesheet" href="../css/demo.css"/>
    <link rel="stylesheet" href="../css/jquery.orgchart.css"/>
    <script src="../javascript/jquery.min.js"></script>
    <script src="../javascript/jquery.orgchart.js"></script>
    <script>
    $(function(){
        $("#organisation").orgChart({container: $("#main"), interactive: true, fade: true, speed: 'slow'});
    });
    </script>

    </head>

    <body bgcolor="#EFF3EF" onload="LoadFrameButton('ORGCHARTA')">
    <div id="left">

    <ul id="organisation" style=">
    <li><em>Batman</em>
    <ul>
    <li>Batman Begins<br/>
    <ul>
    <li>Ra's Al Ghul</li>
    <li>Carmine Falconi</li>
    </ul>
    </li>
    <li>The Dark Knight<br/>
    <ul>
    <li>Joker</li>
    <li>Harvey Dent</li>
    </ul>
    </li>
    <li>The Dark Knight Rises<br/>
    <ul>
    <li>Bane</li>
    <li>Talia Al Ghul</li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>

        </div>

    <div id="content">

    <h1>Organisation Chart</h1>

    <div id="main">
    </div>

    </div>
    </body>
    </html>

    Can you help me please.... 

    Thank you

    Tuesday, July 8, 2014 4:45 AM

Answers

  • Hi,

    Please start by validating your web page markup and correcting the errors.

    load your page in a web browser (preferably from a web server, not the file system).

    select the View>Source menu and copy the server source...

    then go to http://validator.w3.org and select the Direct Input tab,

    paste your markup into the textarea field on that page and then press the 'Validate' button...

    a report will be produced which will show you the markup errors on your page that you need to correct.

    ALTERNATIVELY

    Open your page in a web browser and display IT's Developer tool, select the Console tab of the Developer Tool,

    The Developer Tool of the latest versions of web browser will show you SOME critical markup errors that you need to correct....

    in your case

    your doctype declaration is AFTER the <head> block.....

    the doctype declaration MUST be the first non-comment statement in the markup...

    (IE10 and later accept preceeding comment tags to the DTD, but for backward compatibility you should ALWAYS make the DTD the first markup statement)

    to avoid confusion, please include with your questions a link to your website or a mashup that shows the issue.... as well as the markup we need to see

    1. Your response headers

    2. What version of jQuery you are using.


    Rob^_^

    Tuesday, July 8, 2014 6:23 AM