Develop Reference

$(...).modal is not a function in module

I realise this question has been asked a few times but none of the solutions in previous questions have resolved my issue.
I am trying to hide a modal using:
$('#modal').modal('hide')
but am getting:
$(...).modal is not a function
in the console.
However if I go into the developer console and enter:
$('#modal').modal('hide')
it works perfectly
I am getting jQuery/bootstrap via a CDN in the index.html and have checked the order of the imports and checked for multiple imports of jQuery.
EDIT: My jQuery/bootstrap scripts are being loaded at the top of the index.html and the JS module is included at the bottom of the page so the order seems correct. $('#modal').modal('hide') is being called on a $(window).on('resize') event

If you enter in developer console and it works means, problem with document ready issue or javascript placement issue.
just try this to confirm.
$(function(){
$('#modal').modal('hide');
});
If this working, then document ready issue.
another one is you should use this $('#modal').modal('hide'); after jquery-ui.js.
Please provide your code sample for further investigation.

FullCalendar plugin dayClick not working

I've been trying to get the dayClick in the FullCalendar plugin to work, but when I click nothing is happening. Can't figure out what it is I'm doing wrong. I click on a day, but no alert message. jsfiddle below. What am I doing wrong.
http://jsbin.com/bicawa/2/edit

I don't really know this library but you had two non-related issues in your code:
The moment script tag was placed before jQuery, my guess it should be placed after.
You had four slashes in your moment src (i.e. src="https:////...")
After fixing these two issues I got the console.log to work, but for some reason the alert() still wasn't working.

alert is turned off in JSBin. You shouldn't debug with alert because it stops code execution. While JSBin is a great tool for building quick samples, it makes debugging harder.
And as #idoberko2 says: You should put jQuery as first included script.
Here is a working JSBin

Javascript Conflicts in Console for Wordpress Plugin Global Gallery

I hope you can help me to debug my conflicts on the site I am working on:
URL: http://metalotechnika.com
PW: 12345678
If you then go to http://metalotechnika.com/foto-galeri/foto-kangjella-hekuri/
You will find a gallery that isn't loading. Most probably due to javascript conflicts. Could you pint me in the right direction here?
You will find some errors in the console: "TypeError: jQuery(...).lcweb_lazyload is not a function"
I thougt, that it must be jQuery not loading correctly. But I already tested jQuery in my main.js, and is working. Don't know about this time.

Ok, found the problem.
jQuery is loaded 2 times. And this is were the conflict came from. I just removed jQuery from my functions.php because Wordpress already loads it's own jQuery and throws conflicts if it is loaded a separate different time.
Thanks anyway.

Bootstrap Modal does not open on click

I have a problem with the bootstrap modal function.
I try to open a modal when clicking on a button. In Bootply everything works fine, but in my document it's not working and I can't see why.
I try to use the modal in the portfolio section of this page
Here is my code snippet on bootply which is perfectly working...
Any Ideas???

If you take a look in for example Chrome's DevTools console you'll notice an error message like:
Uncaught Error: Bootstrap's JavaScript requires jQuery version 1.9.1
or higher
this either means that jQuery isn't loaded or that Bootstrap's JavaScript is loaded before jQuery.
If you take a look in your head section you'll see that the latter is the case. Make sure that js/jquery-1.11.1.min.js occurs before js/bootstrap.min.js.
P.S. it might be that the modal still doesn't work after these changes, but you need to fix this first.

FancyBox Jquery Null Error - Strange issue

I am experiencing a very strange issue i am hoping someone can answer (its kind of broad, but i will explain it my best), code works on local page when opened, but as soon as the same page is uploaded it throws an error. Two others have also looked at this, resulting in more confusion.
I downloaded FancyBox to use the inline feature to pop up a user form via href link, instead of taking the user to an additional page.
You can see the "stock" fancy box here:
1 fancyapps.com/fancybox/demo
Under various options, Inline is what i am using.
I didnt need all of the other features that came with FancyBox so i stripped the page to the following, which works just fine:
2 *Fancy Box Demo Stripped to Inline Feature only*
So then, i applied this code to our sandbox copy of the page to implement:
3 *Sandbox Copy with Fancy Box inline feature added to "make offer" link*
It stops working! There are no conflicts with other javascript on the page, and the only difference is that it has a couple of color .css changes, all .fancybox was named to .ptroffer and that the css code is not inline on the page (which wouldn't cause this error anyway).
This same page, opened locally works beautifully - upload and it throws error.
SCRIPT5007: Unable to get value of the property 'ptroffer': object is null or undefined
<script type="text/javascript">
$(document).ready(function() {
$('.ptroffer').ptroffer();
});
</script>
Works fine with link #2, and with link #3 locally, but with #3 uploaded it throws error.
Please!

Something in your code somewhere is overriding $. If you change that "ready" handler to call
jQuery('.ptroffer').ptroffer();
you won't get that error. However, things may not work; I think that an older version of jQuery is being imported by something (1.3!), which is bad.
edit oh I see, something's pulling in Prototype. You've got a regular script soup going on there, and things are going to be unpredictable and bizarre until you get that straightened out. Probably somewhere in there something's calling jQuery.noConflict(), but that "ready" handler you're adding isn't written to expect that. Whatever code that's expecting jQuery 1.3 may be in for a surprise also.