I am getting an error when I try to call $("#myDiv").modal(). The error is:
Uncaught TypeError: undefined is not a function
I have seen this error come from a few different places, and modal() is called with different parameters in the various places. I've seen a lot of questions that say the solution is to include the jquery and bootstrap files in the right order. I find this confusing because I am using jquery and bootstrap npm modules, so I don't include their js files anywhere. How can I get this to work with npm modules?
This issued might be resolved. But I am adding the solution for future reference.
Try checking if the bootstarp jQuery library is included. This problem might be because of a situation where you also include a jQuery library into the web page along with the existing bootstrap jQuery library. Bootstrap will always reference the first included jQuery.
.modal() is included into bootstrap's jQuery. So try including that before.
Related
Two questions:
1.
Why code autocomplete is showing me .set methods from other libraries while having proper import from particular one (screenshot)?
2.
Why, while importing lodash, I have "Cannot resolve symbol" in here?
I know, that to prevent from displaying this warning I need to load #types/lodash in Javascript libraries settings, but... why this information is not loaded automatically from node_modules directory?
I need your help. I've been stuck with this problem for 2 days.
I'm building an application with electron (by Atom) and I use bootstrap-select. When I launch the app an error rises even if the function in question has not been called yet:
Uncaught TypeError: $(...).selectpicker is not a function
Do someone know how to fix that?
I solved my problem. It seems that using
require('bootstrap-select');
to include the library doesn't work properly, instead, I downloaded the bootstrap-select library and imported manually in the HTML file.
I'm trying to upgrade a site template that uses mainly jQuery 1.08 to use 1.11, since a widget I want to connect to the subscribe form uses 1.11.
Here's the template I'm using:
http://multifour.com/projects/ray/ios/image-intro/index.html
What's weird is if I use the following code, the header is there but the form doesn't work properly:
<script src="scripts/jquery-1.11.0.min.js"></script>
And if I use this code, the form works but the header disappears:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
I can't use both either, because whenever I enter the second line the header disappears for some reason. What gives, can someone please help me? Thanks!
For your first problem
I checked your directory for the jQuery script and it returned a 404. Perhaps you updated it because I noticed a different jQuery version being loaded in your view source.
http://multifour.com/projects/ray/ios/image-intro/scripts/jquery-1.11.0.min.js
For your second problem
Ya, I've actually included the jquery file in the scripts directory and either way I thought reading it in through googleapis would include jquery anyway. The console is reading two errors, saying that $().smoothScrool and $.stellar aren't functions in a custom.js file. If you check out the source code of the template I linked to and bring up the custom.js file (line 498), it's the exact same as the one I'm using locally. Thanks for your help so far, guys.
You should use some kind of Javascript Loader because your custom.js is loaded before your jQuery libraries are loaded and thats why you would be getting the error $().smoothScrool and $.stellar aren't functions. Maybe try the HTML5 async Javascript attribute.
http://www.w3schools.com/tags/att_script_async.asp
I am working on a Magento Extension. Magento has a known issue when you try to use jQuery in Magento because Magento uses the Prototype library.
The work around for it is to put your jQuery code in no conflict mode like this...
jQuery.noConflict();
Once I did this, it resolved 90% of my problems i was having with JavaScript errors. However I still have 3 major problems with JavaScript right now and I believe they are related...
Uncaught TypeError: undefined is not a function
http://www.codedevelopr.com/screenshots/2014/2014-08-23_16-14-37.png
When I view the line numbers that it is reporting these errors from I see this...
Line 1168 jQuery(".acc-wizard").accwizard({ now this accwizard() is a function that is loaded from a jQuery plugin file. I have verified the file is loaded and it is loaded after my jQuery and after I set the no conflict mode for jQuery. I am not sure if something in the plugin file needs to be changed as well to work with the no conflict mode or why it is saying it is undefine?
Same situation with simplecolorpicker() on line 1180.
I have uploaded the file that holds the accwizard() jQuery Plugin, it is about 14kb in size and can be found here http://www.codedevelopr.com/screenshots/2014/acc-wizard-bs-3.js I figured it is a little to large to post that code here.
Can anyone help me to get these errors resolved? It seems any jQuery plugin I try to use results in this undefined error above?
UPDATE
So I have been experimenting with a lot of things with no luck...that is until I tried loading all my JS files inline in my actual template page that my extension uses...once I do that, it all works with none of these errors.
This is frustrating though as I much prefer to have separate JS file for my JS...instead of loading 3 JS files I even tried putting all 3 into 1 file and loading that 1 file but I still get the JS errors...now when I copy that 1 file that had all 3 files combined and put it directly in the template file...everything works perfectly! This makes no sense to me, please help?
There's not enough context in your answer to pinpoint the reason, but it sounds like your web browser executes the code ...
jQuery('foo').accwizard
BEFORE it has downloaded and initialized the plugin that defines the accwizard method.
I am trying to use the latest q.js to add promises to my ajax calls. I don't use node.js in any way shape or form. I downloaded the latest from https://github.com/kriskowal/q and include just the q.js. In my console I see in some places:
ReferenceError: require is not defined
I don't know if this is a deal breaker or not, but I don't use requirejs either. I am playing around with a single page app, and while I use jquery for ajax, I plan to remove that dependency for either my own simple implementation or another smaller library. I want to use q.js, and also use bootstrap.js and will possibly use flatiron-director, that's about it. So I don't use npm, or any of that other stuff since my app is so simple. With only a couple JS files, I don't see any reason to add that complexity.
So is that error a problem and q.js won't work without require.js (or node.js)? I thought I read it's stand alone, but when I see errors like this and it seems as if it depends on some other JS libraries it has me doubting if I can use it or not.
The V2 branch of this project uses require.js. The V1 branch does not use require.js.
https://github.com/kriskowal/q/tree/v1