I would like to ask on how I can use both functions once the page loads
jQuery(document).ready(function($)
{
$('#list').tableScroll({height:500});
});
and
jQuery(document).ready(function($)
{
$('#list').tableSorter();
});
-
1It's not the shortest way to write it, but your two separate pieces of code would work if you put them both in the page.Anthony Grist– Anthony Grist2013-04-03 12:03:16 +00:00Commented Apr 3, 2013 at 12:03
Add a comment
|
9 Answers
jQuery(document).ready(function($) {
$('#list').tableSorter().tableScroll({height:500});
});
1 Comment
Mark Withers
Much better than my answer :)
jQuery supports method chaining.
jQuery(document).ready(function($) {
$('#list')
.tableScroll({height:500})
.tableSorter();
});
1 Comment
Mihai Matei
You're right.. this is true only if the plugins you are using supports chainability
jQuery(document).ready(function($)
{
$('#list').tableScroll({height:500});
$('#list').tableSorter();
});
Comments
Just put both under one DOM ready handler and use chaining:
$(document).ready(function() {
$("#list").tableScroll({ height: 500 }).tableSorter();
});
Comments
$(document).ready(function() {
$("#list").tableScroll({ height: 500 }).tableSorter();
});
Comments
I guess its fine to have more than one
jQuery(document).ready(function($) { .... }
both will be called on page on load body :). irrespective of no of call`s made, all will be called on page load only.
Comments
Simple, use
jQuery(document).ready(function() {
$('#list').tableScroll({height:500}).tableSorter();
});
Comments
There is a shorter version of jQuery(document).ready(function()) that you could use that would have the same result:
$(function() {
// code to execute when the DOM is ready
});
For this situation, using the elegant chaining:
$(function() {
$('#list').tableSorter().tableScroll({height:500});
});
For a discussion of the difference between these two approaches, see this very helpful question.
3 Comments
Flo Edelmann
but maybe toink uses other libraries so that
$ has to be escaped?
DOK
Well, @elektronikLexikon, there is always the possibility of collisions when multiple libraries are used, but that is not the question here.
Flo Edelmann
it could be the reason why he used
jQuery(document).ready(function($) in his question, though.Here's how I would do it:
// Create an immediately-invoked function expression
(function ($) {
// Enable strict mode
"use strict";
// Cache the selector so the script
// only searches the DOM once
var myList = $('#list');
// Chain the methods together
myList.tableScroll({height:500}).tableSorter();
}(jQuery));
Writing your jQuery in an IIFE like this means you can run the code alongside other libraries that also use $, and you won’t get conflicts.
Be sure to include this JavaScript at the end of your document, just before the closing </body> tag.
