Page MenuHomePhabricator

jquery.tablesorter: Add support for a "fixed" column of row numbers.
Open, LowPublic

Description

Author: winne2i

Description:
Column of fixed row numbers.

In tables where we enumerate something we usually add a first column with row numbers. Of course we set it as unsortable (class=unsortable) – BUT it doesn't prevent the column from being sorted while we sort another column. Then the row numbers get all messed up.

There should be an additional parameter (class or something) for setting which column should not be sorted in any circumstance.
(I cannot think of anything more in that column than row numbers…)

Template:Static_row_numbers creates tables with fixed row numbers:
https://en.wikipedia.org/wiki/Template:Static_row_numbers
https://en.wikipedia.org/wiki/Special:WhatLinksHere/Template:Static_row_numbers

A deprecated method is used for tables in this category:
*https://en.wikipedia.org/wiki/Category:Articles_with_tables_with_fixed_row_numbers
Some of the tables in that category have row number columns that do not sort under any circumstance. Some only sort if that particular row number column header is clicked. For example; if ascending or descending ranking is desired. But none of the row number columns sort when other column heads are clicked.

Wikitext of fixed row numbers in a table on Polish Wikipedia below, and in use here:
https://pl.wikipedia.org/wiki/Wikipedia:Kawiarenka/Kwestie_techniczne_dyskusja/Archiwum/2012-grudzie%C5%84#Sortowanie_tabeli
The row number column does not sort under any circumstance.

{| class="wikitable sortable" style="text-align:center;" align="left"
!class="unsortable"|№
!color
!name
!city
|-
|1||white||John||New York
|-
|2||green||Alice||Warsaw
|-
|3||black||Mark||Rennes
|}

Th attached chart images show what happens if the row number column is not fixed. For example; if the above table wikitext is used on English Wikipedia.
Attached:

tablesort.png (120×665 px, 8 KB)

The best patch would add a column of fixed row numbers to any chart. Without having to manually enter the row numbers. Or reenter the numbers after every addition of more rows in the middle of the table.

Details

Event Timeline

There are a very large number of changes, so older changes are hidden. Show Older Changes

I've created a proof-of-concept implementation using the sortEnd.tablesorter event $.tablesorter fires upon finishing sorting.

The code is essentially five lines:

$('table.sortable th.unsortable.ordinal').each(function(i, th) {
	var $th = $(th), $table = $th.closest('table');
	$table.on('sortEnd.tablesorter', function() {
		$table.find('tr td:nth-child('+ (th.cellIndex+1) +')').each(function(j, td) {
			$(td).text( (j+1) );
		});
	})
});

This means that for every column with class="unsortable ordinal" on the header cell inside a table with class="sortable", the code will re-fill it with consecutive numbers, starting at 1, when the table is sorted. This allows for columns which contain ordinal numbers (the original use case).

The solution was discussed on pl.wikipedia's technical village pump[1][2] and is currently live in its common.js[3]. It's used on a few pages already, including the aforementioned [[pl:Miasta w Polsce (statystyki)]] and our help page with a list of interwiki codes, [[pl:Pomoc:Interwiki]].

