Forums Ignite UI for Angular
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Lance Tressler
605
The column maxWidth property does not appear to be honored when columns are resized
posted

I have a maxWidth specified on a grid column. When I resize the column next to that column, the column width of the column with the maxWidth is resized well beyond the maxWidth specified.

Based on this, it does not appear that maxWidth is honored when resizing another column. This sort of defeats the purpose of the maxWidth property (we have icons in several columns and it doesn't make sense to allow these columns to be resized).

  • 440
    Offline posted

    Hello,

    I have created a small sample trying to reproduce the described behavior. I am using igx-grid component with several igx-columns. I set one of the columns to be resized as well as set a width of 100px and a max width of 200px. The two columns that surround it, the one before it and the one after it, I also want to be resizable to reproduce the described behavior. 

    <igx-column [field]="'ContactName'" dataType="string" [resizable]="true"></igx->

 <igx-column [field]="'ContactTitle'" dataType="string" 
 [resizable]="true" [width]="'100px'" [maxWidth]="'200px'"></igx-column>
 
<igx-column [field]="'City'" dataType="string" [resizable]="true"></igx-column>

    On my side everything works as expected and I am able to resize the middle column as the igx-grid component only allows me to resize it up to 200 pixels. Then I resize the other two columns more than 200 pixels and they take up a lot of space from the grid header, but the main column, which has a set max width of 200 pixels, does not change its width and does not exceed these 200 pixels, that is, the maxWidth property works as expected for the column for which is set.

    The described scenario could be observed here:

     

    What I want to clarify is that the maxWidth property works completely as expected for the column it is set to because it does not allow the column's own width to exceed its set maximum width. When you resize other columns in the igx-grid component and they take up much more space in the header and have a much larger width, they shift the column you selected with max width, it changes its place in the header of the igx-grid component but does not change its width and does not exceed its set max width.

    Here you will find my sample for your reference. Please test it on your side and let me know how it behaves. If this is not an accurate demonstration of what you are trying to achieve, please feel free to modify it and send it back to me along with steps to reproduce. Alternatively, if the behavior cannot be replicated, please feel free to provide your own sample.

    Having a working sample on my side, which I can debug, is going to be very helpful in finding the root cause of this behavior. 

    Thank you for your cooperation.  

    Regards,

    Georgi Anastasov

    Entry Level Software Developer

    Infragistics