ASP.NET Установка ширины столбца DataBound в GridView

У меня есть GridView, который использует столбцы BoundField для столбцов. Я пытаюсь установить maxwidth для моего столбца 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.

Ответ 1

Я сделал небольшую демонстрацию для вас. Демонстрация способа отображения длинного текста.

В этом примере есть столбец Name, который может содержать очень длинный текст. boundField отобразит весь контент в ячейке таблицы, и, следовательно, ячейка будет расширяться по мере необходимости (из-за содержимого)

TemplateField также будет отображаться как ячейка, но он содержит div, который ограничивает ширину любой шаблон, например, 40 пикселей. Таким образом, этот столбец будет иметь некоторую максимальную ширину!

    <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>

enter image description here

Вот мой демо-кодBehind

 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;
     }
 }

Ответ 2

добавьте HeaderStyle в связанное поле:

    <asp:BoundField HeaderText="UserId"
                DataField="UserId" 
                SortExpression="UserId">

                <HeaderStyle Width="200px" />

</asp:BoundField>

Ответ 3

Ширина может быть установлена ​​в конкретный столбец, как показано ниже: По процентам:

<asp:BoundField HeaderText="UserInfo"  DataField="UserInfo"  
SortExpression="UserInfo" ItemStyle-Width="100%"></asp:BoundField>

ИЛИ

По пикселю:

<asp:BoundField HeaderText="UserInfo"  DataField="UserInfo"  
SortExpression="UserInfo" ItemStyle-Width="500px"></asp:BoundField>

Ответ 4

Это будет работать для всех ситуаций при работе с шириной.

`<asp:TemplateField HeaderText="DATE">
   <ItemTemplate>
   <asp:Label ID="Label1" runat="server" Text='<%# Bind("date") %>' Width="100px"></asp:Label>
   </ItemTemplate>
  </asp:TemplateField>`

Ответ 5

<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>

Ответ 6

В последнее время я понял, как установить ширину, если привязка данных gridview с помощью sql dataset. Сначала установите этот элемент управления RowStyle-Wrap="false" HeaderStyle-Wrap="false", а затем вы можете установить ширину столбца столько, сколько хотите. ex: ItemStyle-Width="150px" HeaderStyle-Width="150px"