Asp.net Lock/Freeze Многострочные заголовки Gridview

Я дал задание заморозить заголовки в моем Gridview. Gridview также должен иметь возможность прокрутки. Я реализовал функцию прокрутки. Я не могу получить функцию блокировки заголовка. Я пробовал различные решения, включая стили css и плагины JQuery, но ничего не работает. Я думаю, что самым большим является то, что мой Gridview имеет многострочный заголовок. Я определяю один заголовок строки в aspx, затем я создал второй заголовок строки в событии привязки данных строки Gridview. Любые полезные решения?

Код ниже

aspx

<div style="height: 95%; overflow-y: auto;">
                    <asp:GridView ID="markdownGrid" runat="server" AutoGenerateColumns="false" BackColor="White" RowStyle-Height="15" HeaderStyle-Height="20" HeaderStyle-Font-Size="small" HeaderStyle-Font-Names="Calibri" RowStyle-Font-Names="Calibri" RowStyle-Font-Size="13px" BorderWidth="0" OnRowDataBound="markdownGrid_RowDataBound" AllowPaging="false" OnPageIndexChanging="markdownGrid_PageIndexChanging" GridLines="Both" >
                        <RowStyle BackColor="#E5F2FF" CssClass="rowHeight" />
                        <AlternatingRowStyle BackColor="White" />
                        <Columns>
                            <asp:BoundField DataField="Row Header" HeaderText="" ItemStyle-Width="9%" ItemStyle-HorizontalAlign="Left" ItemStyle-Font-Bold="true" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores Clearance Actual"
                                HeaderText="Clearance Actual" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores Clearance Estimate" HeaderText="Clearance Estimate" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores Clearance Total" HeaderText="Clearance Total" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores POS Actual" HeaderText="POS Actual" ItemStyle-Width="4%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores MD Total" HeaderText="MD Total" ItemStyle-Width="4%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores Next Month Clearance Estimate" ItemStyle-Width="4%"
                                HeaderText="Next Month Clearance Estimate" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores blank" ItemStyle-Width="0.5%" ItemStyle-BackColor="#F8F8F8" ItemStyle-BorderStyle="None" HeaderStyle-BorderStyle="None" HeaderStyle-BackColor="#F8F8F8" />

                            <asp:BoundField DataField="COM Clearance Actual"
                                HeaderText="Clearance Actual" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="COM Clearance Estimate" HeaderText="Clearance Estimate" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="COM Clearance Total" HeaderText="Clearance Total" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="COM POS Actual" HeaderText="POS Actual" ItemStyle-Width="4%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="COM MD Total" HeaderText="MD Total" ItemStyle-Width="4%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="COM Next Month Clearance Estimate" ItemStyle-Width="4%"
                                HeaderText="Next Month Clearance Estimate" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="COM blank" ItemStyle-Width="0.5%" ItemStyle-BackColor="#F8F8F8" ItemStyle-BorderStyle="None" HeaderStyle-BorderStyle="None" HeaderStyle-BackColor="#F8F8F8" />

                            <asp:BoundField DataField="Company Clearance Actual"
                                HeaderText="Clearance Actual" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company Clearance Estimate" HeaderText="Clearance Estimate" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company Clearance Total" HeaderText="Clearance Total" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company POS Actual" HeaderText="POS Actual" ItemStyle-Width="4%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company Other Actual" HeaderText="Other-MDA" ItemStyle-Width="5%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company MD Total" HeaderText="MD Total" ItemStyle-Width="4%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company LY Clearance" HeaderText="LY Clearance EOW" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company Next Month Clearance Estimate" ItemStyle-Width="4%" HeaderText="Next Month Clearance Estimate" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                        </Columns>
                    </asp:GridView>
                </div>

код позади

