Barrating is not a function - javascript

i have a file where i call functions collectively. This file contains the following code. i get error on non-library(jquery.barrating.min.js) pages running this code.
error i got "barrating is not a function error".
how can i get the code to run if only this function exists?
$(function() {
$('#example').barrating({
theme: 'fontawesome-stars'
});
});

If you want to run this code only if this function exists, you can test its presence in the jQuery prototype:
if (jQuery.prototype.barrating) {
// Your code goes here
}

Related

How to resolve this error type 'Uncaught TypeError: (...) is not a function'?

I am aware of the another question like this on stackoverflow and have looked at it, but it doesn't answer/resolve my situation that I'm having from which the error has occurred.
I'm trying to make both scripts, embed.js (plugin) & more-content-arrow.js (my script) work properly on the page when the document loads. When and if I remove either script, one or the other will work but not both scripts together. When the page finishes loading first, it will load the more-content-arrow.js properly, then when it is trigged again by a scrolling event, it will give off this error message in the console browser:
VM249 embed.js:2 Uncaught TypeError: ((fe.event.special[s.origType] || (intermediate value)).handle || s.handler).apply is not a function
at dispatch (VM249 embed.js:2)
at m.handle (VM249 embed.js:2)
I tried to resolve it by adding a jQuery.noConflict();, but that doesn't work as I assume it could be a conflict between the two scripts. The only way I found out to get rid of the error message is removing one of the two scripts file or removing $.getScript(...), but I don't want to do that. I want to be able to keep both scripts running properly in the page.
JS:
$(document).ready(function(){
//jQuery.noConflict();
$.getScript("more-content-arrow.js", function(){
alert("arrow script loaded and executed.");
});
});
I recreated a jsfiddle with the uncaught type error here:
https://jsfiddle.net/wr6cc2ct/2/
Your error appears it be in your more-content-arrow.js file, you were passing an integer as a third argument which is not a handler, here is the jquery doc for .on()
$(window).on('scroll', function () {
if (!footerIsVisible) {
$('.bounce').fadeIn(300);
}
}); // <--- removed integer here.
Update
Alternatively, you can use event.stopPropagation(); along with re-ordering the jquery.unevent.js script after the ember.js script.
$(window).on('scroll', function (e) {
e.stopPropagation();
if (!footerIsVisible) {
$('.bounce').fadeIn(300);
}
}, 800);

can plain javascript and jQuery be minified in one file

I have a js file that is written in jQuery (3.1.0) and just one line plain javascript.
for example:
$(window).on('load',function(){
var email = $('#email');
function setMessage(str){
document.getElementById('email').setCustomValidity(str);
};
email.bind('keyup',function(){
if(email.val()==''){
setMessage('Box is Empty');
}
});
});
It worked fine when it was like this.
Next step is minify the js file, that's when problem starts where console keeps on screaming Uncaught TypeError: Cannot read property 'setCustomValidity' of null - jquery-3.1.0.min.js.
Sources I used:
setCustomValidity
Make sure semi-colon - Checked
Rather than using window.onload using document.ready
Refer this for difference between onload and document.ready as the error which you are facing is due to the element not loaded and you are trying to access element before document is fully loaded
https://stackoverflow.com/a/3698214/1569443
Use below code
$('document').ready(function(){
var email = $('#email');
function setMessage(str){
document.getElementById('email').setCustomValidity(str);
};
email.bind('keyup',function(){
if(email.val()==''){
setMessage('Box is Empty');
}
});
});

TypeError: document.observe is not a function

in my js file i wrote like this
document.observe("dom:loaded", function() {
add();
});
but it show error TypeError: document.observe is not a function
I am using rails 3 & jquery-ui-1.10.0
can any one tell me why i am getting like this ?
Thanks in advance
As rails 3 uses jquery and you are writting code in prototype. That might creating issue here.
So try convert your code in jquery. Your code might look like.
$( document ).ready(function() {
// Run code
});
But consider below and make your changes as per your need
$(window).load(function(){
// Run code ##It will run the js after the whole page is loaded.
});
$(document).ready(function(){
// Run code ##It will run the js just after the loading of DOM.
});

Uncaught TypeError: undefined is not a function - jQuery

I have problem with website slide. after clicking on inspect element in chrome i get massage
"Uncaught TypeError: undefined is not a function" in file custom.js
here is file code
jQuery(document).ready(function() {
jQuery('#slider').nivoSlider({pauseTime: 4500}); });
}
here is website address http://myisraeltoday.com using WordPress
Theme: http://wordpress.org/themes/effect
Help needed
That means that you're calling something as a function (or method), when in fact it doesn't exist. You're calling three functions:
jQuery
jQuery(document).ready
jQuery('#slider').nivoSlider
The third of these is most likely the problem.
try changing your code to this :
$(document).ready(function() {
$('#slider').nivoSlider({'pauseTime': 4500});
});
PS : Note the }); at the end not just the $

Javascript: Random "Object has no method" error even with jquery.getScript()

I've been working with JavaScript and i need to call a function from another .js file.
The code works most of the time, but sometimes it gives me the error "Object has no method odometer". I've even put the code inside a call to getScript() to make sure it's loaded before it tries to call the odometer() function, but I'm still getting random errors.
Heres the code:
var updateDisplay = function(){
console.log("refreshing Odometers");
$.getScript("/odometer.js", function(){
$.getJSON(
'/getData',
{
product: '',
unit: unitSelection(),
period: salesPeriod(),
reportBegin: $("#datepickerfrom").val(),
reportEnd: $("#datepickerto").val()
},
function(data){
$(".odometer").odometer({
odometerData:data
});
});
});
};
I am getting an error on this line:
$(".odometer").odometer({
odometerData:data
});
It says "object has no method odometer".
I am using the Play framework for development and I've already imported jQuery and my other JavaScript files in the HTML page.
Here's my JS import order:
jquery
odometer.js (even i use getScript, i've put it there just to make sure)
main.js (which the given code resides in..)
What am I doing wrong?
Thanks for helping....
I think
$(".odometer").odometer({...})
is called before odometer extends to jQuery, flow may be like this
$(".odometer").odometer({...}); // first called
$.fn.odometer = function(){...}; // later it was extended to jQuery
seems like its a problem with ajax caching settings.
i've found the answer from this question:
jquery ajax bug
after adding
$.ajaxSetup({ cache: true });
the getScript works fine. thanks for spnding your time guys :)

Categories

Resources