1

我需要修复网格视图的标题。我试过 jscript 文件，

        <div class="Container"  style="width: 816px; height: 319px;">
                                                        <asp:GridView 
                                                        ID="GrdViewMyTasks" runat="server" AllowSorting="True" 
                                                        AutoGenerateColumns="False" BackColor="White" BorderColor="#0061C1" 
                                                        BorderStyle="None" CaptionAlign="Bottom" EmptyDataText="No Records Found" 
                                                        Font-Names="Verdana" Font-Size="X-Small" ForeColor="#0061C1"  
                                                        OnRowDataBound="GrdViewMyTasks_RowDataBound" width="99%" Height="247px"
                                                        onselectedindexchanged="GrdViewMyTasks_SelectedIndexChanged" ShowFooter="True" 
                                                        ShowHeaderWhenEmpty="True" >
                                                        <Columns>
                                                        <asp:BoundField DataField="TaskID" HeaderText="SL No" >
                                                                <FooterStyle BackColor="#0061C1" />
                                                                <HeaderStyle BackColor="#0061C1" HorizontalAlign="Center" 
                                                                VerticalAlign="Middle"  />
                                                              <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                                             </asp:BoundField>
                                                             <asp:TemplateField HeaderText="Task Name">
                                                             <ItemTemplate>
                                                                <asp:Label ID="TaskName" runat="server" 
                                                                    Font-Names="Verdana" Font-Size="X-Small" Height="24px" 
                                                                    Text='<%# Eval("TaskName")%>' Width="70px"></asp:Label>
                                                            </ItemTemplate>
                                                            <FooterStyle BackColor="#0061C1" />
                                                            <HeaderStyle BackColor="#0061C1" ForeColor="White"   />
                                                            <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                                            </asp:TemplateField>
                                                            <asp:TemplateField HeaderText="Due Date">
                                                            <ItemTemplate>
                                                            <asp:Label 
                                                                    ID="DueDate" runat="server" DataFormatString="{0:dd/MM/yyyy}" 
                                                                    Font-Names="Verdana" Font-Size="X-Small" Height="20px" 
                                                                    Text='<%# Eval("DueDate","{0:dd/MM/yyyy}")%>' Width="70px"></asp:Label>
                                                            </ItemTemplate>
                                                            <FooterStyle BackColor="#0061C1" />
                                                            <HeaderStyle BackColor="#0061C1" ForeColor="White"   />
                                                            <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                                            </asp:TemplateField>
                                                            <asp:TemplateField HeaderText="Description">
                                                            <ItemTemplate>
                                                            <asp:Label 
                                                                    ID="Description" runat="server" Font-Names="Verdana" Font-Size="X-Small" 
                                                                    Height="20px" Text='<%# Eval("Description")%>' Width="90px"></asp:Label>
                                                            </ItemTemplate>
                                                            <FooterStyle BackColor="#0061C1" />
                                                            <HeaderStyle BackColor="#0061C1" ForeColor="White"  />
                                                            <ItemStyle HorizontalAlign="Left" VerticalAlign="Middle" />
                                                            </asp:TemplateField>
                                                            <asp:TemplateField HeaderText="Assign By">
                                                            <ItemTemplate>
                                                            <asp:Label 
                                                                    ID="AssignBy" runat="server" Font-Names="Verdana" Font-Size="X-Small" 
                                                                    Height="20px" Text='<%# Eval("AssignBy")%>' Width="80px"></asp:Label>
                                                            </ItemTemplate>
                                                            <FooterStyle BackColor="#0061C1" />
                                                            <HeaderStyle BackColor="#0061C1" ForeColor="White"   />
                                                            <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                                            </asp:TemplateField>
                                                            <asp:TemplateField HeaderText="Status">
                                                            <ItemTemplate>
                                                            <asp:Label 
                                                                    ID="Status" runat="server" Font-Names="Verdana" Font-Size="X-Small" 
                                                                    Height="20px" Text='<%# Eval("Status")%>' Width="60px"></asp:Label>
                                                            </ItemTemplate>
                                                            <FooterStyle BackColor="#0061C1" />
                                                            <HeaderStyle BackColor="#0061C1" ForeColor="White"  />
                                                            <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                                            </asp:TemplateField>
                                                            <asp:TemplateField HeaderText="% Complete">
                                                            <ItemTemplate>
                                                            <asp:Label 
                                                                    ID="PercentageComplete" runat="server" Font-Names="Verdana" Font-Size="X-Small" 
                                                                    Height="20px" Text='<%# Eval("PercentageComplete")%>' Width="70px"></asp:Label>
                                                            </ItemTemplate>
                                                            <FooterStyle BackColor="#0061C1" />
                                                            <HeaderStyle BackColor="#0061C1" ForeColor="White"  />
                                                            <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                                            </asp:TemplateField>
                                                            <asp:TemplateField HeaderText="View Details">
                                                            <ItemTemplate>
                                                            <asp:HyperLink 
                                                                    ID="ViewDetails" runat="server" DataNavigateUrlFields="TaskID" 
                                                                    DataNavigateUrlFormatString="Reports.aspx?TaskID={0}" Font-Names="Verdana" 
                                                                    Font-Size="X-Small" ForeColor="#0061C1" Height="24px" Width="70px"
                                                                    NavigateUrl="Reports.aspx" Text="ViewDetails" >View</asp:HyperLink>
                                                            </ItemTemplate>
                                                            <FooterStyle BackColor="#0061C1" />
                                                            <HeaderStyle BackColor="#0061C1" ForeColor="White"   />
                                                            <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                                                            </asp:TemplateField>
                                                        </Columns>
                                                    </asp:GridView>
                                                    </div>

                  <style type="text/css">

                  .Container
                    {
                        overflow: auto;
                     }
      <script src="jquery-1.4.1.min.js" type="text/javascript"></script>
      <script src="ScrollableGrid.js" type="text/javascript"></script>

       <script type="text/javascript" language="javascript">
          $(document).ready(function () {
           $('#<%=GrdViewMyTasks.ClientID %>').Scrollable();
           }
           )
               </script>

