列にBoundFieldを使用するGridViewがあります。 UserInfo
列の最大幅を設定しようとしています。
私は多くの方法を試しましたが、どれも機能しません。以下は、私のGridViewのコードです。
<asp:GridView ID="GridView1" AutoGenerateEditButton="True"
ondatabound="gv_DataBound" runat="server" DataSourceID="SqlDataSource1"
AutoGenerateColumns="False">
<Columns>
<asp:BoundField HeaderText="UserId"
DataField="UserId"
SortExpression="UserId"></asp:BoundField>
<asp:BoundField HeaderText="Username"
DataField="Username"
SortExpression="Username"></asp:BoundField>
<asp:BoundField HeaderText="UserInfo"
DataField="UserInfo"
SortExpression="UserInfo"></asp:BoundField>
</Columns>
</asp:GridView>
特定の列(私のUserInfo
列)の幅を設定する方法に関する提案を探しています。
私はあなたのために小さなデモをしました。長いテキストを表示する方法を示します。
この例には、非常に長いテキストを含む列Nameがあります。 boundFieldはすべてのコンテンツをテーブルセルに表示します。したがって、セルは必要に応じて展開されます(コンテンツのため)
TemplateFieldもセルとしてレンダリングされますが、div which limits the width to contet to例:40px。そのため、この列には何らかの最大幅があります!
<asp:GridView ID="gvPersons" runat="server" AutoGenerateColumns="False" Width="100px">
<Columns>
<asp:BoundField HeaderText="ID" DataField="ID" />
<asp:BoundField HeaderText="Name (long)" DataField="Name">
<ItemStyle Width="40px"></ItemStyle>
</asp:BoundField>
<asp:TemplateField HeaderText="Name (short)">
<ItemTemplate>
<div style="width: 40px; overflow: hidden; white-space: nowrap; text-overflow: Ellipsis">
<%# Eval("Name") %>
</div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
ここに私のデモコードがあります
public partial class gridViewLongText : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
#region init and bind data
List<Person> list = new List<Person>();
list.Add(new Person(1, "Sam"));
list.Add(new Person(2, "Max"));
list.Add(new Person(3, "Dave"));
list.Add(new Person(4, "TabularasaVeryLongName"));
gvPersons.DataSource = list;
gvPersons.DataBind();
#endregion
}
}
public class Person
{
public int ID { get; set; }
public string Name { get; set; }
public Person(int _ID, string _Name)
{
ID = _ID;
Name = _Name;
}
}
バウンドフィールドにHeaderStyleを追加します。
<asp:BoundField HeaderText="UserId"
DataField="UserId"
SortExpression="UserId">
<HeaderStyle Width="200px" />
</asp:BoundField>
幅は、以下のように特定の列に設定できます:パーセンテージ:
<asp:BoundField HeaderText="UserInfo" DataField="UserInfo"
SortExpression="UserInfo" ItemStyle-Width="100%"></asp:BoundField>
OR
ピクセルごと:
<asp:BoundField HeaderText="UserInfo" DataField="UserInfo"
SortExpression="UserInfo" ItemStyle-Width="500px"></asp:BoundField>
これは、幅を操作するときにすべての状況で機能します。
`<asp:TemplateField HeaderText="DATE">
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Bind("date") %>' Width="100px"></asp:Label>
</ItemTemplate>
</asp:TemplateField>`
<asp:GridView ID="GridView1" AutoGenerateEditButton="True"
ondatabound="gv_DataBound" runat="server" DataSourceID="SqlDataSource1"
AutoGenerateColumns="False" width="600px">
<Columns>
<asp:BoundField HeaderText="UserId"
DataField="UserId"
SortExpression="UserId" ItemStyle-Width="400px"></asp:BoundField>
</Columns>
</asp:GridView>