jqplots scripts are not getting read in html files - javascript

I have below scripts included in my html file
<!doctype html>
<html>
<head>
<script type="text/javascript" src="dist/jquery.min.js"></script>
<script type="text/javascript" src="dist/jquery.jqplot.min.js"></script>
<script type="text/javascript" src="dist/plugins/jqplot.barRenderer.min.js"></script>
<script type="text/javascript" src="dist/plugins/jqplot.pieRenderer.min.js"></script>
<script type="text/javascript" src="dist/plugins/jqplot.categoryAxisRenderer.min.js"></script>
<script type="text/javascript" src="dist/plugins/jqplot.pointLabels.min.js"></script>
<link rel="stylesheet" type="text/css" href="dist/jquery.jqplot.min.css" />
</head>
<body>
.
.
</body>
</html>
but config,BarRenderer etc. functions are not getting identified & I am getting error in console:
Uncaught TypeError: Cannot read property 'config' of undefined
I identified this is due to html file not able to read those script. because if I comment all above script & run the code I get the same error.
My src path is correct. Can anyone please help me why this scripts are not being read & getting below error.

This might be too obvious but here it goes: the jquery.min.js script is usually identified by the version number.
Could it be that it is not finding the jquery script?

Related

Runtime error" '$' is undefined after formatting pc

I have a project written in C# ASP.net. jQuery have worked well before format computer. I have reinstall windows 7 on pc then install VS 2012 again. I run project then give this error
JavaScript runtime error '$' is undefined
I don't change anything. I referenced jQuery top of aspx file.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<title></title>
<link rel="stylesheet" type="text/css" href="css/site.css" />
<link rel="stylesheet" href="Content/themes/base/jquery-ui.css"/>
<style>
.ui-datepicker-trigger { position:relative;top:0px ;left:2px ; height:16px;width:16px;vertical-align:middle; }
/* {} is the value according to your need */
</style>
<script type="text/javascript" src="js/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.12.0.js"></script>
<script type="text/javascript" src="js/jquery.maskedinput.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
SOLUTION
I have found solution like this
Please check with your physical location of jQuery file.
or try to add CDN of jQuery as below.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
You should change the path of the jquery libs to relative like this:
<script type="text/javascript" src="~/Scripts/js/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="~/Scripts/js/jquery-ui-1.12.0.js"></script>
<script type="text/javascript" src="~/Scripts/js/jquery.maskedinput.min.js"></script>
You then will have to make a folder(if it doesn't exist) named Scripts and subfolder(if it doesn't exist) named js and place your jquery libs inside.

angular js injector modulr error

I'm trying to run this AngularJS example of a tutorial and the console says: Uncaught Error: [$injector:modulerr] when using restangular
Where is the problem?
<html >
<head>
<script src="../bower_components/angular/angular.min.js" type="text/javascript"></script>
<script src="../bower_components/underscore/underscore.js" type="text/javascrixpt"></script>
<script src="../bower_components/restangular/dist/restangular.js" type="text/javascrixpt"></script>
<script src="../bower_components/angular-route/angular-route.js" type="text/javascript"></script>
<script type="text/javascript" src="ang.js"></script>
<script src="../bower_components/jquery/dist/jquery.min.js"></script>
<script>
var app=angular.module('angular',['ngRoute','restangular']);
</script>
You need to check path to restangular.js. Also include jquery.js before angular.js.

Uncaught TypeError: undefined is not a function

I have checked a lot of forums, but i did't find a solution.
site -> http://dszerszen.pl/domi/
and this code
<script type="text/javascript">
$(document).ready(function(){
$(".info").tytabs({
tabinit:"1",
fadespeed:"fast"
});
});
</script>
icon switcher dosent work
Simply rearrange your scripts in this order:
<script type="text/javascript" src="jquery.min.js"></script>
<script src="modernizr.custom.63321.js"></script>
<script type="text/javascript" src="tytabs.jquery.min.js"></script>
<script src="scrolltop.js" type="text/javascript"></script>
<script async src="analytics.js"></script>
The jQuery core library should be included first followed by the other plugin code.
You have defined scrollTop.js in two places.
One is at the top of css files. And jquery is not loaded before that. That's why you are getting error.
<title>Smykke Galleriet</title>
<link type="text/css" rel="stylesheet" href="stylesheet.1.css" />
<script src="scrolltop.js" type="text/javascript"></script>
Remove that line and it will work properly.