[1] [[pl:Wikipedia:Kawiarenka/Kwestie techniczne#Poprawa tabeli w Miasta w Polsce (statystyki)]]
[2] [[pl:Wikipedia:Kawiarenka/Kwestie techniczne#Sortowanie tabeli]]
[3] [[pl:MediaWiki:Common.js]], at the very bottom

winne2i wrote:

And I'd say it works very well…! Thanks, Bartosz!
I really hope it will be implemented widely soon, as it's ready to work!

  • Bug 40634 has been marked as a duplicate of this bug. ***

*** T4315 has been marked as a duplicate of this bug. ***

I am not sure if T4315 and T12433 are resolved duplicates of this. I marked T4315 as a resolved duplicate of this, but now I am not sure. Maybe we can fix that problem too.

It would be nice if the fixed number column was automatically numbered (row numbering) without having to fill in anything in the column cells at all.

T12433 offers some automatic numbering JS that does this:
https://en.wikipedia.org/wiki/User:Mike_Dillon/Scripts/autonumber.js

via class="wikitable autonumber"

The example given at T12433 is this: "Example: say an author creates a chart that alphabetically lists all of the 535 members of the US Congress. It would be laborious to list the numbers 1, 2, 3, … 533, 534, 535 near each of the 535 entries on the list. And next time the list changes (at the next election, when names are added to or subtracted from the list of Congress members), the author would have to repeat the laborious process of numbering the 535 entries on the list all over again."

For T12433 the original poster's user page has moved to here:
https://en.wikipedia.org/wiki/User:Joseph_A._Spadaro

The table wikitext he provided in T12433 produces this:
http://en.wikipedia.org/wiki/User:Timeshifter/Sandbox29

To just get the fixed numbering column without manually adding cells to each row or using JS, one could use CSS generated-content cells with counters:

table.autonumber > tbody {
  counter-reset: autonumbering;
}
table.autonumber > tbody > tr::before {
  counter-increment: autonumbering;
  content: counter(autonumbering);
}
table.autonumber > thead > tr::before {
  content: "№";
}
table.autonumber > thead > tr::before, table.autonumber > tbody > tr::before {
  display: table-cell;
  padding: 0.2em;
  border: 1px solid #AAA;
  vertical-align: middle;
  text-align: center;
}

(In reply to Yair Rand from comment #17)

To just get the fixed numbering column without manually adding cells to each
row or using JS, one could use CSS generated-content cells with counters: ...

It works great, and is a lot easier to use than the row-numbering method I was using before.

I am using Yair Rand's method on a ShoutWiki wiki. Currently using this easy method on the table on this page:
*http://cannabis.shoutwiki.com/wiki/2013list

Before I would have to manually create a cell at the beginning of each row in the table. Here is the table with the old method:

  • [Removed incorrect link]

Now all I have to do is add this to the top line of any table:

class="sortable autonumber"

I adapted the CSS a little. Here it is:
http://cannabis.shoutwiki.com/wiki/MediaWiki:Common.css

I removed the border coloring, and I used # for the header. See:
https://en.wikipedia.org/wiki/Number_sign

  • # is more common in American English.

I hope this easy method can be implemented soon on Wikipedia and the Commons. It is by far the easiest auto-row-numbering method I have seen. It would make things a lot easier than the hacks currently listed at Help:Sorting:
*https://en.wikipedia.org/wiki/Help:Sorting - see "Static column" and following sections.

winne2i wrote:

This solution is great, I hope this one will be implemented soon.

As for '#' or '№' – I think there could be also an empty cell or even a cell without borders and background (as if there was no cell). It could also be up to local admins choice.

(In reply to Yair Rand from comment #17)

To just get the fixed numbering column without manually adding cells to each
row or using JS, one could use CSS generated-content cells with counters:

<snip>

I was thinking about doing this with just CSS, and this solution is
very neat, but is has two problems:

  1. Obviously, no support for old browsers. I understand that this is a trade-off that we're willing to make.
  1. Less obviously, no support for internationalization!
    • No support for digit conversion (some languages use other numerals than 0 1 2 3 4 5 6 7 8 9, e.g. Arabic uses ٠‎ ١‎ ٢‎ ٣‎ ٤‎ ٥‎ ٦‎ ٧‎ ٨‎ ٩‎). I don't think this is possible with CSS (although I might be wrong).
    • No support for various typographic conventions on the number formatting; again, proper Polish would require a dot to be placed after the ordinal number (as in 1., 2., 3. etc. for first, second, third), some might want 1st, 2nd, 3rd etc. in English as well, and who knows what other languages might require.
    • In the heading neither "№" nor "#" would be acceptable in, say, Polish (we use "Lp." which is an abbreviation of "ordinal number"), although this might be worked around by just leaving the space empty as tm112 suggests above; I'm not sure if that'd be acceptable for all languages we support in MediaWiki, though.

It's probably a good solution on a per-wiki basis (for at least some
languages), but I'm afraid we won't be able to use it in core unless we
manage to solve the above problems (might be doable with some deep LESS
magic, at least for the latter two).

(In reply to Bartosz Dziewoński from comment #20)

  • No support for digit conversion (some languages use other numerals than 0 1 2 3 4 5 6 7 8 9, e.g. Arabic uses ٠‎ ١‎ ٢‎ ٣‎ ٤‎ ٥‎ ٦‎ ٧‎ ٨‎

٩‎).

I don't think this is possible with CSS (although I might be wrong).

I underestimated the CSS designers, it does support this :) (in the spec at least). See http://www.w3.org/TR/css-counter-styles-3/ and http://www.w3.org/TR/predefined-counter-styles/.

winne2i wrote:

They also say (on w3) that you can add suffix which solves the problem with number formatting that you mentioned. In such way those numbering issues are solved but every wiki would have to set its own @counter-style and heading cell content.
(Or – can it be preset?)

On long lists autonumbering table rows means sorting any column takes longer. Around a couple seconds to sort a column 800 rows long. This is true whether using the easy CSS method or the hard CSS method (with every cell manually added in).

I link to an example below of a table with around 800 rows.

With autonumbering:
http://cannabis.shoutwiki.com/w/index.php?title=GMMcities&oldid=6398
Table from above-linked old revision has been copied to this sandbox after converting to the easy CSS method:
http://cannabis.shoutwiki.com/wiki/User:Timeshifter/Sandbox_4

Same table without autonumbering sorts faster:
http://cannabis.shoutwiki.com/wiki/User:Timeshifter/Sandbox_5

The initial click takes a couple seconds in all cases. Click again.

I haven't been able to find a working JS method of autonumbering. Can someone link to a table with JS doing the autonumbering. I want to see how fast it is.

I have not seen any JS tables linked from previous comments that work for me. Please point me to working JS I can copy to Shoutwiki, or to my personal user JS on a wiki. So I can test it on some tables.

  • Bug 10433 has been marked as a duplicate of this bug. ***

In comment 18 I linked to a row-numbered sortable table in a page that no longer has that table. I copied the table from an old revision of the page to this sandbox:
http://cannabis.shoutwiki.com/wiki/User:Timeshifter/Sandbox_10
This table has 168 rows. Sorting is not slowed down by the auto numbering.

The auto numbering CSS used is found here:
http://cannabis.shoutwiki.com/wiki/MediaWiki:Common.css
CSS is in the section titled "Easy method of auto numbering of table rows".

As I said previously (comment 23) sorting a table with 779 rows is slowed down by the addition of auto numbering:
http://cannabis.shoutwiki.com/wiki/User:Timeshifter/Sandbox_4

(In reply to Bartosz Dziewoński from comment #20)

  1. Obviously, no support for old browsers. I understand that this is a trade-off that we're willing to make.

According to http://caniuse.com/#feat=css-counters the CSS solution even works in IE8, and because IE7 and below are now grade C, a JS solution can't reach a greater level of support anyway.

I doubt that there is great support for CSS Counter Styles Level 3 yet, but at least most of the stuff from Predefined Counter Styles should be supported, so localization up to the level it is done for ordered lists ([1]) should be possible.

[1] https://git.wikimedia.org/blob/mediawiki%2Fcore.git/902f90a123bef85cfaf2b206c51a89ffdd416674/resources%2Fsrc%2Fmediawiki.legacy%2Fshared.css#L935

Is there any reason this can not be implemented right now? I will be adding row numbering to dozens of tables right away when this is implemented. Once I do so, I am sure it will be immediately added to hundreds more tables as others see how easy it is to add something like
class="wikitable sortable rownumbers"

See Help:Sorting to see how convoluted it is to add row numbers now without a class for it:
https://en.wikipedia.org/wiki/Help:Sorting
https://en.wikipedia.org/wiki/Help:Sorting#Auto-ranking_or_adding_a_row_numbering_column_.281.2C2.2C3.29_next_to_a_table
See also the talk page and this current thread (before it goes to the talk archive):
https://en.wikipedia.org/wiki/Help_talk:Sorting#Accessibility_issues_when_implementing_.22rank.22_in_a_separate_table

Change 234473 had a related patch set uploaded (by Gerrit Patch Uploader):
Add class mw-autonumber for tables

https://gerrit.wikimedia.org/r/234473

A good patch, it works good for ltr- and rtl-direction. But why starts the classname with mw- ? I suggesst use of "autonumber" instesd "mw-autonumber". Every user read this HTML-code in the wiki-editor. It should be simple and short. For the counter i suggest use of "row":

table.autonumber tr td:first-child:before {

counter-increment: row;
content: counter(row);
}

But why starts the classname with mw- ? I suggesst use of "autonumber" instesd "mw-autonumber".

To avoid clashes with classes added to MediaWiki:Common.css, e.g. T42618#434098.

Hmm, "autonumber" might be better in this case for consistency with existing classes from this script (like "sortable") and since the script aspires not to be MediaWiki-dependent.

I prefer simplicity. There is no great need for "mw" in front of the class name. I have no problem with "autonumber", "rownumber", or just "rows". Or anything else without "mw" in front of it.

I doubt too many people other than me used the old class=autonumber CSS provided by Yair_rand higher up in this thread.

See:
http://cannabis.shoutwiki.com/wiki/MediaWiki:Common.css

It has the Yair_rand CSS for easy autonumbering used on these pages:
http://cannabis.shoutwiki.com/wiki/User:Timeshifter/Sandbox_10
http://cannabis.shoutwiki.com/wiki/User:Timeshifter/Sandbox_4
http://cannabis.shoutwiki.com/wiki/2013list

By changing to the latest Mediawiki class name those pages will still work when the mediawiki software used on Shoutwiki incorporates the new automatic row numbering class. I can then delete the old Yair_rand CSS for autonumbering from MediaWiki:Common.css on that Shoutwiki wiki.

You almost convinced me to drop the "mw-" prefix, but then I noticed, that autonumber is already in use for autonumbered external links. This shouldn't be a problem if everything is done right, as in one case the class is on an <a>, in the other case on a <table> element, but you never know with what expectations users added rules for .autonumber to their personal CSS. Also note that there is a class mw-datatable which is used on tables in wiki content, too, so the "mw-" prefix isn't my invention.

Of course I'm open to arguments against my concerns and other suggestions, the currently proposed patch won't be the last one.

What about using "rownumber"? Is that in use on Wikipedia, or other wikis?

"mw-" is used for mw-collapsible and mw-collapsed on Wikia:
*http://community.wikia.com/wiki/Help:Collapsing

But not on Wikipedia:
*https://en.wikipedia.org/wiki/Help:Collapsing

A side note. I noticed that the numbeo.com site uses fixed row numbering on most of their many sortable tables:
*http://www.numbeo.com - for example:
*http://www.numbeo.com/crime/rankings_by_country.jsp - the rank column.

Hmm, i still find the whole feature somewhat confusing:

Deployed here:
https://test.wikipedia.org/wiki/User:TheDJ/T42618

And it's still purely a stylistic effect, that will rely on people still fixing the fallback values, which of course they won't...

And the whole initial premise of it being 'confusing' that the numbers follow the sort state, is rather an arbitrary valuation as well. I find it confusing if they don't follow the sorting actions personally. I don't know. I'm still not enthusiastic.

https://test.wikipedia.org/wiki/User:TheDJ/T42618

And the whole initial premise of it being 'confusing' that the numbers follow the sort state, is rather an arbitrary valuation as well. I find it confusing if they don't follow the sorting actions personally. I don't know. I'm still not enthusiastic.

I suggest that the patch remove the sorting icon from the rank column. Then people are more likely to figure out that the rank column is not supposed to sort, nor change at all. The patch needs to add the "unsortable" class to the rank column header. See how here:
*https://en.wikipedia.org/wiki/Help:Sorting#Making_a_column_unsortable

It seems that the patch does not create a column for the row numbers? Why not?
*https://test.wikipedia.org/wiki/User:Timeshifter/Sandbox2

What about using "rownumber"? Is that in use on Wikipedia, or other wikis?

rownumber in singular or rownumbers in plural? But yes, that's probably the best idea.

Hmm, i still find the whole feature somewhat confusing:

Deployed here:
https://test.wikipedia.org/wiki/User:TheDJ/T42618

I just added a second example, to both show how it works with an unsortable first column and how it looks like in a different language.

And it's still purely a stylistic effect, that will rely on people still fixing the fallback values, which of course they won't...

Well, in most cases the fallback values won't be added at all, so users of IE6 and IE7 will see an empty row instead of the rank, which isn't perfect (that's why I think it should be possible to add a fallback), but doesn't hurt much.

And the whole initial premise of it being 'confusing' that the numbers follow the sort state, is rather an arbitrary valuation as well. I find it confusing if they don't follow the sorting actions personally. I don't know. I'm still not enthusiastic.

In my example of course it doesn't make sense to have a column for the rank in the current order, but for example the table in https://de.wikipedia.org/wiki/Liste_der_Gro%C3%9Fst%C3%A4dte_in_Deutschland uses a hack to add such a fixed rank column, and it does make sense there.

It seems that the patch does not create a column for the row numbers? Why not?

Because it doesn't know what to use as heading.

OK, I see that currently it requires an existing blank column. See:
https://test.wikipedia.org/wiki/User:Timeshifter/Sandbox3

How about "rownumbers" class for adding numbers to an existing blank column? And "autorownumbers" class for adding both the numbers and the column. See:

To just get the fixed numbering column without manually adding cells to each row or using JS, one could use CSS generated-content cells with counters:

But why require an existing column at all? And a blank header is fine for the number column. I used Yair_rand's method without problems on Shoutwiki. I removed the border coloring from his CSS. Maybe some other changes in the CSS too. I don't remember, since it was done a couple years ago. Here is what I did:
*http://cannabis.shoutwiki.com/wiki/MediaWiki:Common.css
*http://cannabis.shoutwiki.com/wiki/2013list - see section called "Alphabetical city list".

If editors are required to add a blank column first this will be used a lot less than it could be. Country lists have over 200 rows.

And a blank header is fine for the number column.

I would consider a blank header just because the user was to lazy to add a row for it as bad practice. It's not clear whether that blank header is acceptable for everyone, see matmarex's comment:

  • In the heading neither "№" nor "#" would be acceptable in, say, Polish (we use "Lp." which is an abbreviation of "ordinal number"), although this might be worked around by just leaving the space empty as tm112 suggests above; I'm not sure if that'd be acceptable for all languages we support in MediaWiki, though.

If editors are required to add a blank column first this will be used a lot less than it could be. Country lists have over 200 rows.

Adding a blank column is easy. That's two clicks in Visual Editor, or replacing /^\| / with | || with the search-and-replace-tool in the WikiEditor toolbar. Given that users are currently willing to add code like on https://en.wikipedia.org/wiki/List_of_U.S._states_by_incarceration_rate#Incarceration_rate_by_state adding a blank column won't scare them away.

How about something like header=Lp in the top of the table wikitext? So to get Polish numbers and header:

{|  lang="pl" header="Lp" class="wikitable sortable rownumbers"

Adding a blank column is easy. That's two clicks in Visual Editor, or replacing /^\| / with | || with the search-and-replace-tool in the WikiEditor toolbar. Given that users are currently willing to add code like on https://en.wikipedia.org/wiki/List_of_U.S._states_by_incarceration_rate#Incarceration_rate_by_state adding a blank column won't scare them away.

I am the one that added the fixed row numbering to that article. It had previously been in rank order, and so it was impossible to update it easily. I added much more recent numbers that I copied from the data table of a Commons map of US incarceration rates that someone else did. It was in alphabetical order, and not rank order. The Wikipedia article had been using 2009 numbers until I updated it this summer.

This patch will not be used much if it depends on skilled editors. I don't use Wikieditor. I rarely use the Visual Editor. I barely understand some CSS, and I occasionally have figured out (and soon forgotten) some regex methods in Notepad++ to do complicated replacements within the Unicode wikitext of long lists or SVG images. Very frustrating. I am not a developer like you. I am skilled in other areas.

Currently, people are adding rank columns that are not fixed. Many of these table lists are way out of date because even a single change messes up the rank order, and the list is soon completely out of order. People stop updating it at all. A fixed row-number column fixes this because then the list can be put in alphabetical order. Alphabetical order is far easier to maintain. Sorting a column instantly produces a list in rank order. If this patch is dead simple to use then hundreds of tables will then be easy to set up and maintain.

I'm of the opinion that functions like this should 'just work' and so far none of the proposals I have seen qualify as 'just work'. That means that people will use it incorrectly and there will be confusion. That's not a good experience. I'm also pondering: What would the dialog window look like for this in VE.

As an 'overall picture' kind of guy, i'm just not enthusiastic and I think that we should be careful of 'feature creep' and long term maintenance burden. Sometimes it's better to NOT have a feature, then to add extra complexity.

Adding a blank column is easy. That's two clicks in Visual Editor,

It is not immediately intuitive, but it is easy after I figured it out! So it takes exactly 3 steps to add a row-number column to an existing table. See history:
https://test.wikipedia.org/w/index.php?title=User:Timeshifter/Sandbox4&action=history
https://test.wikipedia.org/wiki/User:Timeshifter/Sandbox4

Now that I see how easy it is to add a blank column this is definitely easier than my previous suggestion. I could explain it all in fewer paragraphs than is currently used in Help:Sorting. See the section currently titled "Auto-ranking or adding a row numbering column (1,2,3) next to a table".

How does this fail in Internet Explorer 7? Is it just a blank column? If so, that is not important in my opinion.

How does this fail in Internet Explorer 7? Is it just a blank column? If so, that is not important in my opinion.

Yes, in IE7 and other unsupported browsers (if any), just a blank column will be shown. Or, if you add the numbers as fallback with the rownumbers-fallback class, these will be shown, but will be sorted along with the rest of the table, instead of being fixed.

I was looking at:
https://gerrit.wikimedia.org/r/#/c/234473

and a note from Sept 3, 2015 3:31 AM says "Added code to make the rank column always unsortable"

I assume this is added to the column header?:

class="unsortable" |

That is necessary to remove the sorting icon from the header. So people will not be confused.

I checked the Internet Explorer 7 page on Wikipedia:
https://en.wikipedia.org/wiki/Internet_Explorer_7

A reference from that article said that IE7's desktop browser share in August 2015 was 0.31%.
http://marketshare.hitslink.com/browser-market-share.aspx?qprid=2&qpcustomd=0

Is T113340 (Allow to request modules by CSS classes in content) holding this up?

I was looking at the proposed patch:
https://gerrit.wikimedia.org/r/#/c/234473

Trying to decipher the holdup from the notes there. There are so many tables not being updated because they are in rank order initially.

I updated the tables in this Wikipedia article:
*List of countries by total health expenditure per capita.

I noticed on the talk page that I had left a message over 3 years ago suggesting adding row numbering. No one had updated the list since then even though this is a topic frequently in the media.

The reason is that people had the list in rank order instead of in alphabetical order. I put it in alphabetical order which makes it much easier to update. See some of my method here:
*https://commons.wikimedia.org/wiki/Commons:Convert_tables_and_charts_to_wiki_code_or_image_files#Web_to_LibreOffice_Calc_to_tab2wiki

Unfortunately, the current primitive method of row numbering I am using over the last few years breaks many functions of tables:
*Flags can not be used because they break the alignment of the row-number column with the rest of the table. This adds up at the bottom of the table where the rows will be completely misaligned, especially at smaller text sizes.

*A note column can not be used due to narrow screens breaking alignment due to laddering.
*References can not be added within the table due to the superscript increasing the height of that one line, and thus breaking alignment.
*The tables can not be put side by side or laddering will occur, and alignment is broken.

This health expenditure table has to do without more than a few years of data or the table is too wide. This is a problem on many such lists of nations inside tables. For example; many more years of data could be added to these popular articles:
*List of countries by intentional homicide rate
*List of countries by incarceration rate

There are many more years for homicide rates for example. See:
*User:Timeshifter/Sandbox62

I put some tables in a sandbox of mine to see if the patch has been implemented in the test release of MediaWiki 1.27.0-wmf.7.
*https://test2.wikipedia.org/wiki/User:Timeshifter/Sandbox

The patch has not been implemented in the test release of MediaWiki 1.27.0-wmf.7.
*https://www.mediawiki.org/wiki/MediaWiki_1.27/wmf.7

Timeshifter renamed this task from jquery.tablesorter: Add support for a "fixed" column to jquery.tablesorter: Add support for a "fixed" column of row numbers..Jan 14 2016, 10:39 PM
Timeshifter updated the task description. (Show Details)
Timeshifter set Security to None.

Here are some lists with row numbering:
*https://en.wikipedia.org/wiki/List_of_countries_by_incarceration_rate
*https://en.wikipedia.org/wiki/List_of_countries_by_intentional_homicide_rate
*https://en.wikipedia.org/wiki/List_of_countries_by_total_health_expenditure_per_capita
*https://en.wikipedia.org/wiki/List_of_U.S._states_by_incarceration_rate

Discovered another problem with the current method of row numbering. Italics used for some of the country names causes the rows to not align the farther down the list one goes. See this list revision:
https://en.wikipedia.org/w/index.php?title=List_of_countries_by_intentional_homicide_rate&oldid=727879356
Had to remove the italics to fix it.

These lists are popular and are maintained since they are in alphabetical order. The row numbering allows rank order to be seen easily with a click of the mouse on the sorting button.

The problem is that the initial setup of such lists is tedious, and subject to many rules such as no italics, no flag icons, and no references within the chart itself. All break the row alignment. Along with wide tables. So the number of columns has to be limited to allow the charts to be seen correctly on narrower screens.

It seems there are two feature requests being mixed here:

  1. Having a "fixed" column that won't change when the rows are sorted. Typically a column that numbers the rows, which we want to treat separately and not related to the other fields in each row.
  2. Not needing to manually maintain the numbers in these rows when editing pages so that you don't have to change all other rows when inserting or re-ordering entries.

The current patch essentially implements a solution for issue 2 (automatically number the rows and render the row's number). It also kind of solves issue 1. It doesn't really preserve the authored cell contents, but rather it reproduces them dynamically in CSS. This still requires manual work and seems fairly limited.

I'd recommend solving these problems separately. Two ideas:

  • Allow for automatic numbering of rows. Perhaps by providing syntax in wikitext that would allow a cell in each row to be set as the placeholder for an incrementing number within the current table. Or perhaps by generating the tables with a Lua module? Or by keeping them maintained manually, with perhaps a client-side feature in VisualEditor/WikiEditor to automatically encourage re-indexing the "index number" cell based on a particular marking on the class (e.g. a class on the table, similar to "wikitable" and "sortable").
  • Add a feature in tablesorter that allows one of the columns to be marked as "static" (similar to "unsortable") which will preserve that table column as-is regardless of the sorting of the rest of other columns for each row.

Any system of row numbering is fine by me. I saw another list today I would like to add row numbers to:
*https://en.wikipedia.org/wiki/List_of_minimum_wages_by_country

Click the header of the hourly PPP minimum wage column to get a list covering the highest to lowest minimum wages by country. USA is around 15th on the list. Not sure since there is no row numbering.

That list though is too wide to use the method I have used in other lists. Such as in this one:
**https://en.wikipedia.org/wiki/List_of_countries_by_intentional_homicide_rate

This may be a starting point to pass on to others interested in this topic:
Articles containing tables with fixed row numbers are in this hidden category:
*https://en.wikipedia.org/wiki/Category:Article_with_table_with_fixed_row_numbers

Please add the category to any article I have missed.

I noticed that the 800 row table with fixed row numbers is now sorting fast for me:
*http://cannabis.shoutwiki.com/wiki/User:Timeshifter/Sandbox_4

Later edit: I checked sorting using an 11-year old PC, and I see that sorting took 2 seconds for that very long table of 779 rows.

On that same 11-year-old PC sorting is fast on lists of around 200 rows. Such as this one that has fixed row numbers:
*http://cannabis.shoutwiki.com/wiki/Basic_2013_Global_Marijuana_March_city_list

So since country lists on Wikipedia are a little over 200 rows, then this type of CSS will not be a problem, even on old PCs. Country lists are about the longest lists on Wikipedia.

Change 234473 abandoned by Krinkle:
Add class rownumbers for tables

Reason:
Closing to reduce review noise. Feel free to re-open once task has settled on a solution.

https://gerrit.wikimedia.org/r/234473

Could someone explain to me in simple English why there is no simple way to add a column of fixed row numbers to tables. What is blocking this? Many tables are out of date due to their use of rank order columns that are completely out of whack. Due to any change in data in the table.

There are thousands, if not tens of thousands, of tables that would benefit from this. Currently, the only method of adding a column of fixed row numbers is so tedious, timeconsuming, and problematic that only 5 tables has a column of fixed row numbers. See them here:
*https://en.wikipedia.org/wiki/Category:Article_with_table_with_fixed_row_numbers

I bring this up now due to this template deletion discussion:
*https://en.wikipedia.org/wiki/Wikipedia:Templates_for_discussion/Log/2018_April_10#Template:Rank_order

Removing the rank numbers might be too bold. People don't realize that there is an alternative that works better, and does the same thing (row numbers). They get pissed when the rank numbers are removed, and not replaced with the alternative (row numbers). And that takes some work. The template serves a purpose in remembering some tables to go back to someday, and hopefully someone will work on them. It also helps developers see the need for their patch that they sometimes work on, but haven't finished due to problems. There are thousands of tables that this template could be placed on.

A patch would be so much simpler.

You could convince an English Wikipedia administrator to copy the solution from Polish Wikipedia that I implemented there five years ago, see comment above: T42618#433972.

matmarex. Could you edit that old comment of yours and add in full URLs so that we can check it out? I have had to do that on old comments after we changed over to phabricator. Is the JS the same? You might update that also on that post.

And could you start a new comment listing some more info and links since then. Links to working tables, etc.. Also, any how-to pages concerning its use. I can use Google translation to figure it out somewhat.

Are people using this function of tables? Is it easy to use? Does it require a blank column to be set up? Or does it create the column too?

matmarex. Could you edit that old comment of yours and add in full URLs so that we can check it out?

Here you go:

The solution was discussed on pl.wikipedia's technical village pump[1][2] and is currently live in its common.js[3]. It's used on a few pages already, including the aforementioned [[pl:Miasta w Polsce (statystyki)]] and our help page with a list of interwiki codes, https://pl.wikipedia.org/wiki/Pomoc:Interwiki .

[1] https://pl.wikipedia.org/wiki/Wikipedia:Kawiarenka/Kwestie_techniczne_dyskusja/Archiwum/2012-grudzie%C5%84#Poprawa_tabeli_w_Miasta_w_Polsce_%28statystyki%29
[2] https://pl.wikipedia.org/wiki/Wikipedia:Kawiarenka/Kwestie_techniczne_dyskusja/Archiwum/2012-grudzie%C5%84#Sortowanie_tabeli
[3] https://pl.wikipedia.org/wiki/MediaWiki:Common.js , at the very bottom

And could you start a new comment listing some more info and links since then.

Which "more info and links" are needed? What's missing in the current information provided? (It's hard to provide more info if you don't get told which info.)

Thanks for the links. I would like some links to long tables where the matmarex JS method of row numbering is being used. Of the links you provided this is the only one with such a table:
*https://pl.wikipedia.org/wiki/Wikipedia:Kawiarenka/Kwestie_techniczne_dyskusja/Archiwum/2012-grudzie%C5%84#Sortowanie_tabeli

This is the class needed in the column header to fix the row numbers:

!class="unsortable ordinal"

Here is the wikitext for that table below. I don't like the fact that one has to add the numbers. That is problematic. For example; with a long alphabetical list one would have to manually renumber the row numbers after each new row added in the middle of the table. Especially tedious the farther up the table one adds the row. Since all row numbers after the new row entry would have to be changed.

Can this JS solution be changed so that it also creates the row numbers? That way we can leave the row number column blank, and let the JS fill it in. Or maybe a combination of JS and CSS. Since table sorting depends on jquery.tablesorter.js, then I don't see why this JS can not be part of the solution. I like that the column header is default blank for the row number column. It is obvious it is a row of numbers, and that it is not sorting. Yet one could manually add a column header name, symbol, or icon.

{| class="wikitable sortable" style="text-align:center;" align="left"
!class="unsortable ordinal" width="25px"|
!width="60px"|kolor
!width="60px"|mebel
!width="60px"|miasto
|-
|1||biały||stół||Kraków
|-
|2||zielony||taboret||Iława
|-
|3||czarny||szafa||Puck
|}

Is the previous CSS solution fixable? It does not require manually entering the row numbers. Could it be combined with the matmarex JS solution?

The_Equalizer raised the priority of this task from Low to High.Sep 6 2018, 8:38 PM

Team Phabricator, will there be any traction on this? This is such a core function of any table that I am surprised this has stalled for so long.
As a builder of a few advanced tables this has been quite literally a bug-bear to me, even more so that we have a working solution on Polish Wiki.
I appreciate the English Wiki will need some testing, but really this needs to be actively worked with a higher priority.
Even if we implement this initially and then going forward, add functionality to make any column fixed.
If need be I can supply coffee and biscuits to help get this going.

Aklapper lowered the priority of this task from High to Low.Sep 6 2018, 10:02 PM

@The_Equalizer: Welcome to Phabricator! I'm resetting the priority as you don't seem to plan to work on fixing this (correct me if I'm wrong!) and as the Priority field summarizes and reflects reality and does not cause it. If you're interested in contributing code to fix this, please refer to https://www.mediawiki.org/wiki/How_to_become_a_MediaWiki_hacker . Or you could propose this task for the next Community Wishlist survey. Thanks!

List of countries by intentional homicide rate:
https://en.wikipedia.org/wiki/List_of_countries_by_intentional_homicide_rate

The current version is very usefully sorted initially by region and subregion. See my comment on the talk page:

I noticed that the current version of the table is wider than the last time I checked months ago:
https://en.wikipedia.org/w/index.php?title=List_of_countries_by_intentional_homicide_rate&oldid=858063940

A separate column of row numbers (something I added to a few charts) does not work correctly with wider tables and narrow screens. The rows do not align.

I suggest adding an integrated rank order column instead. There is new info in Help:Table in the Visual Editor section at the end.

It makes editing of tables much easier and faster. It makes adding an integrated rank order column very easy too. Just copy and paste from another table.

Of course when the table is put in rank order, it is not sorted by region or subregion.

That is why there is a Phabricator thread asking for an integrated row number column that remains static when the rest of the table is sorted. Then we could have wide tables that are initially sorted in any way we please.

See Help:Sorting and the section called something like: "Auto-ranking or adding a row numbering column (1,2,3) next to a table". See phab:T42618.

List of U.S. states by incarceration and correctional supervision rate is an example of a table that needs a fixed row number column. Because there are 3 separate columns that are important enough that people want to see them in rank order. That can't be done with an integrated rank order column. It can only be done with a fixed row number column.

List of countries by incarceration rate may or may not need a fixed row number column. It depends on whether one believes there is more than one column that people want to see in rank order.

A much easier and better method for creating a static row number column exists. Sandbox 89 linked below uses the new method, and is updated as needed. The table in Sandbox 89 is taken from a version of "List of countries by incarceration rate".
*https://en.wikipedia.org/wiki/List_of_countries_by_incarceration_rate
*https://en.wikipedia.org/wiki/User:Timeshifter/Sandbox89

It uses:
*https://en.wikipedia.org/wiki/Template:Static_column_begin - see its documentation.
*https://en.wikipedia.org/wiki/Template:End

{{Static column begin}} redirects to {{Rank}}

Can any of that template code be used here for this phabricator task?

I added class="wikitable nowrap sortable" to simplify things further.

The nowrap class means the table rows do not ladder as the screen is narrowed. So the rows always align.

Header-lines=4 allows text alone to be zoomed to very high levels without causing row alignment problems.

Here is the wikitext at the top that adds the fixed row-number column:

{{Rank | rows={{TRC|ignore=1|id=nations}} | header-lines=4 | caption=Incarceration populations and rates. From [[World Prison Brief]].}}
{|class="wikitable nowrap sortable mw-datatable" border=1 style="text-align:right;" id="nations"
|-valign=bottom

And this goes at the end of the table:

{{End}}

It has been pointed out to me that row alignment is off when viewed in mobile browsers. This is when using the previously mentioned {{Rank} template.

See discussion here:
https://en.wikipedia.org/wiki/Talk:List_of_countries_by_population_(United_Nations)#Alignment_problem

This is another reason for an integrated, fixed row number column.

CasparV closed this task as Invalid.EditedApr 28 2021, 8:12 AM
CasparV subscribed.

Unfortunately the {rank}-template does not seem to work for regular Wikipedia articles. I have tested the results from multiple pages on multiple browsers and multiple platforms and it consistently fails. Screenshots here:

https://imgur.com/a/TsaZoFp

The {rank}-template does seem to work on:

Yeah... it's gonna suck to fix this bug if you can only see it in 'production'.

(incomplete) list of pages using this template: https://en.wikipedia.org/w/index.php?title=Special%3AWhatLinksHere&target=Template%3ARank&namespace=

Sorry for accidentally closing the task. I'm a noob.

The new template {{Static row numbers}} is a lot better:
*https://en.wikipedia.org/wiki/Template:Static_row_numbers

Works great in both desktop and mobile. For multiple examples see:
*https://en.wikipedia.org/wiki/User:Timeshifter/Sandbox144

Unlike {{rank}} it works with the Visual Editor.

For tables with a single header row all that is needed is to add {{static row numbers}} just above the top of the table wikitext.
And class=static-row-numbers to the top line of the table wikitext.

For other options see the template documentation.

Is there any reason this could not be added to the Mediawiki software? That way people could just add the class to get the result.

And maybe something could be added so that multiple header rows don't need class=static-row-header in order for the row numbering to be correct.

Expanding on T42618#434018, wikt:pl:MediaWiki:Gadget-autonumber.css works with both regular and sorted (class="sortable") tables, either HTML or wiki-syntax ({| |}), all basic skins (including mobile Minerva). No extra column needed, just add class autonumber. Example: wikt:pl:WS:STAT.

Example: wikt:pl:WS:STAT.

Thanks PeterBowman. I want to see the wikitext for a simple table. Not this:
https://pl.wiktionary.org/w/index.php?title=Wikis%C5%82ownik:STAT/j%C4%99zyki&action=edit

Can you create a user sandbox page on that wiki with some simple example tables?

Can you create a user sandbox page on that wiki with some simple example tables?

Sure, see wikt:pl:Wikisłownikarz:Peter Bowman/autonumber (permalink). It looks like desktop Minerva has a different set of rules which I have not considered yet.