Tablesorting inside tabs

[cmari]

I was pleased to see the TableSortingPlugin because it looked like a
good substitute for the incredibly useful but apparently no longer
maintained SortableGridPlugin. Rather than try to describe in great
detail the problem I ran into, I've put up an example at
http://cemari.tiddlyspot.com/ - and I'm hoping someone could take a
look and help me figure out a way to make the sorting work. The
tiddler has two tabs, each containing a table. Using the
SortableGridPlugin, both tables are sortable. But in my example file,
the SortableGridPlugin is disabled and the TableSortingPlugin is
enabled. Under those conditions, although it's possible to sort the
table in the currently open tab, the sorting stops working once you
switch to the second tab (unless you refresh the tiddler).
Thanks for any ideas anyone can offer about a better way to do this!
cmari

[Eric Shulman]

> enabled. Under those conditions, although it's possible to sort the
> table in the currently open tab, the sorting stops working once you
> switch to the second tab (unless you refresh the tiddler).

When using *tabs* to display tiddler content, only the visible tab is
actually rendered when the tiddler is first displayed. When you
switch tabs, the current tab's content is removed and the new tab's
content is rendered. This means that any tables contained in those
tabs are being re-created each time you switch between tabs.

Unfortunately, TableSortingPlugin (*) is currently hijacking the
core's refreshTiddler() function in order to add the sort handling to
any *rendered* tables whenever a tiddler is *initially displayed*...
but NOT when switching between tabs. What is needed is to add a
similiar hijack for the core's config.macros.tabs.switchTab()
function, so that it can also add sort handling to tables that are
rendered when switching tabs.

