1. 홈
  2. 질의 응답
  3. 여러 수준의 열 머리글 구성

여러 수준의 열 머리글 구성

2014-06-16 2 views
1

나는 며칠 동안 GridView에서 머리글을 만들고 이동하는 방법을 알아 내려고 노력 해왔다. 나는 답장이없는 몇 가지 질문을했다.여러 수준의 열 머리글 구성

저는 abit을 더 멀리 옮길 수 있었고 지금은 다른 방식으로 가고 있습니다. 내가 지금 제목 '로타'을 만든 다음 그 제의 GridView에 필요한 일을 만들 아래에있는

enter image description here

,하지만 난 3 문제가 :

이 내가 만들고 싶었 것입니다.

  • 내 데이터는 내가 가지고있는 행의 양에 따라 복제됩니다.

  • '실제'와 '예상'을 일 아래로 이동해야합니다.

  • 시간 표시 아래에 1 ~ 23을 표시해야합니다.

이

내가 지금까지 무엇을 가지고 :

enter image description here

당신은 모든 것이 그냥 헤더를 할 때 실제 또한, 중복지고 가로 질러 퍼져 될 필요가 기대 볼 수 있듯이 S 까지 (처음 시간 레이블을 유지해야 함) 그리고 마지막으로 '시간'레이블 아래에 시간을 표시해야합니다.

HTML (지금까지) : (지금까지)

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" OnDataBound="GridView1_DataBound"> 
        <Columns> 
<asp:TemplateField HeaderText="M" ItemStyle-Width="30"> 
     <ItemTemplate> 
      <asp:Label ID="lblMonday" runat="server" Text="Hour"> 
      </asp:Label> 

     </ItemTemplate> 
     <FooterTemplate> 
<asp:Label ID="lblTotal" runat="server"></asp:Label> 
</FooterTemplate> 
     </asp:TemplateField> 
      <asp:TemplateField HeaderText="T" ItemStyle-Width="30"> 
     <ItemTemplate> 
      <asp:Label ID="lblTuesday" runat="server" Text="T"> 
      </asp:Label> 
     </ItemTemplate> 
     </asp:TemplateField> 
      <asp:TemplateField HeaderText="W" ItemStyle-Width="30"> 
     <ItemTemplate> 
      <asp:Label ID="lblWednesday" runat="server" Text="W"> 
      </asp:Label> 
     </ItemTemplate> 
     </asp:TemplateField> 
      <asp:TemplateField HeaderText="T" ItemStyle-Width="30"> 
     <ItemTemplate> 
      <asp:Label ID="lblThursday" runat="server" Text="T"> 
      </asp:Label> 
     </ItemTemplate> 
     </asp:TemplateField> 
      <asp:TemplateField HeaderText="F" ItemStyle-Width="30"> 
     <ItemTemplate> 
      <asp:Label ID="lblFriday" runat="server" Text="F"> 
      </asp:Label> 
     </ItemTemplate> 
     </asp:TemplateField> 
      <asp:TemplateField HeaderText="S" ItemStyle-Width="30"> 
     <ItemTemplate> 
      <asp:Label ID="lblSaturday" runat="server" Text="S"> 
      </asp:Label> 
     </ItemTemplate> 
     </asp:TemplateField> 
      <asp:TemplateField HeaderText="S" ItemStyle-Width="30"> 
     <ItemTemplate> 
      <asp:Label ID="lblSunday" runat="server" Text="S"> 
      </asp:Label> 
     </ItemTemplate> 
     </asp:TemplateField> 


         <asp:BoundField HeaderText="Required" ItemStyle-HorizontalAlign="Center" ItemStyle-Width="70" /> 
         <asp:BoundField HeaderText="Actual" ItemStyle-HorizontalAlign="Center" ItemStyle-Width="70" /> 
        </Columns> 
       </asp:GridView>

C 번호 :

  GridViewRow HeaderRow = new GridViewRow(1, 0, DataControlRowType.Header, DataControlRowState.Insert); 

     TableCell HeaderCell2 = new TableCell(); 
     HeaderCell2.Text = "Rota Data Schedule"; 
     HeaderCell2.ColumnSpan = 7; 
     HeaderCell2.HorizontalAlign = HorizontalAlign.Center; 
     HeaderRow.Cells.Add(HeaderCell2); 


     GridView1.Controls[0].Controls.AddAt(0, HeaderRow);

UPDATE 내의 GridView의 레이아웃하지만 GRIDVIEW을 제압 한

여전히 내 데이터를 복제하고 있습니다.

