Yes thats out of scope

No I'm not moving it to the bottom. It makes no sense to hide it on the bottom of the second or third page scroll

your face must be really bruised the number of times that you smash your palm into it

Im sorry that you are not open to feedback and are so closed minded. Once again.

Not seeing it on

http://127.0.0.1:4444/administrator/index.php?option=com_users&view=levels

Also not seeing on User Notes or Users

maybe something to do with this:

The first thing I noticed was that the function is not available everywhere, but in fact it makes sense to implement it on all tabular pages in the admin panel.

The js is producing an error when it can't select the text to use for the column header. This happens whenever the header is not a link because for those headers there is no span containing the text

Also "If you hide the cell that contains the scope then you break the tables accessibility. This is usually (always?) the cell that is the link."... yeah, you are now doing that...

"it can be determined programmatically because it is a th not a td and has a scope="row""

This happens whenever the header is not a link because for those headers there is no span containing the text

https://github.com/joomla/joomla-cms/pull/32974/files#diff-5ff666260572eb6e2425429e4ffa0b6815227394932a44d65540f215d4aef8f2R94-R99

oops that got mixed in the js rewrite by @Fedik

@Fedik can you look at putting both of those back please

Also @Fedik please remove the $ from the variables, the jQuery era was many years ago a thing...

the jQuery era was many years ago a thing...

I feel attacked ;-) Im still writing very pretty jQuery code ;-)

I feel attacked ;-) Im still writing very pretty jQuery code ;-)

Ok, I can rephrase the jQuery to PHP, oops...

I will look

please remove the $ from the variables

Nope, and it nothing to do with jquery, it for code readability. I would suggest you to use it also.
$ used for variables that holds DOM element. If you see the code and see a variable with $ you know it some kind of DOM reference, holds one of document elements.
Example table and $table you can easily say that last one is more likely a table element (or an element that represent the table), while for first one you have to search code definition for it, so you losing a time here.

Dude just use tableElement instead the obnoxious $, if what you’re after is readability…

get a room to argue about $ ;)

The pages where the button did not appear have now been fixed - thanks @Fedik
Just need to make the titles non-selectable now

@Fedik @dgrammatiko if you could take a look at putting back the code that made the title checked by default and readonly that would be the final missing piece

@brianteeman it should be a simple conditional, what's the difference for the title elements ( I think they are using thead)?

It's the cell with scope row and th

@brianteeman I have made PR,
but the problem with that logic, it will not work for empty table.
It better to have a way to detect such columns by looking in a table header (extra data- attribute or something).

Thanks - I have merged the pr and am working on some tweaks. Instead of hiding the column I am going to make it checked and disabled

All issues resolved and ready for final tests - please

I have tested this item ✅ successfully on cb10bde

Cool feature. The headings are pinned, everything works well.

I have tested this item ✅ successfully on cb10bde

Cool feature. The headings are pinned, everything works well.

Is there a reason its not implemented in the following tables - surely if its going to be implemented on some, it should be on all.

• Banners -> Clients
• Banners -> Tracks
• Users -> User Notes
• Smart Search component ?
• System -> Install -> Languages
• System -> Clear Cache
• System -> Database
• System -> Manage -> Languages
• System -> Manage -> Redirects
• System -> Update Sites
• System -> Mail Templates = Says 3 columns where there are 4

Outside the scope of this PR, would also be nice to implement something for tables in modules on a dashboard.

Are we happy that the storage keys have spaces and colons?

Also if I manipulate the value stored, then on next page load I get a JS Error. Probably ok as I doubt hackers will be changing local storage values (unless there is a way to exploit this), but could be handled better.

TypeError: undefined is not an object (evaluating 'this.$headers[t].classList')

If accessing a key throws an exception like this it should be caught and the key removed from local storage, else the user will forever thing that Joomla is broken, and seek support, which will tell him to clean local storage, a feature not many users know about... when Joomla could just catch JS errors and remove the offending data.

Ok here is an issue.

A 3PD writes a component called com_mytags

My main view is a Tags view. My page title is correctly "Tags". I correctly implement tableoptions

My table view has columns in a different order to the Joomla Core Tags component, or a different number of columns. I get a Javascript error as table options tries to manipulate my columns using the stored preferences for the Joomla component com_tags stored in my browser.

solution is to prefix the key with something - maybe com_tags - to prevent collisions when used by other 3pd applications. 'com_tags' can be retrieved from the class list of the body tag, or the form action url for example.

If accessing a key throws an exception like this it should be caught and the key removed from local storage, else the user will forever thing that Joomla is broken

Makes sense,
enough just check if the index exists in toggleColumn(index, force) :

