Row Header Columns

scheduler-asp.net-row-header-columns.png

The row (resource) header can display multiple columns.

See also Row header width auto-fit.

ASP.NET WebForms

Create the columns

<DayPilot:DayPilotScheduler ID="DayPilotScheduler1" runat="server" 
    ...
    >
    <HeaderColumns>
        <DayPilot:RowHeaderColumn Width="100" Title="Room" />
        <DayPilot:RowHeaderColumn Width="60" Title="Color" />
        <DayPilot:RowHeaderColumn Width="40" Title="Size" />
    </HeaderColumns>

Fill the column data

Declarative way (.aspx):

<DayPilot:Resource Name="Room A" Value="A" Expanded="True">
  <Columns>
    <DayPilot:ResourceColumn InnerHTML="Gray" />
    <DayPilot:ResourceColumn InnerHTML="25 people" />
  </Columns></DayPilot:Resource>

Programmatic way (.aspx.cs):

DayPilotScheduler1.Resources[0].Columns.Add(new ResourceColumn("Gray"));
DayPilotScheduler1.Resources[0].Columns.Add(new ResourceColumn("25 people"));

Fill the column data (unknown rows)

This methods is useful for Gantt and Timesheet modes where the rows are not created from the Resources collection.

protected void DayPilotScheduler1_BeforeResHeaderRender(object sender, BeforeResHeaderRenderEventArgs e)
{
  e.Columns[0].Html = "Blue";
  e.Columns[1].Html = "25 People";
}

Demo

ASP.NET MVC

scheduler-asp.net-mvc-row-header-columns.png

Create the columns

@Html.DayPilotScheduler("dps_rowheadercolumns", new DayPilotSchedulerConfig {
  BackendUrl = ResolveUrl("~/Scheduler/Backend"),
  HeaderColumns = new RowHeaderColumnCollection
  {
    new RowHeaderColumn("Name", 50),
    new RowHeaderColumn("Seats", 50)
  },
  ...
})

Fill the column data

The content of the additional columns can be changed using Resource.Columns collection:

class Dps : DayPilotScheduler
{
  protected override void OnInit(InitArgs ea)
  {
    Resource r = new Resource("Room A", "A");
    r.Columns.Add(new ResourceColumn("Col A"));
    r.Columns.Add(new ResourceColumn("Col B"));
    Resources.Add(r);

    UpdateWithMessage("Initialized.", CallBackUpdateType.Full);
  }
}

Fill the column data (unknown rows)

This methods is useful for Gantt and Timesheet modes where the rows are not created from the Resources collection.

protected override void OnBeforeResHeaderRender(BeforeResHeaderRenderArgs e)
{
  e.Columns[0].Html = "10 seats";
}

Demo

JavaScript

Definition

dp.rowHeaderColumns = [
  { title: 'Room', width: 150 },
  { title: 'Beds', width: 100 }
];    

Data

dp.resources = [
 { name: "Room A", id: "A", columns: [ {html:"2 beds"} ] },
 { name: "Room B", id: "B", columns: [ {html:"1 bed"} ] },
 { name: "Room C", id: "C", columns: [ {html:"3 beds"} ] }
];

See also DayPilot.Scheduler.onBeforeResHeaderRender.

Demo

DayPilot for JavaScript, ASP.NET WebForms, ASP.NET MVC, Java