Hi Team,
igGrid seems to have the capability of including the padding-right on the table header when there is a scroll bar in the table body. This seems to work fine in case of local data source as below-
https://jsfiddle.net/zs4gjd16/
But the issue comes when there is a remote URL acting as a data source. Then even if there is a scroll bar present in the table body, it is not adding padding-right to the table header as below-
https://jsfiddle.net/xjy1nv9f/1/
This issue is causing to misalign the table header cells with the table body cells, as the table header cells are a bit more stretched in width as compared to cells in table body with the scroll bar. Although this misalignment is not quite visible in the above example, it is really significant in our production app.
Please let me know how this issue can be fixed.
Regards,
Vaibhav
Hello Vaibhav,
Thank you for your patience while I was looking into this matter for you.
After an investigation I found that this issue is not related to the remote data source. The reason for this behavior is that in the second sample the width the Grid control is defined with its initialization to 100% and the width of its column are not set. What you can do is to set all column widths so that their sum becomes 100% or you can set the Grid's width after its rendering. Another option is to not set the width at all like in the first of the provided samples.
I have modified the second sample illustrating my suggestions. Please test it on your side and let me know whether you find it helpful.
Looking forward to hearing from you.
Regards,Viktor KombovEntry Level Software DeveloperInfragistics, Inc.
Thanks Viktor for that explanation. The helped me to overcome this issue.