toggleColumn(index, force) {
  if (!this.$headers[index]) return;
...
...

Are we happy that the storage keys have spaces and colons?

As long as it works, but can change to anything.
The suffix for storage key is configurable, with <table data-name="foobar">

checklist as I work through them - thanks @PhilETaylor

• Banners -> Clients
• Banners -> Tracks
• Users -> User Notes
• Smart Search component ?
• System -> Install -> Languages
• System -> Clear Cache
• System -> Database
• System -> Manage -> Languages
• System -> Manage -> Redirects
• System -> Update Sites

System -> Mail Templates = Says 3 columns where there are 4

That's because the table is not correct and I will do a separate PR for that

Downloaded and installed the PR package from 15.01. There is a problem. Did not check on all pages, but after installing the assembly with this PR, go to the Components - Tags page. Try to select 1-2-3 items (but not all). The action button in the toolbar will be inactive.

Once you have selected all the elements, it will become active.

There is no conflict in the console.

UPD
This problem is on all such pages.

UPD
Open "Columns" and click on the element. See...

Sadly I can confirm this.

@Fedik @dgrammatiko any ideas?

• Option 1 (easy): the input check becomes unhidable as the title
• Option 2: the buttons need to be aware of the changed state of the checkboxes (some kind of event)

I dont understand either ;)

That happens because buggy multiselect.js

The issue has been fixed - thanks @Fedik

This feature is not available on a page with blocked elements. There are only 2 columns, of course... But I'd rather be consistent in functionality.

Not sure I understand what you mean by "blocked elements".

Sorry. I mean this:

ok - I didnt enable it on a page like that as it would be pointless.

Ok, one more clarification on 2 pages - there is also no option to select columns.

Private messages
Search query analysis

Users > Manage > Permissions ?

@Quy it cannot work on that view because of the way the content can be filtered by component

Maybe add a down caret (v) to indicate that it is a dropdown.

Maybe add a down caret (v) to indicate that it is a dropdown.

Done.

Hope this makes it into 4.1 - it solves a lot of user issues

System -> Mail Templates = Says 3 columns where there are 4

That's because the table is not correct and I will do a separate PR for that

Can you please check as this is still an issue? Thanks.

Almost there.

Please add Workflows.

@Quy I dont know how to fix mail templates - sorry

Is there any chance of this making it into 4.1 please.

It's a much requested feature and it would be a shame for it to have to wait another 6 months.

Any improvements can be made during the 4.1 lifecycle

I have tested this item ✅ successfully on e9fc22d

I have tested this item ✅ successfully on e9fc22d

RTC

@brianteeman As Joomla 4.1 is in feature freeze Benjamin asked me to merge it for 4.2. I agree this is a great feature, so have it merged for 4.2.

Thanks everybody for working on this.

thanks for merging - shame people will have to wait :(

Please add a language tag to the PR

This script is too much generic if used for third-party extensions. It searches for all tables in a page throwing a JS error if there is no head section or applying the hide columns control to all found tables even if undesired.
It's a pity it can't be used only for the main or specific table in backend. It would be great an addition to exclude or include only tables that really need it.

Well, that was expected. But people wanted like that.
You better open an issue with some "test case" description. If you like.

a table without a head section is invalid so not going to apologise if it doesnt work

It would be great an addition to exclude or include only tables that really need it.

I dont understand - you have to add it to your component to use it. its not automatic

It would be great an addition to exclude or include only tables that really need it.

I dont understand - you have to add it to your component to use it. its not automatic

@brianteeman of course i know.

The problem now, is that this code should skip unnamed tables, but actually it doesn't do this because if a table has no name it fallbacks to the header title:

const tableName = $table.dataset.name ? $table.dataset.name : document.querySelector('.page-title').textContent.trim().replace(/[^a-z0-9]/gi, '-').toLowerCase(); // Skip unnamed table

    if (!tableName) {
      return;
    }

As a consequence if there are let's say 3 tables in the backend interface of a component but not all 3 tables used for columns to be hidden, then this feature will apply to all of them.
Furthermore, if a table has an empty <head></head> without any <tr>, than you have a the javascript error because of this line of code looking at the 'children' attribute of null:

this.$headers = [].slice.call($table.querySelector('thead tr').children);
Then it should be the case to fix the 'children' code to avoid a JS error, or to introduce an option for a configurable JS selector to include or exclude only certain tables.

I hope to have well explained.

Two choices

1. Don't implement the script in your component
2. Submit a pull request with the required changes

Very useful option but...

Why the new dropdown list button for the columns is placed in a new line and not in the same row and after the dropdown list button for the list limit?

As, for example, the list limit button affects the table, also does this new button for the columns of the table. So they should placed together.

There is space for them to fit in one row and if the left menu is closed then there is more space. I think we need to stop pushing the table too much down.

Also the other filters have a specific ID or class e.g. "list_limit", "list_fullordering". Why the new button for the columns doesn't have?

d-xxl-table-cell, d-sm-table-cell and d-xs-table-cell aren't removed by the JavaScript. Can you please adjust the JS?