Working with table view (Q&A)

[Kirk_Masden]

In this post I’d like to collate some information about how to work with table view.

First of all, here’s what we have in documentation:

intercom.help

View Types

Learn about the different ways you can display data in your app.

The documentation explains that the “Table view shows information in a very compact way allowing you to quickly scroll to find a row” but, unfortunately, there’s no link to a detailed explanation regarding how to work with table view. I hope this “Tips & Tricks” post will constitute a temporary substitute for that documentation and that this post of mine will eventually be made obsolete by a better “official” documentation page from AppSheet.

I’ll present some common questions about how to work with table view and how they have been answered previously (or, provide my own answer here and there):

1. How do I get headers to show?
   There are two advantages to showing headers in table view: 1) The meaning of the columns can be made clear and 2) the user can reorder the content of the table by tapping on any of the headers.
   UX --> Options --> Show column headers
   Hello! Is it possible to enable headers in th...
2. How do I control column width?
   You need to save with “Save and Verify” (not the normal “Save”). However, as far as I can tell the “Maximum length” and “Minimum length” options for a given column don’t seem to affect the displayed column width.
   Also, in regard to image columns, the size and shape of the image does not seem to affect the width of these columns; even a one pixel image will result in a fairly wide column, unfortunately. I can understand having a maximum width that cannot be exceeded but I would think it would be nice if image columns could respond to tiny images by reducing the column width used in the table.
   Column width in table view does not take into...
3. How do I shorten the header displayed in the table to reduce the width of the column?
   If you’d like to have a short, perhaps somewhat cryptic header (for example, an acronym) in the table view but would like to have a complete header for that column in the detail view you can put an expression like the following in the “Display name” space for that column:
   if(Context(“View”)=“Name of your table”,“CH”,“Complete heading”)
4. How can I shorten the way dates are displayed in my table?
   Timestamps can be rather long (e.g. “9/3/2019 17:36:58”) and therefore will take up most of the horizontal space in your table if you display the raw data. If you make a new virtual column with the following expression “9/3/2019 17:36:58” becomes a much more compact “9/3,” leaving more space to display other data.
   concatenate(MONTH([Date]),"/",DAY([Date]))
   (In this example “Date” is the name of the column containing the DATETIME stamp.)
   The shorter date in the virtual column can be display on the table itself but can be excluded from the detail view. Use the “Column order” portion of the view editor (UX --> Views) to determine which columns to include and the order in which they will be displayed.
   One more thought: I haven’t done this myself but, now that I think of it, one might choose to make a virtual column with an expression like the following to avoid losing too much real estate in the table:
   if(len[Long text]>10,concatentate(left([Long text],10),"…"),[Long text])
   For example, this would produce “Working wi…” as the truncated version of “Working with table view (Q&A)” since it is longer than 10 characters. Anything in [Long text] that is 10 characters or less would not be altered.
5. How do I enable horizontal scrolling?
   UX --> Options --> Use horizontal scrolling
   Horizontal Scrolling Tables
6. How do I embed actions in the lines of my table?
   Make the action a “Display inline” action. Here’s an example where a checkbox action is placed within the table:
   How to add a checkbox to a table view
   See also:
   Best practices for table inline action display
7. Does “quick edit” work in table view?
   This is currently in beta:
   UX --> Views --> View Options
   I experimented with this for the first time today and it worked well. I may be rather dense but it took me a while to realize that I needed to tap on the “edit” icon displayed the header menu:
   
   Once I did that, I had no difficulty:
   

I hope some people, especially newcomers, find this Q&A to be useful. I was prompted to put it together because I just learned today how to use “Save and Verify” to adjust column width, even though I’ve been trying to work with table view for some time now. I thought there might be others who had not yet figured all of this out yet.

Currently, my Q&A has only the seven questions you see above. If there is another question and answer that you think should be added to this list, please put it in a comment. Thanks!

[Aleksi]

Doc update is requested

[TalkNet_TechnoS]

Excelente aporte @Kirk_Masden!

[Grant_Stead]

I like it!

[peterdykstra]

This is great Kirk, thanks!

[Sean_Lim]

Thanks for adding my text wrapping idea, @Kirk_Masden. Hope it will take off

[Kirk_Masden]

I’ll need to add that properly later – haven’t done so yet. Certainly, though, if it becomes possible, I definitely will want to add it to this Q&A list.

[hru]

Hi @Kirk_Masden, I just read your post today and I can tell you that this kind of write-up is really helpful for newbies like me. Thanks for sharing this.

