How to wrap all the columns in the GridView to the screenSize in ASP.NET

Question

I have a Gridview, I am trying to wrap all the columns of my Gridview to the screen size(Width= 100%). I tried to set the RowStyle Wrap="true" in the Gridview properties and set the ItemStyle Wrap="true" .I even tried applying the CSS Properties. But it didn't work. Can anybody help me out?

Aspx page Code:

        <asp:GridView ID="SalesRepresentativeGridView" runat="server" AutoGenerateColumns="false" Width="98%" Style="margin: 0% 1% 0% 1%"
                    OnRowEditing="SalesRepresentative_RowEditing" OnRowCancelingEdit="SalesRepresentative_RowCancelingEdit" OnRowDataBound="SalesRepresentative_RowDataBound"
                    OnRowUpdating="SalesRepresentative_RowUpdating" AllowPaging="true" PageSize="10" AllowSorting="true" OnPageIndexChanging="SalesRepresentative_PageIndexChanging"
                    CssClass="SegmentGV" OnSorting="SalesRepresentative_SortData" DataKeyNames="SalesRepContactID" >

                    <Columns>
                        <asp:CommandField ShowEditButton="true" ItemStyle-Width="50" />
                        <asp:BoundField DataField="SalesRepContactID" HeaderText="SalesRep ID" Visible="false" ReadOnly="true">
                            <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle"></ItemStyle>
                        </asp:BoundField>


                        <asp:TemplateField HeaderText="First Name">
                            <ItemTemplate>
                                <asp:Label runat="server" ID="SalesRepFirstName" Text='<%# Eval("SalesRepFirstName")%>'></asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <asp:TextBox ID="SalesRepFirstName" runat="server" Text='<%# Eval("SalesRepFirstName")%>'></asp:TextBox>
                            </EditItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Last Name">
                            <ItemTemplate>
                                <asp:Label runat="server" ID="SalesRepLastName" Text='<%# Eval("SalesRepLastName")%>'></asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <asp:TextBox ID="SalesRepLastName" runat="server" Text='<%# Eval("SalesRepLastName")%>'></asp:TextBox>
                            </EditItemTemplate>
                        </asp:TemplateField>


                        <asp:TemplateField HeaderText="Title">
                            <ItemTemplate>
                                <asp:Label runat="server" ID="Title" Text='<%# Eval("Title")%>'></asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <asp:TextBox ID="Title" runat="server" Text='<%# Eval("Title")%>'></asp:TextBox>
                            </EditItemTemplate>
                        </asp:TemplateField>

                        <asp:TemplateField HeaderText="Hire Date">
                            <ItemTemplate>
                                <asp:Label runat="server" ID="HireDate" Text='<%#DataBinder.Eval(Container.DataItem, "HireDate").ToString()%>'></asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <asp:TextBox ID="HireDate" runat="server" ReadOnly="true" Text='<%#Bind("HireDate") %>'></asp:TextBox>
                            </EditItemTemplate>
                        </asp:TemplateField>

                        <asp:TemplateField HeaderText="Termination Date">
                            <ItemTemplate>
                                <asp:Label runat="server" ID="TerminationDate" Text='<%#DataBinder.Eval(Container.DataItem, "TerminationDate").ToString()%>'></asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <asp:TextBox ID="TerminationDate" runat="server" ReadOnly="true" Text='<%#Bind("TerminationDate") %>'></asp:TextBox>
                            </EditItemTemplate>
                        </asp:TemplateField>



                        <asp:TemplateField HeaderText="Notes">
                            <ItemTemplate>
                                <asp:Label runat="server" ID="Notes" Text='<%# Eval("Notes")%>'></asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <asp:TextBox ID="Notes" runat="server" Text='<%# Eval("Notes")%>'></asp:TextBox>
                            </EditItemTemplate>
                        </asp:TemplateField>


                        <asp:TemplateField HeaderText="Inventory Notes">
                            <ItemTemplate>
                                <asp:Label runat="server" ID="InventoryNotes" Text='<%# Eval("InventoryNotes")%>'></asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <asp:TextBox ID="InventoryNotes" runat="server" Text='<%# Eval("InventoryNotes")%>'></asp:TextBox>
                            </EditItemTemplate>
                        </asp:TemplateField>



                        <asp:TemplateField HeaderText="Sales Rep Company">
                            <ItemTemplate>
                                <asp:Label runat="server" ID="SalesRepCompanyName" Text='<%# Eval("SalesRepCompanyName")%>'></asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <asp:TextBox ID="SalesRepCompanyName" runat="server" Text='<%# Eval("SalesRepCompanyName")%>'></asp:TextBox>
                            </EditItemTemplate>
                        </asp:TemplateField>

                        <asp:TemplateField HeaderText="Demo Signed">
                            <ItemTemplate>
                                <asp:Label runat="server" ID="DemoSigned" Text='<%#DataBinder.Eval(Container.DataItem, "DemoSigned").ToString()%>'></asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <asp:TextBox ID="DemoSigned" runat="server" ReadOnly="true" Text='<%#Bind("DemoSigned") %>'></asp:TextBox>
                            </EditItemTemplate>
                        </asp:TemplateField>


                        <asp:TemplateField HeaderText="Sales Rep Type">
                            <ItemTemplate>
                                <asp:Label runat="server" ID="SalesRepTypeName" Text='<%# Eval("SalesRepTypeName")%>'></asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <asp:Label ID="lblSalesRepTypeName" runat="server" Text='<%# Eval("SalesRepTypeName")%>' Visible="false"></asp:Label>
                                <asp:DropDownList ID="SalesRepTypeName" runat="server">
                                </asp:DropDownList>
                            </EditItemTemplate>
                        </asp:TemplateField>
</Columns>
 <PagerStyle CssClass="gridPager" />
                </asp:GridView>

Answer 1

I have not played with asp.net in a while. However if your using Visual studios, you can set anchor point for left and right which upon maximization will auto resize row width, or anchor top and bottom to expand view height.

If your not using visual studios you will have to get into a little java script to return users screen height and width. here is a link to that

.