private DataTable GridData() 
    { 
     DataTable griddt; 
     griddt = new DataTable(); 
     griddt.Columns.Add("id", typeof(string)); 
     griddt.Columns.Add("Hour", typeof(int)); 

     DataRow griddr; 

     griddr = griddt.NewRow(); 
     griddr["id"] = 1; 
     griddr["Hour"] = 1; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 2; 
     griddr["Hour"] = 2; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 3; 
     griddr["Hour"] = 3; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 4; 
     griddr["Hour"] = 4; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 5; 
     griddr["Hour"] = 5; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 6; 
     griddr["Hour"] = 6; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 7; 
     griddr["Hour"] = 7; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 8; 
     griddr["Hour"] = 8; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 9; 
     griddr["Hour"] = 9; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 10; 
     griddr["Hour"] = 10; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 11; 
     griddr["Hour"] = 11; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 12; 
     griddr["Hour"] = 12; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 13; 
     griddr["Hour"] = 13; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 14; 
     griddr["Hour"] = 14; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 15; 
     griddr["Hour"] = 15; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 16; 
     griddr["Hour"] = 16; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 17; 
     griddr["Hour"] = 17; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 18; 
     griddr["Hour"] = 18; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 19; 
     griddr["Hour"] = 19; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 20; 
     griddr["Hour"] = 20; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 21; 
     griddr["Hour"] = 21; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 22; 
     griddr["Hour"] = 22; 
     griddt.Rows.Add(griddr); 

     griddr = griddt.NewRow(); 
     griddr["id"] = 23; 
     griddr["Hour"] = 23; 
     griddt.Rows.Add(griddr); 

     griddt.PrimaryKey = new DataColumn[] { griddt.Columns["id"] }; 

     return griddt;

출처

2014-06-16 Ben Clarke

+0

실례합니다.하지만 도움이되기 전에 내 자신의 이해를 구축해야합니다. 나는 [Wikipedia의 Rota_ (일정)] (http://en.wikipedia.org/wiki/Rota_ (일정)) 설명 아래에있는 것과 같은 표를 기대합니다. 귀하의 경우, 나는 '시간'이 이름으로 존재하지 않을 것으로 기대하고, _each_ 하루 아래에 '예상'과 '실제'가 존재할 것으로 기대합니다. 당신이 보여주고 자하는 것의 더 상세한 예를 (자료로 채워서) 줄 수 있습니까? –

+0

@MikeGuthrie 돌아와 줘서 고마워. 데이터는 단지 직원이 그 날에 있어야하는 숫자와 실제로 얼마나 많은 숫자가 될 것입니다. 레이아웃을 달성 했으므로 내 질문을 편집 했으므로 그리드에서 데이터 복제를 중단하고 시도해야합니다. –

+0

@MikeGuthrie 내 질문의 맨 위에 이미지를 그렸습니다. 상단의 Days (일)가 클릭 가능을 클릭하고 빨간색 상자의 데이터를 변경합니다. 시간은 왼쪽 아래에있을 것입니다. 이미지는 내 질문의 상단에 설명해야합니다. –

답변

0

내가 당신이 레이아웃을 위해 만든이 샘플 솔루션에서보세요 : 여기

enter image description here

내가 내보기 엉망으로 생각하는 이유입니다 내 '가짜'데이터입니다 후 :

영문 마크 업 :

<div style="width:420px; text-align:center; border:1px solid black;"> 
    Rota Data Schedule 
    <br /> 
    <asp:Repeater runat="server" ID="rpDaysOfWeek"> 
     <ItemTemplate><asp:LinkButton runat="server" ID="lnkDay" CommandArgument='<%# Bind("DayID") %>' OnCommand="DaySelect_Command" 
       Font-Bold='<%# Bind("IsSelected") %>' Text='<%# Bind("DayAbbr") %>' Width="58" BorderStyle="Solid" BorderWidth="1" 
       style="margin:0 0 0 0;" BorderColor="Black" ForeColor="Black" /></ItemTemplate> 
    </asp:Repeater> 
    <asp:GridView runat="server" ID="gvHoursAttendance" Width="420" AutoGenerateColumns="false"> 
     <Columns> 
      <asp:BoundField HeaderText="Hour" DataField="Hour" DataFormatString="{0:00':00'}" /> 
      <asp:BoundField HeaderText="Expected" DataField="ExpectedCount" /> 
      <asp:BoundField HeaderText="Actual" DataField="ActualCount" /> 
     </Columns> 
    </asp:GridView> 
</div>

그리고 코드 숨김 :

private DaySelect[] Days = new DaySelect[] 
    { 
     new DaySelect() { DayAbbr = "M", DayID = 1, IsSelected = true }, 
     new DaySelect() { DayAbbr = "T", DayID = 2 }, 
     new DaySelect() { DayAbbr = "W", DayID = 3 }, 
     new DaySelect() { DayAbbr = "T", DayID = 4 }, 
     new DaySelect() { DayAbbr = "F", DayID = 5 }, 
     new DaySelect() { DayAbbr = "S", DayID = 6 }, 
     new DaySelect() { DayAbbr = "S", DayID = 7 }, 
    }; 

protected void Page_Load(object sender, EventArgs e) 
{ 
    rpDaysOfWeek.DataSource = Days; 

    if (!Page.IsPostBack) 
    { 
     rpDaysOfWeek.DataBind(); 
     gvHoursAttendance.DataSource = CreateWorkHours(Days.Single(d => d.IsSelected).DayID); 
     gvHoursAttendance.DataBind(); 
    } 
} 

protected void DaySelect_Command(object sender, CommandEventArgs e) 
{ 
    int dayId = Convert.ToInt32(e.CommandArgument); 
    foreach (DaySelect day in Days) 
    { 
     day.IsSelected = day.DayID == dayId; 
    } 
    rpDaysOfWeek.DataBind(); 
    gvHoursAttendance.DataSource = CreateWorkHours(Days.Single(d => d.IsSelected).DayID); 
    gvHoursAttendance.DataBind(); 
} 

public WorkHour[] CreateWorkHours(int dayId) 
{ 
    return new WorkHour[] 
     { 
      new WorkHour() { ActualCount = dayId, ExpectedCount = dayId, Hour = 0 }, 
      new WorkHour() { ActualCount = dayId, ExpectedCount = dayId, Hour = 1 }, 
      new WorkHour() { ActualCount = dayId, ExpectedCount = dayId, Hour = 2 }, 
      new WorkHour() { ActualCount = dayId, ExpectedCount = dayId, Hour = 3 }, 
      new WorkHour() { ActualCount = dayId + 1, ExpectedCount = dayId, Hour = 4 }, 
      new WorkHour() { ActualCount = dayId + 1, ExpectedCount = dayId, Hour = 5 }, 
      new WorkHour() { ActualCount = dayId + 1, ExpectedCount = dayId, Hour = 6 }, 
      new WorkHour() { ActualCount = dayId + 1, ExpectedCount = dayId, Hour = 7 }, 
      new WorkHour() { ActualCount = dayId, ExpectedCount = dayId + 1, Hour = 8 }, 
      new WorkHour() { ActualCount = dayId, ExpectedCount = dayId + 1, Hour = 9 }, 
      new WorkHour() { ActualCount = dayId, ExpectedCount = dayId + 1, Hour = 10 }, 
      new WorkHour() { ActualCount = dayId, ExpectedCount = dayId + 1, Hour = 11 }, 
      new WorkHour() { ActualCount = dayId + 1, ExpectedCount = dayId + 1, Hour = 12 }, 
      new WorkHour() { ActualCount = dayId + 1, ExpectedCount = dayId + 1, Hour = 13 }, 
      new WorkHour() { ActualCount = dayId + 1, ExpectedCount = dayId + 1, Hour = 14 }, 
      new WorkHour() { ActualCount = dayId + 1, ExpectedCount = dayId + 1, Hour = 15 }, 
      new WorkHour() { ActualCount = dayId * 2, ExpectedCount = dayId + 1, Hour = 16 }, 
      new WorkHour() { ActualCount = dayId * 2, ExpectedCount = dayId + 1, Hour = 17 }, 
      new WorkHour() { ActualCount = dayId * 2, ExpectedCount = dayId + 1, Hour = 18 }, 
      new WorkHour() { ActualCount = dayId * 2, ExpectedCount = dayId + 1, Hour = 19 }, 
      new WorkHour() { ActualCount = dayId - 1, ExpectedCount = dayId * 2, Hour = 20 }, 
      new WorkHour() { ActualCount = dayId - 1, ExpectedCount = dayId * 2, Hour = 21 }, 
      new WorkHour() { ActualCount = dayId - 1, ExpectedCount = dayId * 2, Hour = 22 }, 
      new WorkHour() { ActualCount = dayId - 1, ExpectedCount = dayId * 2, Hour = 23 }, 
     }; 
} 

public class DaySelect 
{ 
    public string DayAbbr { get; set; } 
    public int DayID { get; set; } 
    public bool IsSelected { get; set; } 
} 

public class WorkHour 
{ 
    public int Hour { get; set; } 
    public int ExpectedCount { get; set; } 
    public int ActualCount { get; set; } 
}

중요한 것은 그리드에서 너무 많은 사용자 정의를 피하는 것이 었습니다. Day-of-Week는 데이터의 매개 변수로 사용되지만 그리드의 데이터 열을 나타내는 것은 아닙니다. 자체적으로 이동하고 눈금에 시간별 출근 데이터를 표시하십시오.(여전히 Hour, Expected 및 Actual을 요일 레이블과 정확히 일치 시키려면 명확한 열 너비를 제공 할 수 있지만 일은 실제로 열이 아니기 때문에 권장 할 수 있습니다. 따라서 탭이므로 당신은 혼란을 가져 오게 될 것입니다.)

출처

2014-06-16 15:46:19

관련 문제

 관련 문제