Group Headers Overflow
By default the group header only has as much space as exists before the first column, and gets cut off.
I've worked around that by causing it to word wrap using:
.e-grid .e-groupcaption {
line-height: 18px;
overflow-wrap: break-word;
text-overflow: clip;
white-space: normal;
word-wrap: break-word;
}
Is there anyway to get just get it to display the entire group header text, no matter how wide? If it runs into a group aggregate then so be it, that's fine. I just would really prefer to see the ENTIRE group header, all on one line. I did try modifying that style above to include a width without any results.
I appreciate the help.
SIGN IN To post a reply.
3 Replies
Hi Jonah,
Greetings from Syncfusion support.
We would like to inform you that, this is the default behavior of group caption display while apply aggregate in Grid. The excess text will be hidden and when hover on those hidden text, a tooltip will be displayed as like in the below screenshot. Please refer the screenshot below,
So to overcome this default display behavior, it is recommended to override the styles applied to the “e-groupcaption” in Grid as like you have done in your application. So we suggest you to apply corresponding styles to the “e-groupcaption” achieve this requirement. Please refer the below documentation for the classes to customize grid’s appearance.
Query : I just would really prefer to see the ENTIRE group header, all on one line.
Based on this scenario, we suggest you to add the below styles in your application. Please add the below styles to achieve this requirement.
|
<style>
.e-grid .e-groupcaption {
overflow:unset;
}
</style>
|
We have also prepared a sample based on this scenario. Please download the sample from the link below,
Please refer the screenshot below,
Please get back to us if you need further assistance.
Regards,
Renjith Singh Rajendran
SIGN IN To post a reply.
