Something like this? (Note that jQuery and JS in general are still
often a challenge for me).
----------
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
// extend the default setting to always sort on the first column
$.tablesorter.defaults.sortList = [[0,0]];
// call the tablesorter plugin
$("table.tablesorter").tablesorter({ widgets: ['zebra'] });
//assign the sortStart event
$("table").bind("sortStart",function() {
$("#overlay").show();
}).bind("sortEnd",function() {
$("#overlay").hide();
});
});
</script>
----------
On May 12, 5:31 pm, aquaone <aqua...@gmail.com> wrote:
> You should be able to bind to the sortEnd events to force sorting on all
> tables based on the sort order of that table...
>
> On Tue, May 12, 2009 at 16:48, christopherious
> <christopheri...@gmail.com>wrote:
>
>
>
> > I share David's requirement to sort globally on the page. When users
> > click a column header for a given table, I want all tables on that
> > page to sort by that column rather than for just the table where the
> > user clicked the header.
>
> > My JS:
>
> > <script type="text/javascript" charset="utf-8">
>
> > $(document).ready(function() {
> > // extend the default setting to always sort on the first column
> > $.tablesorter.defaults.sortList = [[0,0]];
> > // call the tablesorter plugin
> > $("table.tablesorter").tablesorter({ widgets: ['zebra'] });
> > });
>
> > </script>
>
> > My table tag:
>
> > <table class="tablesorter" cellspacing="1">
>
> > Thanks in advance.
>
> > On May 1, 5:39 pm, David Blomstrom <david.blomst...@gmail.com> wrote:
> > > Sorry it took me so long to reply. I thought my posts weren't showing up
> > on
> > > this forum.
> > > Anyway, thanks for the tip. I understand it now. Unfortunately, it isn't
> > > working for some reason.
> > > Is there a way to instead designate multiple ID's - like myTable,
> > myTable2
> > > and myTable3?
> > > Thanks.
>
> > > On Thu, Apr 30, 2009 at 1:41 PM, aquaone <aqua...@gmail.com> wrote:
> > > > IDs are unique for a document. A document containing multiple elements
> > with
> > > > the same ID is invalid. Use a class instead and invoke tablesorter on
> > all
> > > > tables with that class.
>
> > > > e.g.
> > > > <table class="tablesorter">
> > > > ...
> > > > </table>
>
> > > > and
>
> > > > $("table.tablesorter").tablesorter({ widgets: ['zebra'] });
>
> > > > On Wed, Apr 29, 2009 at 20:35, David Blomstrom <
> > david.blomst...@gmail.com>wrote:
>
> > > >> I'm using jQuery's tablesorter.js to create tables with sortable rows,
> > as
> > > >> applied to tables with the ID "myTable."
> > > >> I just wondered if there's a way to make it work with multiple tables
> > on a
> > > >> single page. I created two tables and gave each of them the ID
> > myTable, but
> > > >> only the first table worked. I can't remember if the specific ID is
> > required
> > > >> for my Zebra widget (alternate row colors), too, or not, but I would
> > guess
> > > >> it is.
> > > >> I posted my JS links below, to show you my setup. Thanks for any tips.
> > > >> * * * * *
> > > >> <script src="http://MySite/js/jquery-1.3.1.min.js";
> > > >> type="text/javascript"></script>
> > > >> <script src="http://MySite/js/tablesorter/jquery.tablesorter.js";
> > > >> type="text/javascript"></script>
> > > >> <script language="JavaScript" type="text/JavaScript">
> > > >> $(document).ready(function()
> > > >> {
> > > >> $("#myTable").tablesorter({ widgets: ['zebra']} );
>
> > > >> $("#triggerMS").click(function(){
> > > >> $("#menuMS").show();
> > > >> return false;
> > > >> });
> > > >> $("#menuMS").click( function(){
> > > >> $("#menuMS").hide();
> > > >> return true;
> > > >> });
>
> > > >> $("#triggerReg").click(function(){
> > > >> $("#menuReg").show();
> > > >> return false;
> > > >> });
> > > >> $("#menuReg").click( function(){
> > > >> $("#menuReg").hide();
> > > >> return true;
> > > >> });
>
> > > >> $("#triggerKids").click(function(){
> > > >> $("#menuKids").show();
> > > >> return false;
> > > >> });
> > > >> $("#menuKids").click( function(){
> > > >> $("#menuKids").hide();
> > > >> return true;
> > > >> });
>
> > > >> $("#triggerLinks").click(function(){
> > > >> $("#menuLinks").show();
> > > >> return false;
> > > >> });
> > > >> $("#menuLinks").click( function(){
> > > >> $("#menuLinks").hide();
> > > >> return true;
> > > >> });
>
> > > >> $("#triggerBooks").click(function(){
> > > >> $("#menuBooks").show();
> > > >> return false;
> > > >> });
> > > >> $("#menuBooks").click( function(){
> > > >> $("#menuBooks").hide();
> > > >> return true;
> > > >> });
>
> > > >> }
> > > >> );
> > > >> </script>
>
> > > >> --
> > > >> David Blomstrom
> > > >> Writer & Web Designer (Mac, M$ & Linux)
> > > >>www.geobop.org
>
> > > >> --
> > > >> David Blomstrom
> > > >> Writer & Web Designer (Mac, M$ & Linux)
> > > >>www.geobop.org
>
> > > --
> > > David Blomstrom
> > > Writer & Web Designer (Mac, M$ & Linux)www.geobop.org
