Row names in uibuilder tables

General
1

I have a standard object like this:

{
    "Apples": {
        "review": 1,
        "vote": 2
    },
    "Bananas": {
        "review": 2,
        "vote": 18
    },
    "Pears": {
        "review": 8,
        "vote": 179
    }
}

Setting up a table with an uib-element I get a 2x3 table with column names review and vote.
How can I also have row names as Apples, Bananas and Pears?

2

Hi, the simplest way is to add the property to the content as well:

{
    "Apples": {
        "fruit": "Apples",
        "review": 1,
        "vote": 2
    },
    "Bananas": {
        "fruit": "Bananas",
        "review": 2,
        "vote": 18
    },
    "Pears": {
        "fruit": "Pears",
        "review": 8,
        "vote": 179
    }
}

I assume you are using uib-element set to "Simple Table". All it does with an object of objects input is to add an attribute data-row-name to each table body row. This makes it easier to target for updates. e.g. tr[data-row-name="Bananas"] > td[data-col-name="vote"]

Tables, of course, can be arbitrarily complex so having a no-code option to cover all bases is extremely complex. In such cases, it is generally better to use one of the existing excellent table libraries and to send the data direct to the front end to interact with the table library.

3

Yes. I am using Google Charts all over my project, but I was curious to make some test with uib-element.

4

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.