[FEATURE-16500] Perspective Table - Customize "Empty Data Source"

[Kasa.Jason_K]

Is the “Empty Data Source” text and/or icon on the Perspective Table editable? If not, is that a feature that could be added? Our table is only populated based on a user selection, so it would be nice to add some informative text on the table such as “Make Selection”.

[cmallonee]

It is not currently configurable, no.

An alternative option is to place the table you’re using along with a Label into a Flex Container with the following setup:

1. Bind Table.position.display to the property Table.props.data, and include a transform with the following code: return (value is not None) and (len(value) > 0).
2. Set the Label text to “Make Selection”.
3. Bind Label.position.display to the property Table.props.data and include a transform with the follow code: return (value is None) or (len(value) == 0).

This should make it so that when your table has data it is displayed and the label is not, and when the table does not have data, the Label is displayed while the table is not.

[cmallonee]

A more advanced solution would be to place the Table/Label combo into a separate Flex Container-based View entirely (along with their setup), and use that View via an Embedded View.

This would allow that combination to be used in other locations.

[bebel]

What I do is create a custom property on the table called emptyData. In designer I bind that to the data property of the table while there is a valid dataset present. Then I remove the binding but the dataset remains with the emptyData property. I then click the dataset icon for emptyData and edit to remove all rows. I then add one empty row back onto the dataset. In your case you may want to put ‘Make selection’ in one cell or across a couple of columns. Then in the startup event of the form and any scripting that makes the currently displayed data invalid (null) I set the table.data property equal to the emptyData property. That way it displays a table with proper column headers instead of the aesthetically unpleasing ‘empty data source’ banner. Note that you may need to use scripting to assign data to the table data property rather than a direct binding for this to work. I have also used a value change script on the table data property. If the new value = None I set table.data = emptyData.

[tmahaffey]

Ah, sounds like quite the workaround! I’m noticing that if the dataset happens to be empty, the column names are not even displayed. Not idea!

[jlandwerlen]

I agree, this is not ideal… clunky at best. Is this something IA is going to implement?

[PGriffith]

This is an active, low-priority issue on our internal backlog. We’ll update this thread when there’s movement on the issue.

[jlandwerlen]

I’ll take active. Thanks!

[kgamble]

This probably isnt worth it, it was mostly just a fun exercise in theming, however this IS technically possible without any changes by IA, though it isnt necesarrily flexible.

Theoretically if you created css styles using the same naming as the other styles (.psc-MyStyleClass I think?), then you could put a binding on the table style classes property to change your style, potentially changing the content displayed here? But I didn’t go that far, so I’m not sure if there’s a limitation somewhere in that.

If you include the following in some custom CSS in a theme, it will actually remove the original warning and replace it with whatever you like. In this case I just hosted an svg using web dev so that I knew my server could access it, but really this could come from anywhere.

.ia_table__body__emptyMessage {
        visibility: hidden;
        position: relative;
}

.ia_table__body__emptyMessage:after {
        visibility: visible;
        content:  "Put a message here!";
        position: relative;
        height: 10%;
        top: 0;
        width:100%;
        text-align: center;
}

.ia_table__body__emptyMessage:before {
        visibility: visible;
        content:  url("https://fakeURL.com/image.svg");
        position: relative;
        width: 50%
        top: 10%;
        left: 25%;
}

.ia_table__head:after {
        visibility: visible;
        content: "Theoretically you could put something here instead, since the column names dissappear";
        text-align: center;
}

It definitely could use some polishing if someone was to actual use it, but hey it works

[jlandwerlen]

The lack of headers is actually most important in my opinion.

[kgamble]

This isn’t perfect but to fix the column header issue you can just add a blank row to the table, to hide that it’s there you can also disable rowSelection and set the highlight to be turned off

[jlandwerlen]

What I don’t get is that if you look at the binding it shows the dataset with all of the columns, just no rows.
Why can’t they show that, like they did in Vision? I understand the differences between Perspective and Vision, but not in this example.