Hi,
In DataGrid, upon loading, the column's width is like this:
But upon load, I want it to auto-fit, something like this
How do I achieve this? Thank you!
Hey,
I noticed that you did not implement the JS snippet I sent earlier. That's why it's not working.
Hello @Kenneth1,
On the Grid's on initialize event, you can call the following snippet of JS to achieve this. This will make the first column (index 0) have auto fit.
GridAPI.GridManager.GetGridById($parameters.GridWidgetId).provider.autoSizeColumn(0);
If you want all columns to auto fit, you can call:
GridAPI.GridManager.GetGridById($parameters.GridWidgetId).provider.autoSizeColumns();
I've attached a sample where you can see it working. We'll also analyze this internally and see if it makes sense for us to create a client action for this.
I've tried your solution but I guess it autofits only based on the Column Header name, so if I have a cell value that is very long it shows ellipsis, is it possible to show the whole value?
Are you sure?
This is the result from the sample I sent you.
yes I've tried your oml
It's kinda buggy, sometimes when I refresh page it autofits correctly, sometimes its not (with ellipsis)
I've tried reproducing the issue you mentioned, but wasn't able to. Did you change anything on your sample?
Nothing. Just trying out the the autoSizeColumn(0) and autoSizeColumns();
the autoSizeColumns() also does the ellipsis thing.
Hello Gabriel Lundgren and Outsystem developers,The default serial number (at the start of grid) can we apply auto fit content on the serial numbers as well.Thanks and RegardsDhanushant
I confirm the same issue!
Hi @Kenneth1
Could you please share the oml where we could reproduce that and mention the Data Grid version?
Thanks
This is the oml (the one you shared), Data grid version is 2.6.3
Mine is 2.6.2 and I reproduced the same behaviour with the oml just shared by @Kenneth1 .
It is enough to refresh the page several times to get the wrnog behaviour.
I tested it also with another application with the same result.
Please update your JS node as follows:
setTimeout(function(){
}, 0);
Please let me know if this helps!
Nope :-( Same issue
Hello.I tried with the latest version and I'm not able to reproduce that use case.Have you tried the latest version?
Updated to 2.7.0 but same behavior
It is really strange, But It is working fine.
I don't know how to help in reproducing the issue, I used your oml... just refresh the page several times and then I get the issue..
Please check the behaviour at https://personal-7bxoeiru.outsystemscloud.com/AutoFit/Grid?_ts=637919512389921254
Try to refresh several times and you'll get the wrong auto-size.
Sorry, I published an old oml.
Now I published the last oml you sent with the correct snippet... same issue: after two or three refresh the size is fitted to the headers.
Give it a try: https://personal-7bxoeiru.outsystemscloud.com/AutoFit/Grid?_ts=637919615607416074
i tried same API working fine but this make my page laggy and slow any specific reason?
Hi @Praveen kadbhane
Which version are you using? Can you please share a sample oml and explain better what do you mean by the page being slow (how slow, when that happens, the volume of data and in which situations)?
Hi @Praveen kadbhane. Any update on this?
I can share with you guys that using the latest version of Datagrid, this is easily done by creating a client action with a JS widget with the following code:
OutSystems.GridAPI.GridManager.GetGridById($parameters.GridId).provider.autoSizeColumns();
In the DataGrid properties pane, at the bottom, there is an Event called OnInitialize. Just invoke that client action there and every time your data changes the columns will have auto width.
I have used bellow JS but this is adjusting columns height for first page only... if i move to 2nd or 3rd page columns are not getting adjusted based on the content.
OutSystems.GridAPI.GridManager.GetGridById($parameters.ridWidgetId).provider.autoSizeColumns();
Any solution to fix this issue?
Same issue here, all the latest version but mostly only adjusting to colums headers.