Unexpected token < exception when I set charset="utf-8" in js file - javascript

I have book.jsp and book.js file. I was trying to set charset in js file like below.
<script src="/js/view/page1/main/book/book.js" type="text/javascript" charset="utf-8"/>
Jsp content loading without issue but getting below exception in the console while trying to load js file for that page.
Uncaught SyntaxError: Unexpected token <

You need to make sure to close the tag.
<script src="/js/view/page1/main/book/book.js" type="text/javascript" charset="utf-8"></script>

Related

`Uncaught SyntaxError: Unexpected token <` when referencing existing javascript file

Important edit at bottom of some strange behavior.
I'm trying to include a javascript file into my html via a <script> tag and I'm getting the error Uncaught SyntaxError: Unexpected token <
In case it matters, I'm using the Velocity templating engine.
Any help is greatly appreciated!
Here is my directory structure.
Here is my index.vm file.
<html lang="en">
<head>
<meta charset="utf-8">
<title>Velocity Demo</title>
</head>
<body>
<input type="text" onkeydown="filter(this)"></input>
#foreach ($person in $personList)
<div>
<h4>$person.name</h4>
</div>
#end
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="../static/js/filter.js"></script>
</body>
</html>
And here is the javascript file.
function filter(element) {
$.ajax({
url: '/updateFilter?filter=' + element.value,
success: location.reload(true),
error: location.reload(true)
})
}
Editing to add this image. For some reason this is the filter.js file when I inspect the sources in Chrome.
EDIT: For some reason, every request other than the one I have mapped to the controller, including filter.js, is returning the raw html from index.vm
You have an unnecessary closing tag for your element - pasting your html into plnkr highlights this.
I would also perform a "trial and error" process of elimination, as it may not be the inclusion of the JS file that is the cause.

Riot custom tag not loading (hello world example)

I have the most basic possible custom tag, but it's not mounting. Also if I use riot.mount('*') I get this error in riot.min.js
Uncaught SyntaxError:
Failed to execute 'querySelectorAll' on 'Document': The provided selector is empty.
Compiled Tag
riot.tag('test', '<div>Hello world!</div>', function(opts) {
});
Index file:
<!doctype html>
<html>
<head></head>
<body>
<test></test>
<script src="https://cdn.jsdelivr.net/riot/2.2/riot.min.js"></script>
<script src="tags/test.js" type="riot/tag"></script>
<script>riot.mount('test')</script>
<!-- <script>riot.mount('*')</script> throws error -->
</body>
</html>
Oh was mixing the pre-compiled and browser compiled syntax. After removing type="riot/tag" from my tag reference it mounted correctly.

While changing the JS script folder, getting the error "Uncaught SyntaxError: Unexpected token <" and "MIME type text/html"

I'm using dialogFx script with a customized JS named classie.js. I've put both dialogFx script and the classie.js inside a folder and it works perfect. Everything is fine, until I move classie.js to another folder.
Path to files looks like:
sitepath/JS/dialog/dialogFx.js
sitepath/JS/dialog/classie.js
The problem occurs when I move the classie.js to:
sitepath/JS/classie.js
or even :
sitepath/JS/somefolder/classie.js
The error in chrome console is :
classie.js:1 Uncaught SyntaxError: Unexpected token <
(index):56 Resource interpreted as Script but transferred with MIME type text/html: "sitepath/JS/classie.js".
When I checked the line which it refers to (classie.js:1), it's the first line of HTML where <!DOCTYPE html> starts.
This is how I include scripts in my header of page:
<head>
<script src="JS/dialog/classie.js" type="text/javascript"></script>
<script src="JS/dialog/dialogFx.js" type="text/javascript"></script>
</head>

Jsp expression language not evaluated in .js files

