girdview의 머리글을 고정하는 방법 [gridview 및 열 너비가 고정되어 있지 않습니다.]

수직 스크롤 막대가있는 Gridview 고정 헤더를 구현하고 있습니다. 여기에 제안 된 많은 솔루션을 시도했습니다. 그러나 문제는 다음과 같습니다.girdview의 머리글을 고정하는 방법 [gridview 및 열 너비가 고정되어 있지 않습니다.]

Gridview는 너비가 고정되지 않은 패널 안에 있습니다. 그것의 97 %.

2. 열의 폭이 고정되어 있지 않습니다.

GridviewScroll.js에서 제안한 해결책을 시도했지만 고정 너비가 문제이며 Gridview가 창 크기에 따라 크기가 조정되지 않습니다. 다음은

내 코드

  <asp:Panel ID="panel_gridholder" runat="server" style="position:absolute;left:10px;width:97%; min-width:1020px;margin-top:3px;margin-bottom:20px;overflow:auto;" > 


      <asp:GridView ID="GridView_Vehicle" runat="server" AutoGenerateColumns="False" AllowSorting="true" PagerSettings-Position="TopAndBottom" 
       OnPageIndexChanging="GridView_Vehicle_PageIndexChanging" OnSorting="GridView_Vehicle_Sorting" PageSize="100" 
       GridLines="None" AllowPaging="true" CssClass="mGrid" PagerStyle-CssClass="pgr" AlternatingRowStyle-CssClass="alt"> 
       <Columns> </Columns> 
      </asp:GridView> 

      <div style="height: 400px"></div> 
     </asp:Panel>

어떤 제안을 기존됩니다 ..

내가 너무 많은 솔루션을하지만 아무것도 고정 폭없이 작동되지 시도, 그래서 나는 여기에 제시 할 수 없습니까?

출처

2017-03-22 Vani

DataTables을 사용하고 싶습니다. 당신이 원하는 것을하는 것 (나는 당신의 요구 사항을 이해함에 따라)을 성숙하고 안정적이며 훨씬 더 많이 수행 할 수 있습니다. 바이올린에 https://jsfiddle.net/objo18f9/3/

제가 설명하는 JsFiddle 만든 헤더 내용을 세로 스크롤로 고정되고 지정된 열 크기가 없습니다 (피들의 중간 구분선을 왼쪽 또는 오른쪽으로 드래그하면 크기가 조정되고 테이블은 페이지 너비의 97 %로 설정된 div으로 둘러싸여 있습니다) ASP.Net)에서로 렌더링하고, 페이징이 켜져 여기

는 코드 조각과 같은 예입니다 :

$(document).ready(function() { 
 
    $('#example').DataTable({ 
 
    "scrollY": "200px", 
 
    "scrollCollapse": true, 
 
    "paging": true 
 
    }); 
 
});

<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script> 
 
<script type="text/javascript" src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script> 
 
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css"> 
 

 
<div width="97%"> 
 
    <table id="example" class="display" width="100%" cellspacing="0"> 
 
    <thead> 
 
     <tr> 
 
     <th>Name</th> 
 
     <th>Position</th> 
 
     <th>Office</th> 
 
     <th>Age</th> 
 
     <th>Start date</th> 
 
     <th>Salary</th> 
 
     </tr> 
 
    </thead> 
 
    <tbody> 
 
     <tr> 
 
     <td>Tiger Nixon</td> 
 
     <td>System Architect</td> 
 
     <td>Edinburgh</td> 
 
     <td>61</td> 
 
     <td>2011/04/25</td> 
 
     <td>$320,800</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Garrett Winters</td> 
 
     <td>Accountant</td> 
 
     <td>Tokyo</td> 
 
     <td>63</td> 
 
     <td>2011/07/25</td> 
 
     <td>$170,750</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Ashton Cox</td> 
 
     <td>Junior Technical Author</td> 
 
     <td>San Francisco</td> 
 
     <td>66</td> 
 
     <td>2009/01/12</td> 
 
     <td>$86,000</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Cedric Kelly</td> 
 
     <td>Senior Javascript Developer</td> 
 
     <td>Edinburgh</td> 
 
     <td>22</td> 
 
     <td>2012/03/29</td> 
 
     <td>$433,060</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Airi Satou</td> 
 
     <td>Accountant</td> 
 
     <td>Tokyo</td> 
 
     <td>33</td> 
 
     <td>2008/11/28</td> 
 
     <td>$162,700</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Brielle Williamson</td> 
 
     <td>Integration Specialist</td> 
 
     <td>New York</td> 
 
     <td>61</td> 
 
     <td>2012/12/02</td> 
 
     <td>$372,000</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Herrod Chandler</td> 
 
     <td>Sales Assistant</td> 
 
     <td>San Francisco</td> 
 
     <td>59</td> 
 
     <td>2012/08/06</td> 
 
     <td>$137,500</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Rhona Davidson</td> 
 
     <td>Integration Specialist</td> 
 
     <td>Tokyo</td> 
 
     <td>55</td> 
 
     <td>2010/10/14</td> 
 
     <td>$327,900</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Colleen Hurst</td> 
 
     <td>Javascript Developer</td> 
 
     <td>San Francisco</td> 
 
     <td>39</td> 
 
     <td>2009/09/15</td> 
 
     <td>$205,500</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Sonya Frost</td> 
 
     <td>Software Engineer</td> 
 
     <td>Edinburgh</td> 
 
     <td>23</td> 
 
     <td>2008/12/13</td> 
 
     <td>$103,600</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Jena Gaines</td> 
 
     <td>Office Manager</td> 
 
     <td>London</td> 
 
     <td>30</td> 
 
     <td>2008/12/19</td> 
 
     <td>$90,560</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Quinn Flynn</td> 
 
     <td>Support Lead</td> 
 
     <td>Edinburgh</td> 
 
     <td>22</td> 
 
     <td>2013/03/03</td> 
 
     <td>$342,000</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Charde Marshall</td> 
 
     <td>Regional Director</td> 
 
     <td>San Francisco</td> 
 
     <td>36</td> 
 
     <td>2008/10/16</td> 
 
     <td>$470,600</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Haley Kennedy</td> 
 
     <td>Senior Marketing Designer</td> 
 
     <td>London</td> 
 
     <td>43</td> 
 
     <td>2012/12/18</td> 
 
     <td>$313,500</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Tatyana Fitzpatrick</td> 
 
     <td>Regional Director</td> 
 
     <td>London</td> 
 
     <td>19</td> 
 
     <td>2010/03/17</td> 
 
     <td>$385,750</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Michael Silva</td> 
 
     <td>Marketing Designer</td> 
 
     <td>London</td> 
 
     <td>66</td> 
 
     <td>2012/11/27</td> 
 
     <td>$198,500</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Paul Byrd</td> 
 
     <td>Chief Financial Officer (CFO)</td> 
 
     <td>New York</td> 
 
     <td>64</td> 
 
     <td>2010/06/09</td> 
 
     <td>$725,000</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Gloria Little</td> 
 
     <td>Systems Administrator</td> 
 
     <td>New York</td> 
 
     <td>59</td> 
 
     <td>2009/04/10</td> 
 
     <td>$237,500</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Bradley Greer</td> 
 
     <td>Software Engineer</td> 
 
     <td>London</td> 
 
     <td>41</td> 
 
     <td>2012/10/13</td> 
 
     <td>$132,000</td> 
 
     </tr> 
 
     <tr> 
 
     <td>Dai Rios</td> 
 
     <td>Personnel Lead</td> 
 
     <td>Edinburgh</td> 
 
     <td>35</td> 
 
     <td>2012/09/26</td> 
 
     <td>$217,500</td> 
 
     </tr> 
 
    </tbody> 
 
    </table> 
 
