Is there a way when you add a row to a table that the new row appears as the first row?
Add the CSS tag "ReverseTable" to your table then add this CSS.
.ReverseTable tbody,
.ReverseTable tbody tr
{
transform: scaleY(-1);
}
You are essentially flipping the table body upside down, then flipping each row upside down.
This should work in both Modern Form Designer and Classic Form Designer.
Note that Rows will be in reverse order so a =Row() calculation will be 1 on the bottom row and saved variable data will be listed in the order bottom to top.
I got this to work in Modern Forms, but is there a way I can move the +Add link to the top of the table too?
.ReverseTable {
tbody,
tbody tr {
transform: scaleY(-1);
}
fl-table > div {
display: flex;
flex-direction: column;
}
.section-title {
order: 0;
}
.table-row-add {
order: 1;
}
table {
order: 2;
}
}
What would i need to change in this to make it work with a collection?
I don't think you can because the collection rows are not contained in any html element. If you use a similar syntax as the above you flip the whole field
This works in Classic Forms:
.ReverseCollection .cf-collection,
.ReverseCollection .cf-collection div.form-q
{
transform: scaleY(-1);
}
Note: This doesn't move the "Add" to the top.