I am making a Java EE 6 application and using Glassfish 3.1.2.2.
I wan't to use EL inside a jquery script, stored in a sepparate .js file but I can't get it to work. This is the script:
$(document).ready(function(){
$("select#classLabel").change(function(){
var unsetList = ${classyJson};
var chosen = $("select#classLabel").val();
$("select#classSubLabel").val(chosen);
});
});
And I get the following error message from netbeans:
"subLabelSet.js: Expected ; but found {
Expected semicolon ; after 'classy'.
The global variable 'classy' is not declared."
The same script works fine if I put it directly in the .jsp file like this:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Titly</title>
<script type="text/javascript" src="js/jquery-1.10.2.js" ></script>
<script type="text/javascript" src="js/generateSavedSearchTable.js" ></script>
<script type="text/javascript" src="js/subLabelSet.js" ></script>
<script>
$(document).ready(function(){
$("select#classLabel").change(function(){
var unsetList = ${classyJson};
var chosen = $("select#classLabel").val();
$("select#classSubLabel").val(chosen);
});
});
</script>
</head>
This reminded me of a problem I had before where I couldn't get the EL to evaluate inside files ending in '.jspf'. This I fixed by adding:
<jsp-property-group>
<description>Used to enable interpretation of EL in jspf files</description>
<display-name>jspf</display-name>
<url-pattern>/WEB-INF/jspf/*</url-pattern>
</jsp-property-group>
in the web.xml file. But when I try to do the same for .js files:
<jsp-property-group>
<description>Used to enable interpretation of EL in javascript files</description>
<display-name>javascript</display-name>
<url-pattern>/js/*</url-pattern>
</jsp-property-group>
I does not work and I get the following error:
SEVERE: PWC6117: File "C:\S1\Documents\netbeansprojects\UI\build\web\js\generateSavedSearchTable.js" not found
SEVERE: Error compiling file: C:\S1\GlassFish_Server\glassfish\domains\domain1\generated\jsp\UI\org\apache\jsp\js\jquery_002d1_10_2_js.java
WARNING: StandardWrapperValve[jsp]: PWC1406: Servlet.service() for servlet jsp threw exception
org.apache.jasper.JasperException: PWC6033: Error in Javac compilation for JSP
PWC6199: Generated servlet error:
code too large for try statement
PWC6199: Generated servlet error:
code too large for try statement
PWC6199: Generated servlet error:
code too large
at org.apache.jasper.compiler.DefaultErrorHandler.javacError(DefaultErrorHandler.java:129)
at org.apache.jasper.compiler.ErrorDispatcher.javacError(ErrorDispatcher.java:299)
at org.apache.jasper.compiler.Compiler.generateClass(Compiler.java:392)
at org.apache.jasper.compiler.Compiler.compile(Compiler.java:453)
at org.apache.jasper.JspCompilationContext.compile(JspCompilationContext.java:625)
at org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:375)
at org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:473)
at org.apache.jasper.servlet.JspServlet.service(JspServlet.java:377)
at javax.servlet.http.HttpServlet.service(HttpServlet.java:770)
at org.apache.catalina.core.StandardWrapper.service(StandardWrapper.java:1550)
at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:281)
at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:175)
at org.apache.catalina.core.StandardPipeline.doInvoke(StandardPipeline.java:655)
at org.apache.catalina.core.StandardPipeline.invoke(StandardPipeline.java:595)
at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:161)
at org.apache.catalina.connector.CoyoteAdapter.doService(CoyoteAdapter.java:331)
at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:231)
at com.sun.enterprise.v3.services.impl.ContainerMapper$AdapterCallable.call(ContainerMapper.java:317)
at com.sun.enterprise.v3.services.impl.ContainerMapper.service(ContainerMapper.java:195)
at com.sun.grizzly.http.ProcessorTask.invokeAdapter(ProcessorTask.java:860)
at com.sun.grizzly.http.ProcessorTask.doProcess(ProcessorTask.java:757)
at com.sun.grizzly.http.ProcessorTask.process(ProcessorTask.java:1056)
at com.sun.grizzly.http.DefaultProtocolFilter.execute(DefaultProtocolFilter.java:229)
at com.sun.grizzly.DefaultProtocolChain.executeProtocolFilter(DefaultProtocolChain.java:137)
at com.sun.grizzly.DefaultProtocolChain.execute(DefaultProtocolChain.java:104)
at com.sun.grizzly.DefaultProtocolChain.execute(DefaultProtocolChain.java:90)
at com.sun.grizzly.http.HttpProtocolChain.execute(HttpProtocolChain.java:79)
at com.sun.grizzly.ProtocolChainContextTask.doCall(ProtocolChainContextTask.java:54)
at com.sun.grizzly.SelectionKeyContextTask.call(SelectionKeyContextTask.java:59)
at com.sun.grizzly.ContextTask.run(ContextTask.java:71)
at com.sun.grizzly.util.AbstractThreadPool$Worker.doWork(AbstractThreadPool.java:532)
at com.sun.grizzly.util.AbstractThreadPool$Worker.run(AbstractThreadPool.java:513)
at java.lang.Thread.run(Thread.java:724)
Any ideas on what is going wrong and if/how I can fix it?

Major issue with running d3.v3.js

I have made a html file based on: http://jsfiddle.net/kaliatech/4TMMD/
at the begning of my file, I have added:
<script src="data/d3.v3.js"></script>
<script src="data/nv.d3.min.js"></script>
<script src="data/nv.d3.js"></script>
<script src="data/tooltip.js"></script>
but I see this error: Error:
Invalid value for <circle> attribute cx="NaN" d3.v3.js:663
attrFunction.
Uncaught TypeError: Cannot read property '0' of undefined d3.v3.js:4157
So the tooltip cannot be shown. How is it possible that d3.v3.js has this error! Why do I recieve this error?
I believe you need to add a charset attribute so that the utf-8 characters in d3.v3.js are decoded correctly by your browser. This is the script tag recommended at http://d3js.org:
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>

Categories