I suggest you submit a feature request to Saq (http://tw.lewcid.org)
and see what he thinks...

HTH,
-e
Eric Shulman
TiddlyTools / ELS Design Studios
(*) ref: http://tw.lewcid.org/#TableSortingPlugin

[Saq Imtiaz]

I've posted a modified version of the plugin here: http://pastebin.ca/874608

This should not catch any tables no matter how they are rendered. Let me know if that works for you, and if so I will update the plugin at tw.lewcid.org

Cheers,
Saq

--
Tiddly Learning ( http://lewcid.org ) : TiddlyWiki news, plugins, themes and educational usage

[cmari]

Thanks, Saq, this has been like getting a new toy - and you've fixed
beautifully the specific problem I had! However, because the new
version seems to make all tables "sortable" by default, it causes an
error to show up in any tiddler containing a table without a defined
header row ("Error in macro <<view>>"). Is there any way to keep it
so "sortable" is an opt-in, not the default?
cmari

On Jan 27, 5:37 am, "Saq Imtiaz" <lew...@gmail.com> wrote:
> I've posted a modified version of the plugin here:http://pastebin.ca/874608
>
> This should not catch any tables no matter how they are rendered. Let me
> know if that works for you, and if so I will update the plugin at
> tw.lewcid.org
>
> Cheers,
> Saq
>

> On Jan 26, 2008 10:31 PM, cmari <cema...@gmail.com> wrote:
>
>
>
>
>
> > I was pleased to see the TableSortingPlugin because it looked like a
> > good substitute for the incredibly useful but apparently no longer
> > maintained SortableGridPlugin. Rather than try to describe in great
> > detail the problem I ran into, I've put up an example at

> >http://cemari.tiddlyspot.com/- and I'm hoping someone could take a

> > look and help me figure out a way to make the sorting work. The
> > tiddler has two tabs, each containing a table. Using the
> > SortableGridPlugin, both tables are sortable. But in my example file,
> > the SortableGridPlugin is disabled and the TableSortingPlugin is
> > enabled. Under those conditions, although it's possible to sort the
> > table in the currently open tab, the sorting stops working once you
> > switch to the second tab (unless you refresh the tiddler).
> > Thanks for any ideas anyone can offer about a better way to do this!
> > cmari
>
> --

> Tiddly Learning (http://lewcid.org) : TiddlyWiki news, plugins, themes and
> educational usage

[Saq Imtiaz]

Yeah sorry, that was an oversight. Try this: http://pastebin.ca/875619

--
Tiddly Learning ( http://lewcid.org ) : TiddlyWiki news, plugins, themes and educational usage

[cmari]

Now it works perfectly - thank you!
The nice little bonus feature about your plugin (as opposed to
sortablegrid) is that it allows links in the header row.
cmari

[TW-lmiller]

This works for standard tables - I have a script (courtest of Eric Schulman) which builds a table for me. I would love to add this sorting plugin but it seems to not recognize the class.

Here's the script:  I have tried adding the |sortable|k tag to the beginning, end and middle of the script (where the titles are rendered. I am getting one of three thngs - two columns called sortable and k, or an error that the property is undefined.

By adding the line to the header as I have done, it seems that is what makes a static table work. Any thoughts? I'm sure it will be extremely obvious after it's pointed out to me but for now I'm stumped.

! Current by priority

<script>

   var out="|sortable|k \n";

   var fmt='|[[%0]]|%1|%2|%3|%4|%5|\n';

   var tag='current';

   var otcm='outcome';

   var itnt = 'intent';

   var nxt = 'next';

   var pr = 'priority';

   var lstChg = 'last modified';

   var tids=store.sortTiddlers(store.getTaggedTiddlers(tag),'modified').reverse();

   out+= "|!Item|!Priority|!" + otcm + "|!" + itnt + "|!" + nxt + "|!Last Updated|\n";

   for (var i=0; i<tids.length; i++) {

      var t=tids[i].title;

      var o=store.getTiddlerSlice(t,otcm);

      var e=store.getTiddlerSlice(t,itnt);

      var n=store.getTiddlerSlice(t,nxt);

      var p=store.getTiddlerSlice(t,pr);

      var d = tids[i].modified;

      out += fmt.format([t,p,o,e,n,d]);

   }

   out += "|" + tag + " Dashboard|c";

   return out;

</script>

[TW-lmiller]

I did not notice how old this post is. Some more information:

1. I have installed the sorting plugin and it works fine with static tables (tables coded directly into a tiddler).

2. It does not work with this script: I have tried inserting the value at A, B, C and D in the script below.The result is either an error, or the "sortable" and "k" values show up as columns.

! Current by priority

<script

>>>>> A : var out="|sortable|k \n";

   var fmt='|[[%0]]|%1|%2|%3|%4|%5|\n';

   var tag='current';

   var otcm='outcome';

   var itnt = 'intent';

   var nxt = 'next';

   var pr = 'priority';

   var lstChg = 'last modified';

   var tids=store.sortTiddlers(store.getTaggedTiddlers(tag),'modified').reverse();

>>>>> B : out +="|sortable|k \n"; 

   out+= "|!Item|!Priority|!" + otcm + "|!" + itnt + "|!" + nxt + "|!Last Updated|\n";

   for (var i=0; i<tids.length; i++) {

      var t=tids[i].title;

      var o=store.getTiddlerSlice(t,otcm);

      var e=store.getTiddlerSlice(t,itnt);

      var n=store.getTiddlerSlice(t,nxt);

      var p=store.getTiddlerSlice(t,pr);

      var d = tids[i].modified;

      out += fmt.format([t,p,o,e,n,d]);

   }

>>>>> C : out +t="|sortable|k \n"; 

   out += "|" + tag + " Dashboard|c";

   return out;

>>>>> D : return "|sortable|k \n"+out; 

</script>

[Eric Shulman]

> 2. It does not work with this script: I have tried inserting the value at
> A, B, C and D in the script below.The result is either an error, or the
> "sortable" and "k" values show up as columns.

The trailing space character is a problem. Instead of:
"|sortable|k \n";
Try using:
"|sortable|k\n";

enjoy,

-e
Eric Shulman
TiddlyTools / ELS Design Studios

----
TiddlyTools needs YOUR financial support...
Help ME to continue to help YOU...
make a generous donation today:
http://www.TiddlyTools.com/#Donations

Professional TiddlyWiki Consulting Services...
Analysis, Design, and Custom Solutions:
http://www.TiddlyTools.com/#Contact

[TW-lmiller]

Thanks Eric - that does work in that the table renders, but now I see a popup "rows is null or not an object".

Here's my first attempt - I added the class to the header row. The "out" declaration renders OK, but the headers aren't clickable and I get that popup. This also happens if I add the sortable|k\n line as a standalone line before the rest of the table header. .

<script>
   var fmt = '|[[%0]]|%1|%2|%3|%4|%5|\n';
   var tag = 'current';
   var otcm = 'outcome';

   var itnt = 'intent';
   var nxt = 'next';
   var pr = 'priority';
   var lstChg = 'last modified';

   var out = '|sortable|k\n|!Item|!Priority|!' + otcm + '|!' + itnt + '|!' + nxt + '|!Last Updated|\n';
   var tids=store.sortTiddlers(store.getTaggedTiddlers(tag),'modified').reverse();

   for (var i=0; i<tids.length; i++) {
      var t=tids[i].title;
      var o=store.getTiddlerSlice(t,otcm);
      var e=store.getTiddlerSlice(t,itnt);
      var n=store.getTiddlerSlice(t,nxt);
      var p=store.getTiddlerSlice(t,pr);
      var d = tids[i].modified;
      out += fmt.format([t,p,o,e,n,d]);
   }

   out += '|' + tag + ' Dashboard|c';
   return out;

The same thing happens if I append it to the out with a line just before the caption as so:
   out += '|sortable|k\n';
   out += '|' + tag + ' Dashboard|c';


In this version, I added the class to the caption. The table renders OK and there is no popup, but the headers aren't clickable.

! Current by priority
<script>

   var tag = 'current';
   var otcm = 'outcome';

   var itnt = 'intent';
   var nxt = 'next';
   var pr = 'priority';
   var lstChg = 'last modified';

   var out = '|!Item|!Priority|!' + otcm + '|!' + itnt + '|!' + nxt + '|!Last Updated|\n';
   var fmt = '|[[%0]]|%1|%2|%3|%4|%5|\n';
   var tids=store.sortTiddlers(store.getTaggedTiddlers(tag),'modified').reverse();

   for (var i=0; i<tids.length; i++) {
      var t=tids[i].title;
      var o=store.getTiddlerSlice(t,otcm);
      var e=store.getTiddlerSlice(t,itnt);
      var n=store.getTiddlerSlice(t,nxt);
      var p=store.getTiddlerSlice(t,pr);
      var d = tids[i].modified;
      out += fmt.format([t,p,o,e,n,d]);
   }

   out += '|' + tag + ' Dashboard|c|sortable|k\n';
   return out;
</script>
</script>