Category: JQuery

Check checkbox with tr element

To check a checkbox after clicking a table’s tr element, do the following: $(document).on(“click”,”.your-tr-element”,function(event){ checkbox = $(this).find(“input:checkbox”); if(event.target.type!=”checkbox”){ if($(checkbox).prop(“checked”) == true){ $(checkbox).prop(“checked”,false); }else{ $(checkbox).prop(“checked”,true); } } });   By retaining the event in the callback function, we’re able to ensure the clicked element is not the checkbox itself. This will solve the issue of effectively […]

Fix footer to bottom if no vertical scrollbar

If you need a footer to stick to the bottom when there is no vertical scrollbar, do the following: $(document).ready(function() { if($(“body”).height() <= $(window).height()){ $(“.footer-container”).css(“bottom”, 0); $(“.footer-container”).css(“position”, “absolute”); $(“.footer-container”).css(“width”,”100%”); } });   This will ensure the footer sticks to the bottom of the browser when there is no scrollbar (eliminating the weird empty space that […]

Rails remote multipart form with remotipart bind ajax:success

Rails 3.x / 4.0 does not handle remote multipart forms natively, so a workaround is needed. To get remote multipart forms working correctly you can use the following steps (quick solution). First: Add the remotipart gem to your GemFile gem ‘remotipart’, ‘~> 1.2.1’ Then, Update your javascript manifest file (in basic configurations this is usually […]

JQuery Sortable with multiple sections within the same view

I ran into an issue the other day where multiple sortable regions were dynamically created within the same view, all with the same class structure. After running > $(“.the-class”).sortable({…}) I noticed that only the first sortable region was actually sorting. To resolve this issue iterate over the class and call sortable on each individual element. […]

Rails 4 TurboLinks with JQuery document ready

Using JQuery’s $(document).ready() functionality seems to be broken when using’s the Rails Gem Turbolinks. However, to fix any issues you are experiencing, add the jquery-turbolinks gem to your Gemfile > gem ‘jquery-turbolinks’ Then, add the following line to your JS manifest file, typically application.js in your assets directory: //= require jquery.turbolinks After which, restart your […]

JQuery – Wait until all images load before doing something

You may want to wait until all assets have loaded (such as images and certain JSON requests) prior to performing an action in JQuery. To do this, wrap your code in the following listener: $(window).load(function(){ }); This is different than what is typically done: $(document).ready(function(){ }); This allows us to wait until the DOM has […]