CODEWITHSUNDEEP
javascriptjsf
Isma90
Isma90

Reputation: 661

jsf and javascript, are incompatible?

I'm migrating an html to jsf file, but a script fails, that worked in html mounted in the wamp server.

CODE:

> <h:head>
>         <meta charset="utf-8"/>
>         <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
>         <title></title>
>         <meta name="description" content=""/>
>         <meta name="viewport" content="width=device-width, initial-scale=1"/>
>         <link rel="stylesheet" href="../css/media-queries.css" media="screen" />
>         <script type="" src="../js/vendor/modernizr.2.6.2.min.js"></script>
>         <script type="" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
>         <script type="text/javascript">window.jQuery || document.write('<script
> src="../js/vendor/jquery-1.8.0.min.js"><\/script>')</script> <!--  This is the line 21 -->
>         <script type="" src="../js/jquery.mobile.min.js"></script>
>         <script type="" src="../js/jquery.dataTables.min.js"></script>
>         <script type="" src="../js/jquery.formCharmer.js"></script>
>         <script type="">if(Modernizr.csstransitions){document.write('<link
> rel="stylesheet" href="../css/charmerAnimation.css"/>')}</script>
>         <!--[if (gte IE 6)&(lte IE 8)]>
>             <script src="../js/selectivizr.min.js"></script>
>         <![endif]-->
>         <!--[if lte IE 9]>
>             <script src="../js/css3-mediaqueries.js"></script>
>         <![endif]-->
>     </h:head>

ERROR:

HTTP Status 500 - Error Parsing /content/contentA.xhtml: Error Traced[line: 21] The content of elements must consist of data markers or a correct format.

This is the HTML code:

<head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="../css/media-queries.css" media="screen" />
        <script src="../js/vendor/modernizr.2.6.2.min.js"></script>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
        <script>window.jQuery || document.write('<script src="../js/vendor/jquery-1.8.0.min.js"><\/script>')</script>
        <script src="../js/jquery.mobile.min.js"></script>
        <script src="../js/jquery.dataTables.min.js"></script>
        <script src="../js/jquery.formCharmer.js"></script>
        <script>if(Modernizr.csstransitions){document.write('<link rel="stylesheet" href="../css/charmerAnimation.css">')}</script>     
        <!--[if (gte IE 6)&(lte IE 8)]>
            <script src="../js/selectivizr.min.js"></script>
        <![endif]-->
        <!--[if lte IE 9]>
            <script src="../js/css3-mediaqueries.js"></script>
        <![endif]-->
    </head>

Upvotes: 0

Views: 583

Answers (1)

BalusC
BalusC

Reputation: 1109715

Facelets is a XML based view technology. < and > are reserved characters in XML, indicating start and end of an element. However, you're attempting to output it plain vanilla as part of a JavaScript string variable. You need to represent them as &lt; and &gt; instead. 

<script>window.jQuery || document.write('&lt;script src="../js/vendor/jquery-1.8.0.min.js"&gt;&lt;\/script&gt;')</script>

The same applies to the & character further down in the code, which represents the start of an entity. You've by the way a new problem with the IE conditional comment once you fix this which is answered here: <!--[if IE]> conditional comments are rendered HTML-escaped in Facelets.

Upvotes: 2

Related Questions