How can I properly add CSS and JavaScript to an HTML document?

This very well might be a very stupid question.
I'm trying to add an empty CSS file, an empty JavaScript file and the jQuery library into the most basic of HTML files, as follows:
<html>
<head>
<title>Testing</title>
<link rel="stylesheet" type="text/css" href="theme.css">
<script language="javascript" type="text/javascript" src="jquery-2.0.3.js" />
<script src="application.js" />
</head>
<body>
<h1 class=test>This is a test! Hello, world!</h1>
</body>
</html>
However, it doesn't work. The h1 doesn't display in my browser when the link or any of the scripts are present, but displays normally otherwise.
What am I doing wrong here? Why doesn't this work, and how can I make it work?
Thank you very much,
Eden.
Your <script> tags cannot be self closing. Try changing them to look like <script src="..." type="text/javascript"></script>
two things. script tags should have an end tag.
<script language="javascript" type="text/javascript" src="jquery-2.0.3.js" /></script>
<script type="text/javascript" src="application.js" /></script>
Another thing, see if you are navigating to the right file. Assume that your directory tree is the next
directory
|-yourHTMLpage.html
|-jquery-2.0.3.js
|-application.js
\-theme.css
then the next will work
<script language="javascript" type="text/javascript" src="jquery-2.0.3.js" />
<script type="text/javascript" src="application.js" /></script>
<link rel="stylesheet" type="text/css" href="theme.css">
But in most recent standards, we are using a folder for css and js files, like the next
directory
|-yourHTMLpage.html
|-js
|-jquery-2.0.3.js
\-application.js
\-css
\-theme.css
Then you have to adapt the link,
<script language="javascript" type="text/javascript" src="js/jquery-2.0.3.js" />
<script type="text/javascript" src="js/application.js" /></script>
<link rel="stylesheet" type="text/css" href="css/theme.css">
Notice the "js/" addition for javascript files and "css/" addition for css files. HTML will navigate from its directory to the said file. But if the file isn't there as the source element is telling, then the page won't load the said file.
Are the css and js files in the same folder as your html ?
To see what is wrong, try a developper console to see what requests are sent (Press 'F12' on chrome or install the firebug extension on Firefox). There should be a "Network" tab that shows what files are requested and if your browser does or doesn't find them.
Are you sure that the path to the several files is correct? If it is, is the class of the h1 spelled correctly?
You should embed the javascript files like this:
<script language="javascript" type="text/javascript" src="jquery-2.0.3.js"> </script>
<script language="javascript" type="text/javascript" src="application.js"> </script>
Here is the simple method for include css and javascript file to your page.
<link rel="stylesheet" type="text/css" href="YOUR FILE PATH">
<script src="YOUR FILE PATH" type="text/javascript"></script>

jalert not working

I have following script:
<script type="text/javascript" src="jquery-1.8.2.js"></script>
<script type="text/javascript">
jAlert("message","title");
</script>
in my html head.but the dialog is not showing up when I load the page(it would if I simply use alert).
where did I do wrong? Am I missing the corresponding js files?
edit: I included the jquery.alerts.js file.it is still not working.
edit: I added this line and put the file in the dir
<script type="text/javascript" src="jquery.alerts.js"></script>
Yes I put it inbetween.
I opened the browser console and saw this:
"Uncaught TypeError: Cannot read property 'scrollHeight' of null jquery-1.8.2.js:9405"
jAlert isn't a part of native jQuery.
You can find the project page here, the download link is at the bottom.
Make sure you include it straight after jQuery - your code should look as follows:
<link rel="stylesheet" type="text/css" href="jquery.alerts.css" />
<script type="text/javascript" src="jquery-1.8.2.js"></script>
<script type="text/javascript" src="jquery.alerts.js"></script>
<script type="text/javascript">
$(document).ready(function(){
jAlert("message","title")
});
</script>

Categories