This is a migrated thread and some comments may be shown as answers.

Dynamic Grid with Dynamic Height and Width

3 Answers 409 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Annette asked on 14 Feb 2011, 10:04 PM

I've look through all the examples on the forum and can't get my grid height and width to size dynamically.

Here is my code.

<asp:Panel ID="Panel1" runat="server" Height="100%" Width="100%">

<telerik:RadGrid ID="grdProducts" runat="server" Skin="DMID" EnableEmbeddedSkins="False"

AutoGenerateColumns="False" GridLines="None" GroupingEnabled="False" OnLoad="grdProducts_Load"

OnPreRender="grdProducts_PreRender" PageSize="5" AllowPaging="True"

AllowSorting="True" Width="99%">

<HeaderContextMenu EnableEmbeddedSkins="False" CssClass="GridContextMenu GridContextMenu_DMID">

</HeaderContextMenu>

<MasterTableView NoMasterRecordsText="No Products available." TableLayout="Fixed" DataKeyNames="ProductID" >

<CommandItemSettings ExportToPdfText="Export to Pdf" />

<RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">

</RowIndicatorColumn>

<ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column">

</ExpandCollapseColumn>

<Columns>

<telerik:GridBoundColumn FilterControlAltText="Filter ID column" HeaderText="ID"

ReadOnly="True" SortExpression="ProductID" UniqueName="ProductID" DataField="ProductID" HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="60px" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn FilterControlAltText="Filter Lot column" HeaderText="Lot #"

ReadOnly="True" SortExpression="Lot" UniqueName="Lot" DataField="Lot" HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="60px" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn FilterControlAltText="Filter Description column" HeaderText="Investigational Agent Description"

ReadOnly="True" SortExpression="Description" UniqueName="Description" DataField="Description" HeaderStyle-HorizontalAlign="Center"  HeaderStyle-Width="100px" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn FilterControlAltText="Filter UnitDosage column" HeaderText="Unit Dosage"

ReadOnly="True" SortExpression="UnitDosage" UniqueName="UnitDosage" DataField="UnitDosage" HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="75px" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn FilterControlAltText="Filter ShipUnit column" HeaderText="Shipping Unit"

ReadOnly="True" SortExpression="ShipUnit" UniqueName="ShipUnit" DataField="ShipUnit" HeaderStyle-HorizontalAlign="Center"  HeaderStyle-Width="75px" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn FilterControlAltText="Filter Expire column" HeaderText="Expiration Date (mm/dd/yyyy)"

ReadOnly="True" SortExpression="Expire" UniqueName="Expire" DataType="System.DateTime"

DataField="Expire" DataFormatString="{0:d}" HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="80px" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn FilterControlAltText="Filter UnitsAvailable column" HeaderText="Units Available"

SortExpression="UnitsAvailable" UniqueName="UnitsAvailable" DataType="System.Int32"

DataField="UnitsAvailable" HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="50px" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataType="System.Int32" FilterControlAltText="Filter uRequested column"

HeaderText="Units Requested" SortExpression="URequested" UniqueName="uRequested"

DataField="URequested" HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="50px" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataType="System.Int32" FilterControlAltText="Filter UApproved column"

HeaderText="Units Approved" UniqueName="UApproved" DataField="UApproved"

SortExpression="UApproved" HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="50px" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn FilterControlAltText="Filter UShipped column" HeaderText="Units Shipped"

ReadOnly="True" SortExpression="UShipped" UniqueName="UShipped" DataType="System.Int32"

DataField="UShipped" HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="50px" >

</telerik:GridBoundColumn>

</Columns>

<EditFormSettings>

<EditColumn InsertImageUrl="Update.gif" UpdateImageUrl="Update.gif" EditImageUrl="Edit.gif"

CancelImageUrl="Cancel.gif" FilterControlAltText="Filter EditCommandColumn column">

</EditColumn>

</EditFormSettings>

</MasterTableView>

<ClientSettings Scrolling-AllowScroll="true" EnableRowHoverStyle="true" Selecting-AllowRowSelect="true">

<Resizing AllowColumnResize="true" />

<Scrolling AllowScroll="true" UseStaticHeaders="true" />

</ClientSettings>

<FilterMenu EnableImageSprites="False" EnableEmbeddedSkins="False">

</FilterMenu>

</telerik:RadGrid>

</asp:Panel>

3 Answers, 1 is accepted

answered on 16 Feb 2011, 01:37 PM

I've tried the solution you pointed me to. Let me explain what I'm trying to accomplish. I have a form that users have to fill out. On this form are input fields and a grid. Upon selection of an Order #, the grid will populate with products relating to the Order #. I want the grid's height to adjust so that it shows the number of products and it's width will not to go beyond the browser width.

When I tried the first approach, I got the following jscript error. Microsoft JScript runtime error: 'Scrolling' is null or not an object

I do have the client settings set as:

</ClientSettings>

I did change the doc type to HTML 4.0. I'm using version 2010.3.1317.35 of the grid in .NET 3.5