protected void markupGrid_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.Header)
        {
            if (dateSelection.Text != null)
            {
                e.Row.Cells[0].Text = dateSelection.Text;
            }

            GridViewRow headerow = new GridViewRow(0, 0, DataControlRowType.Header,
                                                      DataControlRowState.Insert);
            TableCell headercell = new TableCell()
            {
                // First blank cell                    
                Text = "PTD",
                ForeColor = Color.Red,
                HorizontalAlign = HorizontalAlign.Center,
                BorderWidth = 1,
                BorderColor = Color.Black,
                CssClass = "gridSectionHeaders"
            };
            headerow.Cells.Add(headercell);

            headercell = new TableCell()
            {
                // TOTAL SELLING LOCATIONS header
                ColumnSpan = 2,
                Text = "TOTAL SELLING LOCATIONS",
                HorizontalAlign = HorizontalAlign.Center,
                BorderWidth = 1,
                CssClass = "gridSectionHeaders"
            };
            headerow.Cells.Add(headercell);

            headercell = new TableCell()
            {
                // Second blank cell
                BackColor = ColorTranslator.FromHtml("#F8F8F8"),
                BorderWidth = 0
            };
            headerow.Cells.Add(headercell);

            headercell = new TableCell()
            {
                // COM header
                Text = "COM",
                ColumnSpan = 2,
                HorizontalAlign = HorizontalAlign.Center,
                BorderWidth = 1,
                CssClass = "gridSectionHeaders"
            };
            headerow.Cells.Add(headercell);

            headercell = new TableCell()
            {
                // Last blank cell
                BackColor = ColorTranslator.FromHtml("#F8F8F8"),
                BorderWidth = 0
            };
            headerow.Cells.Add(headercell);

            headercell = new TableCell()
            {
                // TOTAL header
                ColumnSpan = 3,
                Text = "TOTAL",
                HorizontalAlign = HorizontalAlign.Center,
                BorderWidth = 1,
                CssClass = "gridSectionHeaders"
            };

            headerow.Cells.Add(headercell);
            headercell.Height = 20;
            markupGrid.Controls[0].Controls.AddAt(0, headerow);
        }
    }

gridview freeze asp.net header multirow
person Jmunndi    schedule 09.09.2014    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Я думаю, вы ищете это.

Вот как я использую его в своем приложении, и он работает без проблем. Обратитесь к моим другим ответам здесь и здесь на SO для аналогичной проблемы

<script type="text/javascript"      src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="gridviewScroll.min.js"></script>
<link href="GridviewScroll.css" rel="stylesheet" />

function pageLoad(sender, args) {
   gridviewScroll ();
 }

 function gridviewScroll() {
    gridView1 = $('#GridView1').gridviewScroll({
       width: 915,
       height: 449,
       railcolor: "#F0F0F0",
       barcolor: "#CDCDCD",
       barhovercolor: "#606060",
       bgcolor: "#F0F0F0",
       freezesize: 5,
       arrowsize: 30,
       varrowtopimg: "../../../images/arrowvt.png",
       varrowbottomimg: "../../../images/arrowvb.png",
       harrowleftimg: "../../../images/arrowhl.png",
       harrowrightimg: "../../../images/arrowhr.png",
       headerrowcount: 1,
       onScrollVertical: function (delta) {
       // store the scroll offset outside of this function in a hidden field and restore if you want to maintain vertical scroll position
       },
      onScrollHorizontal: function (delta) {
        //store the scroll offset outside of this function in a hidden field and restore if you want to maintain horizontal scroll position
      }
    });
  }

И скрин-принт того, как выглядит замороженный заголовок сетки в моем приложении введите здесь описание изображения

person Dennis R    schedule 09.09.2014
comment
Раньше я пытался использовать gridviewScroll. Он поддерживает только замораживание/блокировку 1 строки заголовка. Мне нужно заморозить 2, может быть, 3 строки заголовка - person Jmunndi; 09.09.2014
comment
@Jmunndi У вас есть возможность сделать это. Измените значение свойства headerrowcount: 2 или headerrowcount: 3 в функции $('#GridView1').gridviewScroll({ .. в зависимости от ваших потребностей. - person Dennis R; 10.09.2014
comment
Я играл с ним больше, и он начинает собираться вместе. Моя проблема заключалась в том, что я использовал div для обработки прокрутки вместо плагина. Я все еще предпочитаю этот вариант, потому что у меня проблемы с установкой высоты и ширины. Я не могу использовать фиксированные значения пикселей, я должен использовать проценты. Когда я устанавливаю ширину на 100%, моя сетка выходит за пределы экрана, и включается горизонтальная прокрутка. Мне этого не надо. Вертикальная прокрутка — это хорошо, а горизонтальная — нет. Любые предложения по установке высоты и ширины сетки в процентах? - person Jmunndi; 10.09.2014