标题被固定，但 d 网格视图宽度已缩短，标题大小已增加.. dsnt 适合 d div 标签.. 我已经放置了我的网格视图代码和 jquery 文件

4

3 回答 3

3

试着js像这样归档

<script type="text/javascript" language="javascript">
$(document).ready(function() 
{
$('#<%=GridViewName.ClientID %>').Scrollable();
}
)
</script>

检查这个jQuery Fixed Header Scrollable GridView

您将从Jquery orignal 网站ScrollableGrid.js获取文件。

希望对你有效。

于 2013-07-05T06:54:33.593 回答
1

您的代码有两个问题：

  1. 定位absolute应用于第一个boundfield，这意味着它将应用于第一列中的所有单元格！它也适用于templatefield's headerstyleandfooterstyle但不适用于 the itemtemplate（无论如何这无关紧要）！此外，它在左上角以 0-0 取胜。所以，难怪你的列合并并合并到最左边的列。

  2. 这一切对桌子来说毫无意义。您不能在表格单元格上应用定位！您可以将定位应用于整个表格，但单个单元格，不行。

您的问题的两种解决方案：

  1. 创建您自己的代码来创建一个可滚动的表格。您将必须创建单独的页眉和/或页脚表。您无法在不拆分thead和/或的情况下创建可滚动表tfoot。

  2. 去人们推荐给你的图书馆。

于 2013-07-05T07:01:06.280 回答
0

这可能会有所帮助：http ://www.fixedheadertable.com/ - 它是更可靠的跨浏览器。尽管您可能不得不说服 ASP.NET 来呈现<th>标签：如何让 Gridview 呈现 THEAD？

于 2013-07-05T06:22:04.237 回答