I've got a strange issue with DataTables and destroy. I am using version 1.10.3 (but also tried 1.10.7) and fixedColumns Plugin (3.0). When I want to destroy the table I get an error in the plugin:
Uncaught TypeError: $(...).fn is not a function
My init looks like this:
fulltable = $('#auditplan_table_fs').dataTable();
and the destroy
fulltable.fnDestroy();
but I've also tried to initalize via .DataTable() and destroy via .api().destroy() or .destroy() which leads to the same result. Any possible solution would be appreciated.
UPDATE:
As it seems it isn't a problem with FixedColumns, here is some more information. I'm calling the dataTable in an ajax success like this:
$('#auditplan_table_fs').append(responseData.findinglist.html);
fulltable = $('#auditplan_table_fs').dataTable({
scrollY: newheight,
scrollX: true,
scrollCollapse: true,
"bSort": false,
paging: false
});
new $.fn.dataTable.FixedColumns(fulltable);
In a document change function (when I select some values from a dropdown) I try to destroy the table like I posted before and then call the ajax function again.
The fulltable variable is defined in my document ready, the assignment happens, as already told, in my success function. When I print out the variable right before the destroy, everything seems to be fine.
UPDATE: It seems to be a bug in fixedColumns itself. I found out I am using 3.0.0 and the newest version is 3.0.4. With this one, I passed the first error and come up with a new one. I now get stuck in Line 1107:
Uncaught TypeError: Cannot read property 'anCells' of undefined
I suppose it has to do something with my init in an ajax call.
LAST UPDATE: Ok, I was to fast. It was only a caching problem. With the new version, everything is working fine.
If you do:
jQuery
DataTables
jQuery
The second jQuery will overwrite the first one (which has DataTables attached to it). Thus, you would end up with a jQuery object that doesn't have DataTables available.
Bit frustrating that jQuery doesn't give an error about being loaded twice as it bites a lot of people
Reference
Related
I'm generating a HTML-table with data from a geojson-file using leaflet. It works fine, but only if I do not delete the "alert" from the following code. Otherwise the data are displaied without table. How to solve this?
$.ajax({url:"wind.geojson"}).done(function(data) {
var data = JSON.parse(data);
L.geoJson(data,
{pointToLayer: MarkerStyle1});
});
alert();
function MarkerStyle1 (feature,latlng) {
...
document.writeln ("<td width='40'><div align='center'>" ,feature.properties.title, "</div></td>\n");
...
};
I do not see any possibility here to upload a file, it's 200kb. It's to find here: 1 The file works well, when I show the objects on a map.
2 shows on older version of the site, where the table is generated with php (done by a friend, I do not use php).
Perhaps it is a problem, that I do not have a "map", no "map.addLayer()" in this code!?
I now realized that the problem is caused by the asynchronous working of AJAX. I changed the code to
$.ajax({url:"wind.geojson", async: false})
Now it is working without the "alert()"-line!
im quite a noob in html and js, so forgive me if this is a dumb question but, im trying to use requireJs to export modules in node and i can't get the function work right.
here is the code extracted from example.
first i have this main.js, as the note in the documentation says http://requirejs.org/docs/node.html#2
var sayHi = require(['./greetings.js'], function(){});
console.log(sayHi);
and a greetings.js who export the answer
module.exports= 'Hello';
});
and get nothing as result, so i define the exports and modules
define( function(exports,module){
module.exports= 'Hello';
});
and get as result:
function localRequire()
what am i doing wrong? i read the documentation and examples, but somehow i can't make this works.
I'm assuming the require call you are using is RequireJS's require call, not Node's require. (Otherwise, you'd get a very different result.)
You are using the asynchronous form of the require call. With the asynchronous form, there is no return value for you to use, you have to use the callback to get module values, like this:
require(['./greetings.js'], function(sayHi){
console.log(sayHi);
});
However, because you are running in Node, you can do this:
var sayHi = require('./greetings.js');
Note how the first argument is a string, not an array of dependencies. This is the synchronous form of the require call. The returned value is the module you required. When you are in Node, RequireJS allows you to call this synchronous form anywhere. When you are running the browser, it is only available inside a define call.
I have set up a very simple rails 5 project to narrow down my problem:
https://github.com/benedikt-voigt/capybara_js_demo
In this project the data mutation done by the Capybara JS is not deleted, neither by Rails nor by the Database cleaner I added.
The following great blog argues, that no DatabaseCleaner is needed:
http://brandonhilkert.com/blog/7-reasons-why-im-sticking-with-minitest-and-fixtures-in-rails
but this works only for fixtures, not for the mutation done by an out-of-thread Capybara test.
I added the Database cleaner, but this also needed work.
Does anybody has a sample setup?
From a quick look at your test I would say it's leaving data because the data is actually being added after DatabaseCleaner cleans. The click_on call occurs asynchronously, so when your assert_no_content call happens there's no guarantee the app has handled the request yet or the page has changed yet and since the current page doesn't have the text 'Name has already been taken' on it the assertion passes and the database gets cleaned. While that is happening the click gets processed by the app and the new data is created after the cleaning has occurred. You need to check/wait for content that will appear on the page after the click - something like
page.assert_text('New Foo Created')
You should only be asserting there is no content once you already know the page has changed, or you're expecting something to disappear from the current page.
I solved now the problem by setting the DB connection to one
class ActiveRecord::Base
mattr_accessor :shared_connection
##shared_connection = nil
def self.connection
##shared_connection || ConnectionPool::Wrapper.new(:size => 1) { retrieve_connection }
end
end
ActiveRecord::Base.shared_connection = ActiveRecord::Base.connection
as describe here:
https://mattbrictson.com/minitest-and-rails
I uploaded the working repo here:
https://github.com/benedikt-voigt/capybara_js_demo_working
I need to check if the user's device can input from a camera on my site. To do this I am attempting to use modernizr. I have followed the steps/example code provided on their site but when I test the capture attribute, I always get undefined, regardless of if I am on a device that supports capture.
Steps I followed:
I browsed for the input[capture] attribute and added it to the build
I copied the demo code to check this feature and added it to my project
I downloaded the build, added the js file to my project, and included the appropriate reference in my page
However after all of this, when inspecting Modernizr.capture in the chrome inspector, it always shows up as undefined.
My basic check function is as follows:
$scope.hasCamera = function() {
if (Modernizr.capture) {
// supported
return true;
} else {
// not-supported
return false;
}
}
This is my first time using Modernizr. Am I missing a step or doing something incorrectly? I also installed modernizr using npm install and tried adding the reference to a json config file from the command line.
Alternatively, how might I check if my device has a camera?
Thank you very much for your time. Please let me know if I am being unclear or if you need any additional information from me.
A few things
while photos are helpful, actual code hosted in a public website (either your own project, or on something like jsbin.com) is 10x as useful. As a result, I am not sure why it is coming back as undefined.
The actual capture detect is quite simple. It all comes down to this
var capture = 'capture' in document.createElement('input')`
Your code is a lot more complicated than it needs to be. Lets break it down. You trying to set $scope.hasCamera to equal the result of Modernizr.capture, and you are using a function to check the value of Modernizr.capture, and if it is true, return true. If it is false, return false. There is a fair bit of duplicated logic, so we can break it down from the inside out.
Firstly, your testing for a true/false value, and then returning the same value. That means you could simplify the code by just returning the value of Modernizr.capture
$scope.hasCamera = function() {
return Modernizr.capture
}
While Modernizr will always be giving you a boolean value (when it is functioning - without seeing your actual code I can't say why it is coming back as undefined), if you are unsure of the value you can add !! before it to coerce it into a boolean. In your case, it would make undefined into false
$scope.hasCamera = function() {
return !!Modernizr.capture
}
At this point, you can see that we are setting up a function just to return a static value. That means we can just set assign that static value directly to the variable rather than setting up a function to do that
$scope.hasCamera = !!Modernizr.capture
Now, the final thing you may be able to do something better is if you are only using Modernizr for this one feature. Since it is such a simple feature detection, it is overkill to be using all of Modernizr.
$scope.hasCamera = 'capture' in document.createElement('input')`
I am trying to learn how to use Jasmine and Sinon for testing a Backbone application, and I was following this tutorial. Nevertheless, I ran into a problem that I don't know how to solve.
Most likely the solution is simple, but I need some guidance ...
In my project.spec.js file this is the code that is giving the problem:
it("should not save when name is empty", function() {
var eventSpy = sinon.spy();
this.project.bind("error", eventSpy);
this.project.save({"name": ""});
expect(this.eventSpy.calledOnce).toBeTruthy();
expect(this.eventSpy.calledWith(
this.project,
"cannot have an empty name"
)).toBeTruthy();
});
And this is the specific error that can be seen in the browser:
Failing 1 spec
7 specs | 1 failing
Project model should not save when name is empty.
TypeError: Object #<Object> has no method 'spy'
TypeError: Object #<Object> has no method 'spy'
at null.<anonymous> (http://localhost:8888/__spec__/models/project.spec.js:53:26)
at jasmine.Block.execute (http://localhost:8888/__JASMINE_ROOT__/jasmine.js:1024:15)
at jasmine.Queue.next_ (http://localhost:8888/__JASMINE_ROOT__/jasmine.js:2025:31)
at jasmine.Queue.start (http://localhost:8888/__JASMINE_ROOT__/jasmine.js:1978:8)
at jasmine.Spec.execute (http://localhost:8888/__JASMINE_ROOT__/jasmine.js:2305:14)
at jasmine.Queue.next_ (http://localhost:8888/__JASMINE_ROOT__/jasmine.js:2025:31)
at onComplete (http://localhost:8888/__JASMINE_ROOT__/jasmine.js:2021:18)
at jasmine.Suite.finish (http://localhost:8888/__JASMINE_ROOT__/jasmine.js:2407:5)
at null.onComplete (http://localhost:8888/__JASMINE_ROOT__/jasmine.js:2451:10)
at jasmine.Queue.next_ (http://localhost:8888/__JASMINE_ROOT__/jasmine.js:2035:14)
In addition to the sinon.js library, I have installed the jasmine-sinon.js library (both are in the vendor/assets/javascripts folder and are included in the application.js file).
Thank you,
Alexandra
I faced this problem when I downloaded sinon.js file from GitHub (without Sinon folder). I solved the problem by downloading the library from http://sinonjs.org/
I'm going to post this as an answer, based on the comment thread above. We've narrowed down the problem to the line where sinon.spy() is called, so it's not specific to this test but to how sinon is being loaded.
I suspect the problem is that you're including sinon and jasmine-sinon in application.js, when they should really go in spec/javascripts/spec.js (in the same format). Try changing that and see if anything changes.
UPDATE:
Based on the comment thread below, it seems the code is getting to the this.project.save(...) line but the validations aren't working: I know this because if you're getting a POST error in the console, it means that backbone actually made the request (which it should not have because the name is empty). So you should go back and check the code you are actually testing.
I know this thread is old, but I had a similar issue today with this when going through this tutorial http://tinnedfruit.com/2011/03/25/testing-backbone-apps-with-jasmine-sinon-2.html. It looks like Backbone made a change and it calls the 'invalid' event when invalid model data is provided, not 'error'.
If you run into this error try changing:
it("should not save when name is empty", function() {
...
this.project.bind("error", eventSpy);
...
});
To:
it("should not save when name is empty", function() {
...
this.project.bind("invalid", eventSpy);
...
});
This resolved the issue for me.