Как заставить Gridview визуализировать THEAD?

112

Как мне заставить GridViewэлемент управления отображать <thead> <tbody>теги? Я знаю, .UseAccessibleHeadersзаставляет его поставить <th>вместо <td>, но я не могу заставить <thead>его появиться.

Эндрю Баллок
источник
К сведению: UseAccessibleHeader по умолчанию имеет значение «true», поэтому вам не нужно его устанавливать. msdn.microsoft.com/en-us/library/…
MikeTeeVee

Ответы:

187

Это должно сделать это:

gv.HeaderRow.TableSection = TableRowSection.TableHeader;
Фил Дженкинс
источник
69
HeaderRowИмущество будет nullдо тех пор , GridViewпока не связаны данные, поэтому убедитесь , что ждать , пока не привязка данных произошла перед запуском выше строки кода.
bdukes
6
Как комментарий ниже, с ASP.NET 4.5, по крайней мере, после того, как привязка не достаточно поздно, однако она работает в OnPreRender.
philw 06
У меня есть сетка с добавленными настраиваемыми подзаголовками. Каждый из этих подзаголовков показывает данные из источника данных. Причина, по которой я хотел визуализировать, thead- использовать его в jQuery. Однако после рендеринга заголовка tbodyкажется, что он недоступен. Чего может не хватать в моем случае?
bonCodigo
1
Я обнаружил, что во время обратной передачи все еще существуют проблемы, и поместил код в событие привязки данных, которое адресовало все сценарии.
Джеймс Вестгейт
Я беру свои данные из базы данных, когда пользователь нажимает кнопку. В этом случае в gridview отсутствует тег thead. Любая помощь?
touinta
26

Я использую это в OnRowDataBoundслучае:

protected void GridViewResults_OnRowDataBound(object sender, GridViewRowEventArgs e) {
    if (e.Row.RowType == DataControlRowType.Header) {
        e.Row.TableSection = TableRowSection.TableHeader;
    }
}
Нето Кун
источник
7
Это единственное решение, которое у меня сработало. Кто разработал эти ужасные средства управления?
EKW,
2
Я вставил ваш код в событие OnRowCreated и заставил его работать правильно.
yougotiger 08
Это лучшее решение, поскольку оно устраняет риск (и обязательную проверку) того, что TableSection будет нулевым, если в DataSource нет строк.
EvilDr
1
Fyi, если это GridViewнаходится внутри, UpdatePanelа асинхронная обратная передача вызвана каким-либо другим элементом управления, тогда OnRowDataBoundсобытие не будет вызвано, поэтому код в этом ответе не будет выполнен, что приведет к GridViewвозврату к рендерингу без <thead>тегов ... вздох . Чтобы нацеливаться на этот случай, вставьте код из принятого ответа в PreRenderобработчик событий gridView (так же, как предлагает ответ ASalvo ).
Mr.Z
Это правильный ответ, поскольку он правильно использует рабочий процесс WebForms.
Марсель
10

Код в ответе должен продолжаться Page_Loadили GridView_PreRender. Я поместил его в метод, который был вызван после, Page_Loadи получил NullReferenceException.

ASalvo
источник
4
Также можно поставить на DataBoundмероприятие. grid.DataBound += (s, e) => { grid.HeaderRow.TableSection = TableRowSection.TableHeader; };
BrunoLM,
4
Не знаю, изменилось ли это сейчас в .NET 4.5 ... но я получаю, что HeaderRow имеет значение null в обработчиках событий _DataBound и _PreRender. Это может быть связано с тем, что я использую новую функцию «Связывание модели» веб-форм ASP.NET в gridView.
ClearCloud8,
7

Для этого я использую следующий код:

В ifзаявлении , которые я добавил важно.

В противном случае (в зависимости от того, как вы визуализируете свою сетку) вы создадите исключения вроде:

Таблица должна содержать разделы строк в следующем порядке: верхний, основной и нижний колонтитулы.

protected override void OnPreRender(EventArgs e)
{
    if ( (this.ShowHeader == true && this.Rows.Count > 0)
      || (this.ShowHeaderWhenEmpty == true))
    {
        //Force GridView to use <thead> instead of <tbody> - 11/03/2013 - MCR.
        this.HeaderRow.TableSection = TableRowSection.TableHeader;
    }
    if (this.ShowFooter == true && this.Rows.Count > 0)
    {
        //Force GridView to use <tfoot> instead of <tbody> - 11/03/2013 - MCR.
        this.FooterRow.TableSection = TableRowSection.TableFooter;
    }
    base.OnPreRender(e);
}

thisОбъект мой GridView.

Я фактически переопределил Asp.net GridView, чтобы создать свой собственный настраиваемый элемент управления, но вы можете вставить его на свою страницу aspx.cs и ссылаться на GridView по имени вместо использования подхода custom-gridview.

К вашему сведению: я не тестировал логику нижнего колонтитула, но знаю, что это работает для заголовков.

MikeTeeVee
источник
5

Это работает для меня:

protected void GrdPagosRowCreated(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        e.Row.TableSection = TableRowSection.TableBody;
    }
    else if (e.Row.RowType == DataControlRowType.Header)
    {
        e.Row.TableSection = TableRowSection.TableHeader;
    }
    else if (e.Row.RowType == DataControlRowType.Footer)
    {
        e.Row.TableSection = TableRowSection.TableFooter;
    }
}

Это было пробовано в VS2010.

Фелипе Дельгадо
источник
2

Я знаю, что это устарело, но вот интерпретация ответа MikeTeeVee для стандартного представления сетки:

страница aspx:

<asp:GridView ID="GridView1" runat="server" 
    OnPreRender="GridView_PreRender">

aspx.cs:

    protected void GridView_PreRender(object sender, EventArgs e)
    {
        GridView gv = (GridView)sender;

        if ((gv.ShowHeader == true && gv.Rows.Count > 0)
            || (gv.ShowHeaderWhenEmpty == true))
        {
            //Force GridView to use <thead> instead of <tbody> - 11/03/2013 - MCR.
            gv.HeaderRow.TableSection = TableRowSection.TableHeader;
        }
        if (gv.ShowFooter == true && gv.Rows.Count > 0)
        {
            //Force GridView to use <tfoot> instead of <tbody> - 11/03/2013 - MCR.
            gv.FooterRow.TableSection = TableRowSection.TableFooter;
        }

    }
Джонатан Харрис
источник
2

Создайте функцию и используйте ее в своем PageLoadмероприятии следующим образом:

Функция:

private void MakeGridViewPrinterFriendly(GridView gridView) {  
    if (gridView.Rows.Count > 0) {          
        gridView.UseAccessibleHeader = true;  
        gridView.HeaderRow.TableSection = TableRowSection.TableHeader;  
    }  
} 

PageLoadСобытие:

protected void Page_Load(object sender, EventArgs e) {
        if (!IsPostBack)
        {
            MakeGridViewPrinterFriendly(grddata);
        }
}
Rajpurohit
источник
0

Вы также можете использовать jQuery, чтобы добавить его. Это позволяет избежать проблемы с TableRowSection.TableHeader, которая отбрасывается в PostBack.

$('#myTableId').prepend($("<thead></thead>").append($(this).find("#myTableId tr:first")));

Майкл
источник