Easy Pie Chart no effects - javascript

I recently used the plugin easy-pie-chart: rendro.github.io/easy-pie-chart/
On the page, I've included the js file
<script src="vendor/easy-pie-chart-master/src/easypiechart.js"></script>
I add this code
<div class="chart" data-percent="73" data-scale-color="red">73%</div>
and recalled the plugin
<script type="text/javascript">
$(function() {
$('.chart').easyPieChart({
//your configuration goes here
});
});
</script>
It does not appear, however, no result, belonging to the number written in the normal manner.
What is the reason?
The console gives me error like:
Uncaught TypeError: Object [object Object] has no method 'easyPieChart'
Some of you could help me: I thank you all in advance

I think easyPieChart.js path is not correct ,check the path or give
<script src="http://rendro.github.io/easy-pie-chart/javascripts/jquery.easy-pie-chart.js"></script>
Fiddle

Related

Script stopped working without any recent code changes on the site

I have inherited a site and don't really understand the set-up!
The scripts on the site were all working ok then we are suddenly getting script errors and the script that entered a date in a field has stopped working.
this is at the top of the page:
<script type="text/javascript">
setURLs(//domainname/base/administration/);
</script>
I am getting this error: Unexpected end of input - what do I need to do to fix that?
Then this script:
<script>DateInput('Payment_Date', true, 'yyyy-mm-dd','2022-07-20')</script>
is giving the error DateInput is not defined and the field is not been added to the form - how do I sort that?
from the two lines of code that you shared I noticed a problem with
<script type="text/javascript">
setURLs(//domainname/base/administration/);
</script>
the // means comment so in order to make the function work you need to add some ' around it
like this
<script type="text/javascript">
setURLs('//domainname/base/administration/');
</script>

Bootstrap jQuery library conflict: Uncaught TypeError: $(...).popover is not a function(…)

I am trying to add the popover function to my code, I made it work before using almost this exact same code and lost that progress permanently, now I am unsure of what I did to fix it in the first place. I'm sure it is a simple oversight but I'm bankrupt of ideas.
I get an error in the console "Uncaught TypeError: $(...).popover is not a function(…)"
<script src="jquery-3.1.1.js"</script>
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script>
(function($){
$(document).ready(function(){
$('[data-toggle="popover"]').popover();
});
})(jQuery);
</script>
In essence, I understand the nature of the problem but am unsure of how to fix it.
please fix syntax error in script tag
old script
<script src="jquery-3.1.1.js"</script>
new script
<script src="jquery-3.1.1.js"></script>

how to resolve Uncaught TypeError: Object #<Object> has no method 'corner' in jquery?

I am using jquery round corner plugin in lifray theme in order to add round corner functionality in all kind of browsers, including IE6 to IE8. i have included the jquery round corner plugin in portla_normal.vm like this :-
<head>
<title>$the_title - $company_name</title>
<script type="text/javascript" src="/html/js/jquery/jquery.js"></script>
<script type="text/javascript" src="$javascript_folder/jquery_roundcorner.js"></script>
<script type="text/javascript" src="$javascript_folder/jquery.corner.js"></script>
$theme.include($top_head_include)
</head>
This is my jquery_roundcorner.js file, when i see on console of the browser getting the error in this file like below.
$(document).ready(function() {
$('#navigation li').corner("round 6px");
$('#navigation a').corner("round 6px");
});
I am geting following error on browser console:
Uncaught TypeError: Object #<Object> has no method 'corner'.
Can any one help me how to resolve this?
<head>
<title>$the_title - $company_name</title>
<script type="text/javascript" src="/html/js/jquery/jquery.js"></script>
<script type="text/javascript" src="$javascript_folder/jquery.corner.js"></script>
<script type="text/javascript" src="$javascript_folder/jquery_roundcorner.js"></script>
$theme.include($top_head_include)
</head>
alter the load javascript order!
you have to make sure the jquery plugin is first loaded!
in my jquery_roundcorner.js i have replaced the above code with the following code. Actually in velocity file also $ is used, there may be conflicts. so lastly i tried this, its working now.
var jq=$.noConflict();
jq(document).ready(function(){
alert('hello alert1 ');
jq('#navigation li').corner("round 6px");
jq('#navigation a').corner("round 6px");
alert('hello alert3 ');
});

Sometimes jQuery plugin is not loaded

I am using jQuery a lot, but sometimes I get stuck because my browser cannot see the jQuery library, or maybe loads the library after running the my JavaScript code.
Pseudo-code to explain my question:
<html>
<head>
I always load CSS here
I always load jquery here
</head>
<body>
<p class="link-style3"><span id="my_tag"><span>Bize Hemen Yazın</span></span></p>
<script>
$(function() {
$('#my_tag').click(function(e) {
alert('tesrt');
});
});
</script>
</body>
</html>
I always put my stuff in the order like below, but this doesn't work now. When I click the <span id="my_tag">, it doesn't do anything, and doesn't return any error.
what should I do?
Here is the entire code jsfiddle
Try to avoid some syntax errors like(suggestable only)
<script type="text/javascript">
$(function() {
$('#my_tag').click(function() {
alert('tesrt');
});
})
</script>
and put your code at the top after you load the js files
A few things you can do:
inspect your document (network pane in devtools) to see if everything
is loading correctly
Move your scripts to the bottom of the page
use $(document).ready(function(){ ... });

Aloha editor - Uncaught ReferenceError: Aloha is not defined

So this looks like a completely simple thing that I must be missing, but here goes:
I've been following the guide for Aloha editor, here.
I have included aloha.js in my page (and it is included, it is pulling down all the CSS etc).
I then have this code in my page:
<script type="text/javascript">
Aloha.ready(function(){
Aloha.jQuery('textarea.description').aloha();
});
</script>
Which throws an uncauht referenceerror.
In the console, GENTICS.Aloha is defined, but Aloha is not.
What am I missing?
<script type="text/javascript">
Aloha.ready(function(){
Aloha.jQuery('.description').aloha();
});
</script>
You only specify the CSS classname as far as I know like shown above.

Categories

Resources