Change column width of Table in Perspective

Hello,

Can someone help me find where to change the column width using Perspective Table? I have 3 columns and I want to change the size of each. Also, where do I change the Date format for one of the columns?

Thanks,

David

To allow for a column to have its size specified, there are several conditions which must be met.

  1. You must have an entry in the props.columns array.
  2. One of the props.columns entries MUST have the field specified as a case-sensitive match to a key of your data (using the example data of the Table you could supply “city”, “country” or “population”).
  3. Supply a value for props.columns[x].width, where “x” is the index of the column specified to be the column for your field/key. The value you specify here is understood to be in pixels, so a value of 150 would mean “150px”. Supplying “px” as part of the value will result in it being ignored.

This screenshot displays how I’ve created a column entry, set my column entry’s field to “city” (which matches a key from my supplied data), and I’ve specified a width of 50. You can see that my “city” column is considerably thinner than my other columns. Any column which does NOT have a width set will stretch to fill the available area.

If you want the column to always be EXACTLY some width, you should set the props.columns[x].strictWidth property to be true

3 Likes

The DateFormat is ALSO set in the column object. You’re looking for props.columns[x].dateFormat.

Thanks for the quick reply! The column width worked perfectly. The date format does not. Please look at my screenshot and see if you can tell what I am missing.

Thanks!

What you’re seeing could possibly be due to a known bug surrounding unix timestamps.

What version are you using? The bug was supposedly fixed for 8.0.3 so if you’re using something older, then this has probably been fixed. If you’re using 8.0.3RC2 or the nightlies and you’re seeing this, then
something else is going on.

Version 8.0.2. Please see attached.

Right, so there’s a really good chance that what you’re seeing has already been fixed in the upcoming 8.0.3 release.

Ok, I will deal with the current date time for now. Thanks again for the quick responses.

David

Dear cmallonee,
I don’t know what do not change the width.
Can you help me?

Remove the “px” from “50px”.

1 Like

Can you explain why you can’t use px? I would default to adding the units as well :thinking:

Dev is looking into the exact reason, but I think it’s because that width is used as the basis for the “column” inside of the flex row. Supplying a value of “50px” ends up getting used as a basis of “50pxpx” because I think we’re blindly concatenating our own “px” onto whatever is supplied. Just a theory for now - but I wouldn’t be surprised if that’s the actual reason.

My table doesn't have a columns property and I tried the scrip and it didn't work.
I am using perspective, I have one column that stores the path to assets, and as you can imagine the path of a directory can be very long and the whiteSpace:nowarp doesn't help all too much because I can't resize my columns width.

My apologies, I found it... :smiling_face_with_tear:

Ok, I edited the properties in the property window and I placed a startup scrip that would set the width and strictwidth to true and nothing seems to happen. I've tried different values as well.

Why not just set the properties without the script?

On a related note, anytime anyone claims they set something via a script and experienced no result or change in behavior, I have to immediately assume their script failed silently. Please check your Gateway logs to see if the script is perhaps failing to take any action. Make sure you have saved your changes as well.

2 Likes

Right, I should have at least posted my script.
Here is what I have and it doesn't seem to work. Column "Val3" is the one I'm trying to edit, as you can see some of the string from column "val3" makes it's way into column "val4"

The width value is in column number 4 of the table properties. I also added the whiteSpace: nowrap property to the style.


table

You haven't specified the columns.4.field property. This (and all the other columns) should have the name of the database column in that field for other properties to take effect.

This is explained in post #2 of this thread. Change column width of Table in Perspective - #2 by cmallonee.

2 Likes

Thank you so much! I didn't realize that each column needed a field property. Aslo.... Those column names are what is in our DB... :sweat_smile: