Responsive Grid Width

[jdhParticipant]

I can’t believe this hasn’t already been answered, but I did a search here for “grid width” among others and it gave me 4000+ results, all irrelevant (probably matching just the “grid” keyword).

This is an Angular app. Using jqWidgets-framework v4.6.4.
Anyway, typical scenario: I have a container I’m putting my grid in, and want the grid to always take up 100% of the width of the container.
the [width] property says it can take a string or number, but it won’t take “100%” and although I saw another suggestion on the net to use the [autowidth] property, that’s not available either.

I can’t set a fixed-width for this, so how do I just make it 100%?

[Peter StoevKeymaster]

Set the width in percentages. Example: https://www.jqwidgets.com/angular/angular-grid/angular-grid-fluidsize-component.htm

<jqxGrid
    [width]="'100%'" [height]="'90%'" [source]="dataAdapter" [columns]="columns"
    [showfilterrow]="true" [filterable]="true" [selectionmode]="'multiplecellsadvanced'">
</jqxGrid>

[jdhParticipant]

Thanks! I would never have guessed single-quotes-inside-double-quotes. That should be mentioned in the docs! I know it says “string or number” but in HTML world to me that only means that either a width=100 or width="100" works. Thank you.

[Peter StoevKeymaster]

Actually, the “‘ … syntax is the way you put Strings in Angular. This is not something specific to our components.

[Author]

Posts