Loading errors with jQuery pickadate.js - javascript

I'm trying to use pickadate.js for a text input but I cannot get it to work on my server. I made a fiddle and it works fine, but when I copy that code over (I even put everything in the HTML box of the Fiddle so the code is 100% the same), I get the following errors
Uncaught SyntaxError: Unexpected identifier picker.js:487
Uncaught ReferenceError: Picker is not defined picker.date.js:23
Uncaught TypeError: Object [object Object] has no method 'pickadate'
Here is the code. There is absolutely no other code on the page than this.
<input type = "textbox" id="pickadate_input"></input>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src = "http://amsul.ca/pickadate.js/lib/picker.js"></script>
<script src = "http://amsul.ca/pickadate.js/lib/picker.date.js"></script>
<script>
$('#pickadate_input').pickadate()
</script>
Here is a working fiddle with the same code. Notice that there are no scripts included on the left. What would cause the different results?

Line 487 in picker.js has a weird chracter in it:
options = thingIsObject && $.isPlainObject( value ) ? value : options || {}
after the "?", take this out and it should work.

Have you tried hosting the files locally?
Is your site running https? If so, your site may not be loading insecure content since the picker resources start with http.
If you use Google Chrome, you can look at the Network tab in the Chrome Developer Tools to see if those JavaScript files are loading successfully.

Related

Wrapping words using jquery - $ is not a function

I have been trying to add a wrap element to specific words on my website. I found a Jquery solution that seems to work really well.
Solution i followed: http://jsfiddle.net/trtcN/546/
I can get it all to work exactly how i would like it to work. When is start to bring it into my website things fall away..
Ive linked to my custom js file in my child theme using the following: (... replaces the full link)
<script src="...custom.js" type="text/javascript"></script>
and my custom file contains the following code:
var oldString = 'Choose a Start Date',
newString = 'Choose a <span class="date-style-change">Start</span> Date',
newText = $('span').text().replace(RegExp(oldString,"gi"),newString);
$('span').html(newText);
However when i refresh my page nothing has changed and there is a error in developer tools console which reads:
Uncaught TypeError: $ is not a function
Do i need to add some extra code to the js file that isn't on jsfiddle i was following?
Your Jquery path is invalid. If your site can access to the cloud, just replace this script src;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
and you will figure out the problem.

adding background images in js file for website

document.body.style.backgroundImage = "url('images/background52.jpg')";<br>
I tried in this way.but it is not working properly.
You are adding a html tag <br> in your javascript, see the console and you will see an error like
Uncaught SyntaxError: Unexpected token <
Get rid of <br> and it will work.

nivo-lightbox not launching when image clicked

I believe that I have followed the instructions to setup this javascript plugin, but it does not seem to be working. (plugin: http://dev7studios.com/nivo-lightbox#/documentation)
I can see the links to the css, theme and javascript files correctly showing in my (I can see that it is correctly seeing these files too).
(i've commented out the jquery as this is already loaded for my wordpress theme.
The lightbox doesn't seem to be running though. Any tips on why this isn't picking up my images and showing them in the lightbox?
once I get this going I still need to figure out how to wrap my images with an attribute for "data-lightbox-gallery" so I can get the galleries working as well.
Image management: nextgen gallery
image layout: Justified Image Gallery
URL: http://www.sandbox.imageworkshop.com/projects/william-angliss-institute/
If you open the console on this page - you'll see that there are two javascript errors.
1.Uncaught TypeError: Property '$' of object [object Object] is not a function (index):71
I looked into the source code of your page and on line 71 you have this:
$(document).ready(function(){
$('a').nivoLightbox();
});
This means that jQuery is not working. You need to use a no-conflict wrapper.
2.Uncaught TypeError: Object [object Object] has no method 'orbit'
On this line you use .orbit() to make a home page slider... but not on the home page. You get this error because jQuery couldn't find a block with the id of #featured.
To avoid such mistakes you need to check if the block is on the page, possibly like so:
var home_slider = $('#featured');
if( home_slider [0] ) { //if jQuery object is not empty
home_slider.orbit({
//yor params here
})
}
If you get rid of these errors - you'll most likely see the nivo-lightbox :)

Cognos Report Studio: HTML Tag issue

I'm using cognos report studio and I came to an error on my prompt page. I got my coding to work right(I tested it on a blank page), but I noticed theres a yellow explanation point on the bottom left, which doesn't allow me to continue what I'm trying to do.
Here is a screenshot:
The error seems to be coming from my html tag in the prompt page.
Here is my coding:
<script type="text/javascript">
var theSpan = document.getElementById("FiscalYear");
var theSelect = theSpan.getElementsByTagName("select");
theSelect[0].options[2].selected=true; //This will make default value in prompt to be the first item after line, change the value '2' for other item
theSelect[0].options[0].text = 'Fiscal Year';
listBoxBusinessDate.checkData();
</script>
My error should be coming from there, I just can't figure out why. Any ideas on what it could be? Thanks.
This is a JavaScript error. The variable you are trying to use "listBoxBusinessDate" is null / undefined, so when you try to call a method on it (.checkData()), you get this error.
Where is this variable defined (its not in the snippet you provided, but could be defined earlier in the file)...?

document.getElementById throws TypeError

I am a bit new to Javascript. I am writing this dummy script to test out what I need for my larger page. I want, at the simplest, to get the value of href and then change the value of href and then see it again. TO keep it simple, right now I have removed the part for changing the href value and just calling the attribute value twice. But the second time I access the attribute value it show an error which I have posted below. I'm posting two error logs one from Firebug and one from Dragonfly(from Opera).
Any help would be dearly appreciated. Thanks.
One more issue I have with the script is that it never finishes loading. I always see (in Firefox 3.6.8) the little loading sign going round and round in the tab title. It doesn't bother me so much but if anyone has an idea please tell me.
<!-- This file is used to set attribute value for href. -->
<html>
<head>
<script type="text/javascript">
function hrefvalue()
{
var thisthang = document.getElementById("1").childNodes[0].getAttribute("href");
document.write(thisthang);
document.write("\n");
var newnew21 = document.getElementById("1").childNodes[0].getAttribute("href");
document.write(newnew21);
}
</script>
</head>
<body>
<div id="1">click here</div>
<button type="button" onclick="hrefvalue()">Click me instead</button>
</body>
</html>
Error logs :
1. Firebug -> document.getElementById("1") is null
2. Dragonfly ->
Uncaught exception: TypeError: Cannot convert 'document.getElementById("1")' to object
Error thrown at line 8, column 0 in hrefvalue() in
file://localhost/D:/Chicago%20pics/website%20pics/website%20root/trial5.htm:
var newnew21 = document.getElementById("1").childNodes[0].getAttribute("href");
called from line 1, column 0 in (event):
hrefvalue()
And thanks again for all the fish :D
An id can't start with a number (in HTML 4). Don't bet on browsers supporting such ids.
document.write will trash a document that isn't open. When the browser parses </html> the document is closed. Since the function runs onclick, it will be closed before you try to write. Use DOM methods to modify HTML with JS.

Categories

Resources