I have a problem with editor in jquery datatables.
I'd like to use this project -> https://editor.datatables.net/examples/advanced/htmlTable.html
So, I copy all code to my computer and I run this file, this is my code -> http://wklej.org/hash/cf232c385cc/
But, I get information from console: $.fn.dataTable.Editor is not a constructor
And I don't know what is a reason this error.
Can You help me? :-)
That kind of error normally indicates, that the function you are calling is not loaded correctly.
1) Are you loading the javascript containing the $.fn.dataTable.Editor function? Can you make sure it is loaded by checking your browsers developer tools?
2) Is your call to $.fn.dataTable.Editor wrapped by this line: $(document).ready(function() {...}? If not your code executes before the javascript for $.fn.dataTable.Editor is loaded and defined and will fail with said error.
If that doesn't help, can you please edit your question to include the code?
I am in the process of installing the asset pipeline into an older rails app. I am getting some really strange results though. I can see that the page is rendering all of the css and the jquery that is in the app/assets directory but its having a hard time interacting with the html.
For instance if i inspect the page and in the console call $("html").html(); to try grab all the html it returns TypeError: Cannot call method 'html' of null same when trying to grab any element that is being rendered? but the page is there. if i call jQuery it will return fine. so its not like it jQuery isnt there.
$ is just a shorthand way of writing jQuery. If the latter works but the former doesn't, then another script in your pipeline is probably conflicting with jQuery and trying to use the $ symbol for something else.
Are you using any other plugins or libraries that might be trying to use $? Or have you accidentally overwritten it yourself by writing $ = (something) anywhere? Without more information it's hard to know where the problem is exactly.
If all else fails you can just stick to using jQuery() for all your calls. In your external script file you could also circumvent this by passing the jQuery object to a wrapper function, e.g.:
(function ($) {
$('div').append('You can use $ here without having to worry about conflict.');
}(jQuery))
I'm not sure if there is a clear way for me to show / describe the problem that I'm having. But here goes:
I've developed an app with AngularJS (have not put live yet). It was decided that we needed tooltips for some of the metrics on the tables. We liked the general look of TipTip jQuery Plugin.
On my index file I correctly include the minified.js:
<script src="../assets/javascripts/app/jquery.tipTip.minified.js"></script>
(yes, the path is correct. I can click on the link in chrome developer tools and see the source file).
In my controller, I call it with this:
$scope.addTolltips = function() {
$timeout(function(){$('.results-metrics').tipTip({maxWidth:"300px", defaultPosition: "top"});},500);
}
I added the $timeout to make sure there was enough time for dynamic stuff on the page to be load in the DOM. I know it's probably not necessary anymore though.
But when tipTip() is being called I get a console error:
TypeError: Object [object Object] has no method 'tipTip'
However, if I take the minified source and paste it into my controller before the tipTip(), then everything works perfect. Any thoughts?
angularjs provides jQuery functionality via the angular.element function (http://docs.angularjs.org/api/angular.element), so you should use it instead of $ (however, I cannot explain why $ isn't working in your case)
Why is it that this works: http://jsfiddle.net/w82W8/1/
But this doesn't?: http://jsfiddle.net/w82W8/2/
This question may seem convoluted; you may wonder, why not just use the first!? Why are you using jQuery to load in JS+CSS assets that you could easily load in the original HTML.
Well, I'm in the process of building a web widget and I'd like to keep the embed code as small as possible. The idea is to have the user include a single <script type='text/javascript' src='http://mysite.com/widget.js'></script> line in their code, and the widget.js code will take care of all the details. Including fetching fancybox.
I'm getting the error: Uncaught TypeError: Object [object Object] has no method 'fancybox'
I hypothesize that javascript is not waiting for fancybox.js to load, and immediately attempting to apply fancybox() to the trigger. Can I get a callback working here when the assets have been loaded? I'm certain they are getting included in the DOM though... I've inspected with Chrome Tools.
I know this question has been asked on StackOverflow before, but not in this context.
Thanks, and Happy Holidays!
At the second method, the fancybox method is called before the Fancybox plugin has loaded. Use the getScript method if you want to execute code after loading a script.
Example:
$.getScript(
"http://jordanarsenault.com/fancy/fancybox.js",
function(){
$(".trigger").fancybox();
}
);
If you need an advanced resource loader, consider using a real loader, such as yepnope.
Because the script isn't immediately loaded. You have to use $.getScript and supply a callback like this: http://jsfiddle.net/w82W8/3/.
$.getScript("http://jordanarsenault.com/fancy/fancybox.js", function() {
$(".trigger").fancybox(); // only run when script is loaded
});
I have the following code:
// Creates a timer to check for elements popping into the dom
timer = setInterval(function ()
{
for (p in pixelTypes)
{
checkElems(pixelTypes[p]);
}
}, 10);
// Add Document finished callback.
$(document).ready(function ()
{
// Document is loaded, so stop trying to find new pixels
clearInterval(timer);
});
In Firefox, it works great, but in IE6, I get a "Object Expected" error on the $(document).ready line.
I can't figure out what would cause IE6 to not recognize it, jquery is fully loaded by this point.
Is this a known issue?
Just a few pointers for anyone that's interested:
$(document).ready(function() {...}); and $(function() {...}); means exactly the same thing. The latter is a shorthand for the former.
If you develop for a large site, using multiple Javascript libraries, or you develop plugins meant to be compatible with other peoples work, you can not trust the dollar sign ($) to be associated with the jQuery object. Use the following notation to be on the safe side:
(function($) { [your code here] })(jQuery);
This passes jQuery into a self-executing function, and associates $ with the jQuery object inside this function. Then it does not matter what the $ represents outside of your function.
To get back to your question, have you checked whether the timer variable is assigned when you get the error? I believe the browser will see the $(document).ready(function() {...}); all as one line, so if you have some kind of debugger that tells you that's the offending line, it might be the timer variable...
Last thing: In Javascript, it is not correct to place open curly braces on a new line. This can cause really bad errors due to Javascripts semicolon-insertion. For further info, read Douglas Crockford's Javascript: The good parts:
http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742/ref=sr_1_1?ie=UTF8&s=books&qid=1267108736&sr=1-1
Anyway, really hope I didn't upset anyone. Hope you solve the problem!
EDIT: I'm not sure if this is what robertz meant by fully qualified, but as far as I know, when a URL is fully qualified it means no parts are missing, ie. it's an absolute URL starting with http:// or https:// (or some other protocol).
Please correct me if I'm wrong!
I've had this same issue in the past too. It was a sporadic issue and was horrible to and reproduce.
The solution that I found was to replace $(document).ready(function() {...}); with jQuery(function() {...}) and it worked like a charm!
Moving $(document).ready(function() {...}); to the bottom didn't work for my use case.
The comments in this post are incredibly helpful (Where I first read about doing it this way)
If anyone have the same problem you should see if when you call your javascripts you have type="application/javascript", I eliminate it and it was corrected, I think it's some problem with IE and the type Thing
Are you sure that jQuery is loaded? Try debugging with alerts like:
alert(typeof $);
You could also try a different syntax:
$(function() {
clearInterval(timer);
});
Ok, so from your comment, the above doesn't help. The "object expected" error seems to occur with a syntax error in my experience. Is that the exact code you've got? If not, could you post it?
Make sure your script type is text/javascript
<script type='text/javascript'
The DateTime picker worked just fine on my local XP test, but it failed "Object Expected" once deployed on the server. After 2 days of being persistent, this is how I solved my problem, adding the Url.Content around the path of the Javascript!
<script src="<%= Url.Content("~/Scripts/jquery-1.4.1.min.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/ui/minified/jquery.ui.core.min.js") %>" type="text/javascript"></script>
<script src="<%= Url.Content("~/Scripts/ui/minified/jquery.ui.datepicker.min.js") %>" type="text/javascript"></script>
I don't think that you should really be polling for elements the way you are.
The document ready event calls as soon as the browser has loaded enough for you to be able to manipulate the page, so you should just do your DOM processing in the $(document).ready() block.
You could try the old skool way of checking whether the document is "ready"... Place the script just before the closing </body> tag - I believe it has the same effect as jQuery's 'ready' event - actually, it's probably quicker doing it this way.
In my experience the "Object expected" error in IE6 shows up because of a syntax error - it's worth putting the script though JSlint, if you haven't already...
I ran into this problem on my machine, as was able to find a quick fix. Here's what I did:
1.Debugged my javascript with nickf's suggestion "alert(typeof $)" and got the "undefined" alert message
2.I then fully qualified my jQuery script resources.
3.Reload my page and received the "function" alert message
BTW, I am using IIS 5.1 on XP. My website is configured to use "Wildcard mapping" to take advatage of the asp.net mvc framework. I think that this configuration caused the broken links.
For more information on how to setup MVC on old versions of IIS, check out Phil Haack's post:
http://haacked.com/archive/2008/11/26/asp.net-mvc-on-iis-6-walkthrough.aspx
$(document).ready() tells you when the dom is ready, but not all assets are necessarily done coming in.
If you want to make sure all the assets are actually done loading, use $(window).load() instead. The most common use for this is to make sure that images are done loading, but it may work for your script problem as well.
If it is in a script element which is within your body element, (i.e.) ..
The cause can be the attributes you pass with the script-tag. If it is:
<script type="text/javascript">...</script>
IE6 can give an error. You should use
<script language="javascript">...</script>
Then the error goes away.
I had the same issue, script error informing me that the object was undefined. I tried all the suggestions listed here with no avail. Only thing I did not consider was security, I had forgotten all about my forms authentication and turns out I forgotten about the authorisation on the scripts folder which was denying access to the jQuery libraries!!!
Hope this helps.