2012-11-19 163 views
1

我想在我的頁面中使用可滾動的GridView,但問題在於標題和字段或單元格內容未對齊。換句話說,我的單元格或字段不與標題對齊;他們有點向右移動。在應用JQuery Scrollable函數之前,所有東西都完美對齊,現在我不知道如何解決這個問題。有人可以幫忙嗎?謝謝 這是我的代碼在ASP.Net中帶有固定標題的JQuery可滾動GridView

<script src="../Scripts/jquery-1.8.1.min.js" type="text/javascript"></script> 
<script src="../Scripts/ScrollableGridViewPlugin_ASP.NetAJAXmin.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#<%=GV_Detail.ClientID %>').Scrollable({ 
      ScrollHeight: 300, 
      IsInUpdatePanel: true 
     }); 
    }); 
</script> 

</asp:Content> 
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server"> 
<asp:ScriptManager ID="ScriptManager1" runat="server"> 
    </asp:ScriptManager> 
<div> 
<asp:UpdatePanel ID="up" runat="server"> 
    <ContentTemplate> 
    <asp:GridView ID="GV_Detail" runat="server" 
     AllowSorting="True" AutoGenerateColumns="False" BackColor="White" 
     BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="3" 
     DataSourceID="GV_Detail_DS"> 
     <Columns> 
       <asp:BoundField DataField="ContactName" HeaderText="Contact Name" /> 
       <asp:BoundField DataField="City" HeaderText="City" /> 
       <asp:BoundField DataField="Country" HeaderText="Country" /> 
       </Columns> 
     <FooterStyle BackColor="White" ForeColor="#000066" /> 
     <HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" /> 
     <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" /> 
     <RowStyle ForeColor="#000066" /> 
     <SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" /> 
     <SortedAscendingCellStyle BackColor="#F1F1F1" /> 
     <SortedAscendingHeaderStyle BackColor="#007DBB" /> 
     <SortedDescendingCellStyle BackColor="#CAC9C9" /> 
     <SortedDescendingHeaderStyle BackColor="#00547E" /> 
    </asp:GridView> 
    <asp:SqlDataSource ID="GV_Detail_DS" runat="server" 
     ConnectionString="<%$ ConnectionStrings:MyConnectionString %>" 
     SelectCommand="SELECT contactname, city, country from my table"> 
    </asp:SqlDataSource> 

    </ContentTemplate> 
</asp:UpdatePanel> 
</div> 
+0

請幫忙嗎? – moe

回答

1

也許你可以試試我的解決方案。我測試了所有細胞對齊。

GridViewScroll with jQuery

enter image description here

+0

這不適用於用戶控件中的gridview,能否請您提供解決方案 – ansar

0

要對準你有刪除的cellpadding,然後嘗試一下頭電網。

或者,您可以使用上面的插件。它在大多數情況下都有效,但在某些情況下會導致雙重回傳。