If I go to http://localhost:3000/assets/application.js my code (which works fine in 3.0) exists, because I've referenced it fine in the new application.js assets pipeline file:
$(document).ready
(function(){
$('input.ui-date-picker').datepicker({
dateFormat: 'dd-mm-yy'
});
});
But it's not being called. Jquery is present, too, and my gemfile got upgraded ok. What could be wrong?
OK, the problem was that I had a number of bits of code within a .js file I'd called various.js, and not all of them were wrapped in $(document).ready... }); Once I added that to each separate bit of code it worked fine. Also, I have to restart the server each time I make a change to the .js file - just touching it doesn't work for me. I found a simple Hello World alert really useful in debugging this (just in case anyone out there is as new to jquery as me!):
$(document).ready(function() {
alert("Hello world!")
});
Related
I'm using jsPDF to generate a pdf from the current HTML, the code works fine if I paste it on the console and downloads a PDF with the current HTML, but when I put it on a JS file it downloads a blank PDF:
This is the code:
<script>
function descargar_pdf(){
var pdf = new jsPDF();
pdf.addHTML(document.body,function() {});
pdf.save('Estadodecuenta.pdf');
};
</script>
The function is called from a button:
<button class="descargar_pdf" id="ignorePDF" onclick="descargar_pdf();"> Descarga tu estado de cuenta</button>
The second argument in the addHTML function is a callback function which gets called after the HTML is rendered.
pdf.addHTML(document.body, function() {
pdf.save('*.pdf');
});
The last correctly working version of html2canvas is RC1. Downgrade to that one and it should work as expected.
This may sound stupid but there's a lot of security plugins that see JSPDF as an "unsafe" js and just block it , i had the same problem as you did but after testing it out on incognito mode (no extensions) it worked fine.
This may not the solution to your problem but its a advice you should keep in mind
I have basic onclick functions* in my ruby on rails app, when i look at application.js, they're all available but in the frontend, when i actually click on the element, the function does not trigger, although when i try the HTML version equivalent, its working well.
The app has the jquery-rails Gem installed and just to double confirm, I also tried inserting the jquery.js file in the vendor folder, but neither of these solved it unfortunately
*example
$('#openSidebarButton').on('click', function() {
$('#openSidebarButton').addClass('hidden');
$('#sidebar').removeClass('hidden');
});
Please make sure you have the following in your application.js:
//= require jquery
//= require jquery_ujs
i found the solution..a bit silly of me but essentially, i did not include the function within document.ready, that's why it wasn't working :-)
to summarize, what i did was made the above mentioned on click within a function
$(document).ready(function() {
openSideBar();
});
function openSideBar {
$('#openSidebarButton').on('click', function() {
$('#openSidebarButton').addClass('hidden');
$('#sidebar').removeClass('hidden');
});
}
I am unable to get jasmine to load my custom javascript file, even though it works perfectly in the browser. I've reduced the javascript to the minimum to avoid any possibility of errors and I still get a failing test on the simplest thing.
Custom ARB.js file:
$(document).ready(function() {
alert('typeof ARB: ' + typeof ARB);
});
ARB = {};
ARB.VERSION = "V1.01.00 2012-08-24";
jasmine configuration file snippet (I'm on Rails 3.0.9):
src_files:
- "public/javascripts/**/*.js"
- "public/javascripts/ARB.js"
This test:
it('should define the custom javascript functions', function() {
expect(typeof ARB).toEqual('object');
});
fails with:
Expected 'undefined' to equal 'object'.
jQuery gets loaded and so does my application.js file. When running jasmine, I get no alert message, but I do when I run my app.
What am I missing?
UPDATE: If I remove the $(document).ready function, jasmine passes all the tests - what's that all about?
shioyama gave me the pointer that I needed to figure this out: my custom ARB.js file was getting loaded before the jquery files so it didn't have access to the $(document).ready function. What I had to do was explicitly spell out the order in which my javascript files were to be loaded. Here's what I put in my jasmine config file at /spec/javascripts/support/jasmine.yml:
src_files:
- "public/javascripts/**/jquery.js"
- "public/javascripts/**/jq*.js"
- "public/javascripts/**/application.js"
- "app/assets/javascripts/**/*.js"
- "public/javascripts/ARB.js"
I first force the main jquery.js file to load, then all the other jquery files, then application.js, then any other javascript files that are located in the assets directory, and finally my custom javascript file.
This works for me because I'm still on Rails 3.0.9 and starting the migration to 3.1+ and the asset pipeline.
The Loading message in JQuery Mobile 1.1.0 doesn't seem to be working. Here is the JSFiddle for the code.
When I use version 1.0b2, it works as expected. Is this a bug in 1.1.0?
It is not a bug. Latest Jquery supports more config options. You can define the laoding message theme etc.
Refer the documentation here
Sample code
$(document).bind("mobileinit", function(){
$.mobile.loadingMessageTheme = 'a';
$.mobile.loadingMessageTextVisible = true;
});
Save above mentioned code in a js file (e.g. config.js ) and import it before importing jquerymobile framwork.
Good luck.
I have a few multiselect boxes from the Jquery UI on a page that work perfectly well in Chrome & Safari but not in Firefox for some reason... when I load the Error Console in Firefox I see:
Error: $.widget is not a function
Source File: http://localhost:3000/javascripts/jquery.multiselect.js?1302660373
Line: 563
Any ideas why?
edit: the line itself is within the open function right where it says "// react to option changes after initialization"
// open the menu
open: function(e){
var self = this,
button = this.button,
menu = this.menu,
speed = this.speed,
o = this.options;
widget: function(){
return this.menu;
},
// react to option changes after initialization
_setOption: function( key, value ){
var menu = this.menu;
switch(key){
case 'header':
menu.find('div.ui-multiselect-header')[ value ? 'show' : 'hide' ]();
I am assuming you are using the jQuery Multiselect plugin… which depends on jQuery UI.
Sounds like you have not included enough of the jQuery UI library or just none of it. You need to include the core parts of jQuery UI (including Widget) if you build a custom download. Or just download the whole jQuery UI and include it instead.
For anyone else who is getting this but has the requirements; make sure you are including the Javascript files in the correct order. This error was being caused by my jquery-ui.js being included after the multiselect js file.
This answer is probably unrelated to the situation of the questioner, but I put it here for the sake of others Googling the question.
I got this error using Rails 3.2 and fixed it by deleting (renaming) the public/assets folder. It seems there are a lot of problems with the assets pipeline still. I don't know the details but have had other Javascript failures that are fixed this way.
Actually if you are getting this error then it's either
a) per #andyb answer - you haven't included the correct jQuery UI components
OR
b) your DOM is not loaded yet with the correct $.widget and therefore your function is attempting to call before $.widget has loaded. to fix the problem, ensure $.widget is called BEFORE your function