Gridview的宽度超出了边界,因为内容宽度更大了
本文关键字:因为 大了 Gridview 边界 | 更新日期: 2023-09-27 18:11:45
<div style="padding-top: 10px; padding-right: 15px; padding-bottom: 25px">
<div class="table">
<div>
<asp:GridView ID="gvList" runat="server" AutoGenerateColumns="false"
DataKeyNames="UserId" AllowSorting="true" onrowcreated="gvList_RowCreated"
onrowdatabound="gvList_RowDataBound"
onsorting="gvList_Sorting">
<AlternatingRowStyle CssClass="even" />
<EmptyDataTemplate>
Records for selected criteria do not exist
</EmptyDataTemplate>
<Columns>
<asp:TemplateField>
<ItemStyle Width="2%"/>
<HeaderTemplate>
<asp:Label ID="lblSelect" runat="server" Text="<%$ Resources:LBShowcaseRes,lblSelect %>"></asp:Label>
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemStyle width="15%"/>
<HeaderTemplate>
<asp:LinkButton ID="lnkFirstName" runat="server" Text="<%$ Resources:LBShowcaseRes,lblFirstName %>" CommandName="Sort" CommandArgument="FirstName"></asp:LinkButton>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lblFirstName" runat="server" Text='<%#Eval("FirstName") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemStyle Width="18%"/>
<HeaderTemplate>
<asp:LinkButton ID="lnkLastName" runat="server" Text="<%$ Resources:LBShowcaseRes,lblLastName %>" CommandName="Sort" CommandArgument="LastName"></asp:LinkButton>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lblLastName" runat="server" Text='<%#Eval("LastName") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemStyle Width="20%"/>
<HeaderTemplate>
<asp:LinkButton ID="lnkEmailId" runat="server" Text="<%$ Resources:LBShowcaseRes,lblEmailid %>" CommandName="Sort" CommandArgument="EmailAddress"></asp:LinkButton>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lblEmailId" runat="server" Text='<%# Eval("EmailAddress") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemStyle Width="15%" />
<HeaderTemplate>
<asp:Label ID="lblUserName" runat="server" Text="<%$ Resources:LBShowcaseRes,lblUserName %>"></asp:Label>
</HeaderTemplate>
<ItemTemplate>
<asp:TextBox ID="txtUserName" runat="server" Text='<%# Eval("UserName") %>' MaxLength="75" Width="100px" EnableViewState="true"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemStyle Width="10%" />
<HeaderTemplate>
<asp:LinkButton ID="lnkOffice" runat="server" Text="<%$ Resources:LBShowcaseRes,lblOffice %>" CommandName="Sort" CommandArgument="OfficeName"></asp:LinkButton>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lblOffice" runat="server" Text='<%# Eval("OfficeName") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemStyle Width="20%" />
<HeaderTemplate>
<asp:Label ID="lblRolePrompt" runat="server" Text="<%$ Resources:LBShowcaseRes,lblRole %>"></asp:Label>
</HeaderTemplate>
<ItemTemplate>
<asp:HiddenField ID="hdnRole" runat="server" Value='<%# Eval("RoleName") %>' />
<asp:DropDownList ID="ddlRole" runat="server" AppendDataBoundItems="true">
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<div class="table-nav">
<asp:Button ID="btnDelete" runat="server" Text="<%$ Resources:LBShowcaseRes,btnDelete %>" SkinID="leftButton"
OnClientClick="var values= GetSelectedUser();return ConfirmDeleteWithValues('Please select at least one User for deletion.',values);"
onclick="btnDelete_Click" />
<asp:Button ID="btnPrintExport" runat="server" Text="<%$ Resources:LBShowcaseRes,btnPrintRep %>" CausesValidation="false"/>
<asp:Button ID="btnSave" runat="server" OnClientClick="return ConfirmAddUser();"
Text="<%$Resources:LBShowcaseRes,btnSave %>"
onclick="btnSave_Click" />
</div>
<div class="clear">
</div>
</div>
</div>
我的表CSS是表{border-collapse: collapse;宽度:100%}
现在当我运行页面时,gridview的宽度将超出100%,因为内容宽度非常大…所以我想让它在达到列的宽度后打断内容我该怎么做PLZ帮帮我.......
修改所选标准的记录不存在
<Columns>
<asp:TemplateField>
<ItemStyle Width="20px"/>
<HeaderTemplate>
<asp:Label ID="lblSelect" runat="server" Text="<%$ Resources:LBShowcaseRes,lblSelect %>"></asp:Label>
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemStyle width="35px"/>
<HeaderTemplate>
<asp:LinkButton ID="lnkFirstName" runat="server" Text="<%$ Resources:LBShowcaseRes,lblFirstName %>" CommandName="Sort" CommandArgument="FirstName"></asp:LinkButton>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lblFirstName" runat="server" Text='<%#Eval("FirstName") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemStyle Width="35px"/>
<HeaderTemplate>
<asp:LinkButton ID="lnkLastName" runat="server" Text="<%$ Resources:LBShowcaseRes,lblLastName %>" CommandName="Sort" CommandArgument="LastName"></asp:LinkButton>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lblLastName" runat="server" Text='<%#Eval("LastName") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemStyle Width="35px"/>
<HeaderTemplate>
<asp:LinkButton ID="lnkEmailId" runat="server" Text="<%$ Resources:LBShowcaseRes,lblEmailid %>" CommandName="Sort" CommandArgument="EmailAddress"></asp:LinkButton>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lblEmailId" runat="server" Text='<%# Eval("EmailAddress") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemStyle Width="35px" />
<HeaderTemplate>
<asp:Label ID="lblUserName" runat="server" Text="<%$ Resources:LBShowcaseRes,lblUserName %>"></asp:Label>
</HeaderTemplate>
<ItemTemplate>
<asp:TextBox ID="txtUserName" runat="server" Text='<%# Eval("UserName") %>' MaxLength="75" Width="100px" EnableViewState="true"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemStyle Width="35px" />
<HeaderTemplate>
<asp:LinkButton ID="lnkOffice" runat="server" Text="<%$ Resources:LBShowcaseRes,lblOffice %>" CommandName="Sort" CommandArgument="OfficeName"></asp:LinkButton>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lblOffice" runat="server" Text='<%# Eval("OfficeName") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemStyle Width="50px" />
<HeaderTemplate>
<asp:Label ID="lblRolePrompt" runat="server" Text="<%$ Resources:LBShowcaseRes,lblRole %>"></asp:Label>
</HeaderTemplate>
<ItemTemplate>
<asp:HiddenField ID="hdnRole" runat="server" Value='<%# Eval("RoleName") %>' />
<asp:DropDownList ID="ddlRole" runat="server" AppendDataBoundItems="true">
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<div class="table-nav">
<asp:Button ID="btnDelete" runat="server" Text="<%$ Resources:LBShowcaseRes,btnDelete %>" SkinID="leftButton"
OnClientClick="var values= GetSelectedUser();return ConfirmDeleteWithValues('Please select at least one User for deletion.',values);"
onclick="btnDelete_Click" />
<asp:Button ID="btnPrintExport" runat="server" Text="<%$ Resources:LBShowcaseRes,btnPrintRep %>" CausesValidation="false"/>
<asp:Button ID="btnSave" runat="server" OnClientClick="return ConfirmAddUser();"
Text="<%$Resources:LBShowcaseRes,btnSave %>"
onclick="btnSave_Click" />
</div>
<div class="clear">
</div>
</div>
</div>
设置gridview宽度为像素(固定)而不是百分比。如果你以百分比设置宽度,网格视图的宽度将随着"div或table或Page宽度"调整。
在你的代码中,你没有给你的gridview任何宽度。给出gridview的宽度也为100%,并根据您的调整将每个TemplateField的宽度从%'s更改为正常数字。
编辑:然后增加网格视图的高度,这样数据将调整并适合表格。