[jQuery] JQuery tablesorter plugin + Dynamic Table Data via DWR
Hi folks,
Using jquery's tablesorting, I've been trying to sort a table that
contains data loaded dynamically/programatically using DWR's addrows
method. The sorter would sort any column I pick but could only do so
in one direction ( i.e. descending order only, not toggable between
asc/desc ) and then I'd be getting a "cache.normalized[0] is
undefined" error message right after the sort. There was no problem
when sorting data from statically nested table rows , as done in the
demos.
Here's how I set up the table for sorting:
JSP:
var $j = jQuery.noConflict(); // to avoid conflict with Prototype
...
... // rows inserted through DWR method
upon click event
...
Javascript:
loadData() {
... // table rows and cells set up here
// populates the table with sample data
dwr.util.addRows(tablename,[ 'Africa', 'America', 'Asia',
'Australasia', 'Europe' ],cellFuncs,tableproperties);
$j("#table1").tablesorter() ; // intiliaze tablesorter.Tried $j
("#table1").trigger("update") here but didn't work
}
With the above in place, what I got when I clicked a column's header
was one way sorting, with the arrow changing from neutral to downward
arrow, then finally a complaint "cache.normalized[0] is undefined".
Any succeeding clicks on the same column header would yield no
results. On the other hand, clicking any other column header would
trigger a one way sort again, and yields the same behavior.
What could I be missing here? Please share your thoughts on how I can
get the sorter to work properly. Also, take note that my table is
paginated (not by jquery though) which i hope doesn't complicate the
sorting process.
[jQuery] Tablesorter plugin, sort cache problem
Hello, I've created dynamic table using tablesorter and the sort function works fine at first. The problem occurs when I want to sort new data. To make it clearer here's the flow: 1. Generate data, display on table 2. Sort works fine 3. Remove all data row, generate new data, display on table 4. Sort problem, the previously removed data shows up again :( Is there anyone know how to fix this issue ? Thank's in advance.
[jQuery] TableSorter plugin - default column sort DESC instead? How?
Ok, I can't figure this out... The default sort (when clicking on any of the headers in the tablesorter table) is ascending. Now, I want to change that to descending for ALL columns, not just the initial sort column (defined in sortList). I've tried editing sortInitialOrder parameter in the .js itself, and nothing. I've tried adding it as a parameter in my html page when defining and assigning tablesorter, and nothing. What am I missing? And how do I accomplish this?
[jQuery] Tablesorter plugin - grouping rows and sorting per group?
In using Tablesorter plugin, I have run into an challenging issue. What I am looking to do is group certain rows in a single table into two different groups, have a blank row between them and be able to sort based on columns that apply to both groups of rows but without the rows from one group actually mixing with the rows from another group. So, basically, I want to have a table like this: TABLE: Group 1 Row 1 Group 1 Row 2 Group 1 Row 3 Group 1 Row 4 - blank row - Group 2 Row 1 Group 2 Row 2 Group 2 Row 3 So any re-sorting on any of the columns would sort the top 4 rows amongst themselves, keep the blank row after that 1st group and then resort the bottom 3 rows amongst themselves too, without any intermingling and mixing of the two groups of rows. Is this possible at all, with some modifications or custom plugin/ code? How would I go about putting this together if so? Thanks!
[jQuery] tablesorter plugin leaks memory in IE6 and IE7
Hi there, I have a table, 10 cols, 200 rows. Using tablesorter causes a memory leak on every page refresh of almost 2mB. A smaller table causes a proportionately smaller memory leak. Is there way to clear this memory? I've tried setting inner html of the table to '', but it makes no difference. Is there even a universal method i can call to remove any trace of any jquery plugin I have on the page? Any ideas would be great, I love this plugin and don't want to have to use a different one instead. - Pierce
[jQuery] tablesorter plugin help -- getting it to ignore quotation marks
I'm using the tablesorter plugin, and have run into a small issue I can't figure out how to solve: One of the columns in my table contains titles, some of which are books, others of which are articles or television episodes. The latter two start with a double quote (“)... So, for example, one cell in the column might be: Title of Book while another would be: “Title of Article” Tablesorter seems to be factoring these starting double quotes into the sort order for that column, so I end up with a list that is titles without quotes alphabetically first, and then titles with quotes alphabetically second. Is there any way I can get it to ignore the double quote, so that sorting on the column always goes by the first actual letter of the text? Thanks a bunch for any help.
[jQuery] tablesorter plugin
I am working with tablesorter plugin and pager plugin. I have written code that looks for a class and decides whether or not to display the row based on which checkboxes are selected. Example: if i select the checkbox vehicles, the category id is 4, so jquery looks in the table for any rows with class "cat_4" and show() is called. Problem: with the pager plugin, it only "filters" on the current page, it does not filter on the whole data set. How do I tweak and tell the tablesorter/pager plugin that certain are set to display:none so update the table and only include those rows that are set to "show()"?
[jQuery] tablesorter plugin
Hi all, I found this very handy tablesorter plugin (http://tablesorter.com/ docs/#Demo). But i have a problem when i want to put an image in it, the image is trashed and/or does not display properly. Is there a special way to do it with tablesorter ? my code: echo ''; echo ''; echo '';
[jQuery] TableSorter Plugin Question
Hi I am wondering I want to use jquery to add some rows when a person say adds some stuff. I would like to know if I add it like this(through jquery javascript) will the tablesorter be able to figure out how to sort it(ie when some presses the header columns will this new value get stored) or do I to do something to get it to work? -- View this message in context: http://www.nabble.com/TableSorter-Plugin-Question-tp22282466s27240p22282466.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] TableSorter Plugin Question
Hi I am wondering I want to use jquery to add some rows when a person say adds some stuff. I would like to know if I add it like this(through jquery javascript) will the tablesorter be able to figure out how to sort it(ie when some presses the header columns will this new value get stored) or do I to do something to get it to work?
[jQuery] TableSorter plugin is not working in IE7
Hi! Kindly visit following link: http://vibersol.com/sitesdemo/shipping/admin/continent.php Table sorter plugin works fine in FireFox, but in IE7 this plugin doesn't work. Can some one guide me where and how to rectify this problem in my code, so that plugin begin to work in IE7. Thanks in advance
[jQuery] Tablesorter plugin - lazy caching
Hello everybody, I'm developing an application in which the users will deal with a big table (600+ rows). One target for the application is that it has to show up as fast as possible; anyway, applying the tablesorter on the table, the initial caching steals more than one second to the process. Do anybody knows if it's possible to run the cache initialization only when the user clicks on one of the table's headers? Thanks in advance! Davide. -- View this message in context: http://www.nabble.com/Tablesorter-plugin---lazy-caching-tp21830458s27240p21830458.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Tablesorter plugin
HI all
I have been using a function to create the table... this functions
accepts a list and 2 content place holders to put table and pager ...
but something is going wrong the pager css doesnot work
correctly... some time it overlaps table ... sometimes it comes
outside the table..
I am using this function coz i have table on each page of website ...
so I made this function once and call it with the list that I need to
populate on a particular page
can somone tell me why pager is not placed properly outside table...
below or above table?
here is my code:
public static void CreateTable(List list, PlaceHolder
PlaceHolder1, PlaceHolder PlaceHolder2)
{
DataTable tb=new DataTable();
List columns = new List();
Literal t1 = new Literal();
t1.Text = "";
PlaceHolder1.Controls.Add(t1);
Literal t2 = new Literal();
t2.Text = "";
PlaceHolder1.Controls.Add(t2);
PropertyInfo[] properties = list[0].GetType().GetProperties
();
foreach (PropertyInfo pi in properties)
{
Literal t3 = new Literal();
t3.Text = "" + pi.Name;
PlaceHolder1.Controls.Add(t3);
Literal t4 = new Literal();
t4.Text = "";
PlaceHolder1.Controls.Add(t4);
tb.Columns.Add(pi.Name);
columns.Add(pi.Name);
}
Literal t2end = new Literal();
t2end.Text = "";
PlaceHolder1.Controls.Add(t2end);
Literal tbody = new Literal();
tbody.Text = "";
PlaceHolder1.Controls.Add(tbody);
object[] ret = new object[columns.Count];
// foreach (BugInfo item in bi)
foreach (T item in list)
{
Literal tr = new Literal();
tr.Text = "";
PlaceHolder1.Controls.Add(tr);
object[] cells = getValues(columns, item);
for (int l = 0; l < cells.Count(); l++)
{
//if (cells[l] == string.Empty || cells[l] ==
null)
//{
//cells[l] = "NA";
//}
Literal td = new Literal();
td.Text = "" + cells[l];
PlaceHolder1.Controls.Add(td);
Literal tdend = new Literal();
tdend.Text = "";
PlaceHolder1.Controls.Add(tdend);
}
Literal trend = new Literal();
trend.Text = "";
PlaceHolder1.Controls.Add(trend);
}
Literal tbodyend = new Literal();
tbodyend.Text = "";
PlaceHolder1.Controls.Add(tbodyend);
Literal tfoot = new Literal();
tfoot.Text = "";
PlaceHolder1.Controls.Add(tfoot);
//PropertyInfo[] properties = bi[0].GetType().GetProperties
();
foreach (PropertyInfo pi in properties)
{
Literal t3 = new Literal();
t3.Text = "" + pi.Name;
PlaceHolder1.Controls.Add(t3);
Literal t4 = new Literal();
t4.Text = "";
PlaceHolder1.Controls.Add(t4);
}
Literal tfootend = new Literal();
tfootend.Text = "";
PlaceHolder1.Controls.Add(tfootend);
Literal tend = new Literal();
tend.Text = "";
PlaceHolder1.Controls.Add(tend);
Literal clear = new Literal();
clear.Text = "";
PlaceHolder1.Controls.Add(clear);
Literal div = new Literal();
div.Text = "";
PlaceHolder2.Controls.Add(div);
Literal form = new Literal();
form.Text = "";
PlaceHolder2.Controls.Add(form);
Literal img1 = new Literal();
img1.Text = "";
PlaceHolder2.Controls.Add(img1);
Literal img2 = new Literal();
img2.Text = "";
PlaceHolder2.Controls.Add(img2);
Literal text1 = new Literal();
text1.Text = "";
PlaceHolder2.Controls.Add(text1);
Literal img3 = new Literal();
img3.Text = "";
PlaceHolder2.Controls.Add(img3);
Literal img4 = new Literal();
img4.Text = "";
PlaceHolder2.Controls.Add(img4);
Literal pageExtras = new Literal();
pageExtras.Text = "10203040";
PlaceHolder2.Controls.Add(pageExtras);
Literal formend = new Literal();
formend.Text = "";
PlaceHolder2.Controls.Add(formend);
Literal endiv = new Literal();
endiv.Text = "";
PlaceHolder2.Controls.Add(endiv);
}
Thnks for any help!!
Varun
[jQuery] Tablesorter plugin: adding alternating colors
My table has alternating row coloring. It get's messed up after sorting (eg, instead of odd, even, odd I get something like even, even, odd, even, even...etc) I was trying to fix that with Zebra widget but gave up. All I need to do is to call this simple function to http://www.sitepoint.com/article/background-colors-javascript/, but I am not sure where. I tried putting into:
[jQuery] Tablesorter Plugin and widgets
I'm working on Christian Bach's tablesorter.
I've made a widget that can select rows, and now I want to make a
widget that can delete rows, and have a callback.
The problem is the callback.
The widgets are called like this
$.tablesorter.addWidget({
// give the widget a id
id: "selectRows",
// format is called when the on init and when a sorting has
finished
format: function(table)
{
$("tbody tr",table).click(function(e){
row = this;
if($(row).hasClass('selectedRow'))
$(row).removeClass('selectedRow');
else
$(row).addClass('selectedRow');
});
}
});
$.tablesorter.addWidget({
// give the widget a id
id: "deleteRows",
// format is called when the on init and when a sorting has
finished
format: function(table)
{
if($("tfoot",table).length)
{
//add the foot
$(table).append("");
}
//add a row.
$("tfoot",table).append("Delete selected entries");
$(".deleteRows").click(function(){
$(".selectedRow",table).each(function(){
$(this).remove();
///I WANT A CALLBACK HERE
});
});
}
});
$("table").tablesorter({
widgets: ['selectRows','deleteSelected']
});
So, the widgets are called via a text array. How could I add a
callback to a widget?
[jQuery] tablesorter plugin will not sort dynamically generated table from jquery load(script.php)
I am experimenting with the jquery tablesorter plugin (outstanding)
and am able to make it work flawlessly for tables that are loaded with
the initial page. However, if I generate active content, e.g. echo a
into a by calling $(#outputdiv).load(script.php) the
resulting table will not sort. In the plugin documentation I caught
mention of .trigger("update") but that did not solve the problem. What
else am I missing? THANK YOU in advance for any suggestions.
*** javascript ***
$(document).ready(function(){
$("table").tablesorter();
$("#menuitem").click(function(event){
$("#outputdiv").load("script.php");
$("table").trigger("update");//didn't help
});
});
*** html body ***
*** script.php ***
echos a super simple table with the appropriate and
tags for the tablesorter
[jQuery] Tablesorter Plugin: Leave one column untouched
Hi, I'm using the tablesorter plugin. The first column of the table is "Position" (i.e. 1,2,3 etc). When I sort, I'd like this column to stay the same (e.g. if the table is resorted by a criteria, they are still placed with 1 at the top). Is this possibel or will I have to abandon tablesorter and go back to server side sorting? Best, DTH
[jQuery] Tablesorter plugin and zebra striping
I have the following in my $(document).ready:
$(document).ready(function() {
$(".zebra tr:not([th]):even").addClass("even");
$(".zebra tr:not([th]):odd").addClass("odd");
$("table#sorttable").tablesorter();
)};
This allows my table to sort columns by clicking on the column headers
and works great. What I need to be able to do, is have the zebra
striping happen after each table sort.
Is there a way to set this up?
Thanks, Ken
[jQuery] Tablesorter plugin and widthFixed property
Hi folks,
I'm playing around with the Tablesorter plugin and I'm a little
confused about the widthFixed property.
I downloaded and included the Dimensions plugin and set widthFixed to
true like so:
/* Table Sorter */
$("#mytable").tablesorter({
widthFixed: true,
widgets: ['zebra'],
sortList: [[3,0]]
});
Everything works, except that the width of the columns keeps getting
wider to accommodate long text. Any ideas how to prevent the columns
from widening, and instead "wrap" the text inside each cell.
Thanks,
Konstantin
[jQuery] Tablesorter plugin problems with zebra stripes
Hi
The tablesorter 2.0 plugin is very nice and works great but I don´t
really get how the zebra widget works. I do not get alternate colors
on the table. I have a style for ".odd" and ".even" in CSS. I looked
at the demos and it seems that the TRs are assigned "odd" and "even"
but that does not happen for me. What am I missing? I try this:
$("#tablesorter-demo").tablesorter({10: { sorter: false}, widgets:
['zebra']});
/asle
[jQuery] Tablesorter plugin question
First of all, this is a great plugin, many thanks! I have a bit of a specific implementation that I can't figure out. I have a table working and sorting correctly with the plugin, but because of a design decision, I have to allow the table body to scroll while the table headers remain fixed... and still be sortable. I've tried many things, but the only way I can really get the scrolling to work is to separate the thead and put it in a different table that is essentially placed right above a div containing the table body (with a fixed height and overflow:auto set). This allows the table body to scroll while keeping the table headers fixed above it. Now... the question I have is this... is it possible to somehow (even manually) bind the sort events of the thead to a tbody that is in a different table? Or is there another (better) way to do this? I've been trying to figure out a good solution for this one for a while now... Thanks for any help or suggestions!
[jQuery] Tablesorter plugin question
First of all, this is a great plugin, many thanks! I have a bit of a specific implementation that I can't figure out. I have a table working and sorting correctly with the plugin, but because of a design decision, I have to allow the table body to scroll while the table headers remain fixed... and still be sortable. I've tried many things, but the only way I can really get the scrolling to work is to separate the thead and put it in a different table that is essentially placed right above a div containing the table body (with a fixed height and overflow:auto set). This allows the table body to scroll while keeping the table headers fixed above it. Now... the question I have is this... is it possible to somehow (even manually) bind the sort events of the thead to a tbody that is in a different table? Or is there another (better) way to do this? I've been trying to figure out a good solution for this one for a while now... Thanks for any help or suggestions! -m
[jQuery] Tablesorter plugin
Anyone had any issues with the latest version of this in IE?
I have a page that uses this, and I've made use of the sortStart and
sortEnd triggers. For whatever reason, the sortEnd trigger never
fires -- so the message box I have show never goes away. Also, the
zebra striping isn't working at all -- not even when I leave the
widgetZebra property at its default and change my css to use "even"
and "odd" instead of "my-even-class" and "my-odd-class".
I've tried making sure my usage of the triggers is EXACTLY like that
listed on the example page -- and still no love. Any ideas what I
could be missing?
I have something like the following:
$(document).ready(function() {
$('#display-div).hide();
$('table').tablesorter({
widgets: ['zebra'],
widgetZebra: {css: ["my-even-class","my-odd-class"]},
cssHeader:'',
cssAsc: 'asc',
cssDesc: 'desc',
});
$('table').bind("sortStart",function() {
$('#display-div).css("css stuff here").show();
}).bind('sortEnd',function(){
$('#display-div).fadeOut('slow');
});
});
I've tried changing the .fadeOut('slow') to .hide(). No love. I've
tried getting rid of the .css call in sortStart, so that it just ends
up being $('#display-div).show(); No love. I've even tried striping
down the .tablesorter call to not specify anything beyond widgets:
['zebra'], and still it doesn't work! It says that the plugin works in
ie6 -- but my tests show this not to be the case. However, when I go
to http://tablesorter.com/docs/example-triggers.html with ie6 -- works
like a charm. I must be missing something very subtle. About the
only thing I haven't tried is using the packed version of tablesorter
because I have made some modifications to it for my use (changed the
%sort to sort floats as well as integers, since I have to sort values
like 10.35%). It works beautifully in firefox. . . zebra striping,
triggers, and sorting -- all of it!
Any assistance would be appreciated.
[jQuery] tablesorter plugin - could be a bug
Hi guys. I'm testing tablesorter(www.tablesorter.com) plugin to work in a huge table. Tablesorter is a nice tool. But may be I don't know how to sort date column properly. Please look this link *http://tinyurl.com/33rw7p* First column could be sortable but I don't how to do that. Could be a bug? Cheers
[jQuery] Tablesorter plugin doesn't work properly with 1.2
Tablesorter 2.0 plugin doesn't work properly with JQuery 1.2. If I bind a click function to the items in the table, it works well, as far as I try to sort the table. After sorting, the clickable items loose their function. Everything works well with JQuery 1.1.4. Example can be seen here: http://bitkreta.hu/tsorter/index.html Gy
[jQuery] tablesorter plugin not working...
I've tried it with multiple versions of jQuery including 1.1.3, 1.1.4, and
1.2, even referencing the jQuery file living on the tablesorter website. In
IE nothing happens, no errors, but no worky. In Firefox, I get an error in
the tablesorter plugin:
r[row] has no properties
http://localhost/dealerskins/wwwroot/ds2/includes/scripts/jquery.tablesorter
.unpacked.js
Line 293
Here's a snippet of my code:
jQuery:
$('#leadsTable').tablesorter();
HTML:
Customer Name
Vic Acevedo
Adrian Adame
Edgar Aguilar
Terri Alexander
Jane Alford
Andy Matthews
Senior ColdFusion Developer
Office: 877.707.5467 x747
Direct: 615.627.9747
Fax: 615.467.6249
[EMAIL PROTECTED]
www.dealerskins.com
[jQuery] tablesorter plugin - filesize support
Hey all,
Just thought I'd give back to the community and offer up a simple
addition to the great tablesorter plugin by Christian Bach (http://
motherrussia.polyester.se).
I needed a simple sorter based on filesize, and it didn't quite work
with the generic sorter. Thanks to the great structure of his code,
it was a simple task.. easy as:
$.tableSorter.parsers.filesize = {
id: 'filesize',
is: function(s) {
return s.match( new RegExp( /[0-9]+(\.[0-9]+)?\ (KB|B|GB|MB|
TB)/ ) );
},
format: function(s) {
var suf = s.match( new RegExp( /(KB|B|GB|MB|TB)$/ ) )[1];
var num = parseFloat( s.match( new RegExp( /^[0-9]+(\.
[0-9]+)?/ ) )[0] );
switch( suf ) {
case 'B':
return num;
case 'KB':
return num * 1024;
case 'MB':
return num * 1024 * 1024;
case 'GB':
return num * 1024 * 1024 * 1024;
case 'TB':
return num * 1024 * 1024 * 1024 * 1024;
}
},
sorter: $.tableSorter.sorters.numeric
};
/* dont forget to add it to the collection */
$.tableSorter.analyzer.add($.tableSorter.parsers.filesize);