</div>

당신이 ASP.Net을 말할 경우을 사용합니다. 정적 ID : <asp:GridView ID="GridView_Vehicle" ClientIDMode="static" ... 다음 테이블을 참조 할 수 있어야합니다 :여기

출처

2017-03-31 10:02:58

행의 적당한 수의 격자에 대한 해결책 (당신이 그 이상이있는 경우, 당신은 대신 스크롤의 작은 크기의 페이징을 사용할 수 있습니다) :

이 두의 GridView 요소 만들기 두 번째 ShowHeader = "false"를 제외하고는 동일한 사양 및 데이터 소스. 첫 번째를 style = "height : 38px; overflow : hidden"인 div에 넣으십시오 (머리글에 사용 된 글꼴을 기준으로 높이를 조정해야 할 수도 있음). 두 번째를 style = "max-height : 400px; overflow : auto"로 div에 넣으십시오 (표시 할 행 수에 따라 높이를 조정하십시오). 두 테이블 모두 동일한 데이터를 사용하므로 제대로 정렬되어야하며 두 번째 테이블은 스크롤 할 수 있어야합니다. 정렬을 사용하려면 서버에서 공유 데이터 소스로 가져 와서 두 번째 GridView를 UpdatePanel에 배치하고 AsyncPostBackTrigger가 첫 번째를 가리키는 상태로 만듭니다. 귀하의 예를위한 코드는 다음과 같습니다.

<asp:Panel ID="panel_gridholder" runat="server" style="position:absolute;left:10px;width:97%; min-width:1020px;margin-top:3px;margin-bottom:20px;" > 
    <div style="height:38px; overflow:hidden"> 
     <asp:GridView ID="GridView_Vehicle_Header" runat="server" AutoGenerateColumns="False" ShowHeaderWhenEmpty="true" AllowSorting="true" OnSorting="GridView_Vehicle_Sorting" GridLines="None" CssClass="mGrid" AlternatingRowStyle-CssClass="alt"> 
      <Columns> </Columns> 
     </asp:GridView> 
    </div> 
    <div style="max-height:400px; overflow:auto"> 
     <asp:UpdatePanel ID="UpdatePanel" runat="server" UpdateMode="Conditional"> 
      <ContentTemplate> 
      <asp:GridView ID="GridView_Vehicle" runat="server" AutoGenerateColumns="False" ShowHeader="false" AllowSorting="true" OnSorting="GridView_Vehicle_Sorting" GridLines="None" CssClass="mGrid" AlternatingRowStyle-CssClass="alt"> 
       <Columns> </Columns> 
      </asp:GridView> 
      </ContentTemplate> 
      <Triggers> 
      <asp:AsyncPostBackTrigger ControlID="GridView_Vehicle_Header" /> 
      </Triggers> 
     </asp:UpdatePanel> 
    </div> 
</asp:Panel>

출처

2017-06-30 20:25:40 johnm

girdview의 머리글을 고정하는 방법 [gridview 및 열 너비가 고정되어 있지 않습니다.]

답변

관련 문제