[adamflord]

Late to the game, however just stumbled across this post which turned out to be extremely valuable to overcoming a few obstacles for this morning’s development session. Thank you @Kirk_Masden.

[Kirk_Masden]

Since quite a lot of time has passed since I wrote this, I’m no long able to edit the original to add another question and answer. If I could, I would and the following:

8. How do I get quick edit and delete icons to appear at the top of the screen?
   I’m talking about these icons:
   
   Today I had some trouble figuring out why they were showing up in some views and not others. The specific problem I was having was that the delete icon (which conveniently allows you to select multiple records to delete at once) was not appearing, even though the table was set to allow deletes. The problem turned out to be that I had not added the delete action to my slice. Once I did that, all was well.

[Koichi_Tsuji]

I would say bug or need to change the spec. Without delete option the table should be “quickly editable”

[Kirk_Masden]

I certainly understand your perspective. On the other hand, I can image why a developer would not want to make it easy to delete multiple records at once in some situations. So, personally, I like being able to choose whether or not to include the “Quick delete” function at the top. In regard to quick edit, I don’t see much reason to want to turn it off.

[Koichi_Tsuji]

Once we move into table quick edit mode, nine go action available INC delete action. So the setting of the row is deletable or not should be nothing to do with we can take effect the quick edit mode or not .

[Marc_Dillon]

Kirk_Masden:

How do I get quick edit and delete icons to appear at the top of the screen?
Today I had some trouble figuring out why they were showing up in some views and not others. The specific problem I was having was that the delete icon (which conveniently allows you to select multiple records to delete at once) was not appearing, even though the table was set to allow deletes. The problem turned out to be that I had not added the delete action to my slice. Once I did that, all was well.

The multiple-selection button (checkmark in a box) will only show up if there is an action available that can be executed on multiple records at once, such as, but not limited to, delete.

Another way to access this bulk selection (when available) is to long-click on one row of the table.

[Jeff_Gordon]

I have one column “Item” plus several other columns that I always want to display (but those additional columns seldom have data). Since those other columns would take up too much space, I concatenate them together. Here’s an example:

[Item]
& If (ISNOTBLANK([List])," (" & [List] & “)”,"")
& if (ISNOTBLANK([Notes])," (See Notes)","")
& IF (ISBLANK([Done]),"", "; Done " & [Done Date])

[Skip2MiLu]

Has anyone figured out what this does?

[Marc_Dillon]

Provides data validation for the length of the text string.

[Skip2MiLu]

Sorry man…I guess I am not experienced enough to understand what that means

But I guess I can assume that definately does not controll column width?

Kirk_Masden:

How do I control column width?
You need to save with “Save and Verify” (not the normal “Save”). However, as far as I can tell the “Maximum length” and “Minimum length” options for a given column don’t seem to affect the displayed column width.

[Marc_Dillon]

Michael_Pinto:

But I guess I can assume that definately does not controll column width?

Definitely not.

Data validation : determines whether or not inputted data is in the proper format and will be accepted.

Those options provide the means to limit the inputted text to a certain length.

[Skip2MiLu]

So in short …leave them as is

I suppose it still a challenge on how best to tackle column width customisation.
I suppose the following ideas would be a bit to complex to implement:

1. Drag coloumn to size and save relevant to context of device like how the whole drag and size windows in a dashboard work at the moment.
2. Have something like below where each column field can be adjusted. So default is loaded for each following which you can do a quick Narrow or Wide selection or a simple - or + option to increase or decrease buy a standard unit

[Kirk_Masden]

I would agree that column width customization is an issue that has not be completely resolved. He’s I idea that might be of interest to you until a better solution comes along:

Adjusting table spacing Tips & Tricks 💡

If you use “Save and verify” instead of the normal “Save” after editing a table, the platform should adjust the width of your columns appropriately. But, sometimes the platform may not do what you want it to. For example, in the following example “Word” is a virtual column and, for whatever reason, “Save and verify” did not expand the width to accommodate the text in the column on the third row: [Screen Shot 2020-11-16 at 20.48.29] My solution was to add Japanese spaces to the title: [Scree…

[Skip2MiLu]

So my above idea on how to handle column sizing is well presented as an example in how you can customise dash sizes. Except the options are only controlling horizontal size on the column. So the options would be Default, Narrow, Wide, Extra Wide and Maybe then a customised size where you enter a size to ofset the standard. eg: Add 5 “units” more etc.