Spread ASP.NET 17
Spread for ASP.NET 17 Product Documentation / Developer's Guide / Getting Started / Tutorial: Creating a Checkbook Register / Setting Up the Rows and Columns of the Register
In This Topic
    Setting Up the Rows and Columns of the Register
    In This Topic

    The Spread component on your form already has a sheet, ready for you to configure. In this step, you are going to set up the columns and cells in the sheet to resemble a checkbook register.

    1. Double-click on the form in your project to open the code window.
    2. Select the line of code
      C#
      Copy Code
      // Put user code to initialize the page here.
      
      VB
      Copy Code
      'Put user code to initialize the page here.
      

      and type the following code to replace it:

      C#
      Copy Code
      if (this.IsPostBack) return;
      // Set up component and rows and columns in sheet.
      FpSpread1.Height = Unit.Pixel(300);
      FpSpread1.Width = Unit.Pixel(763);
      FpSpread1.Sheets[0].ColumnCount = 8;
      FpSpread1.Sheets[0].RowCount = 100;
      
      VB
      Copy Code
      If (IsPostBack) Then
      Return
      End If
      ' Set up component and rows and columns in sheet.
      FpSpread1.Height = Unit.Pixel(300)
      FpSpread1.Width = Unit.Pixel(763)
      FpSpread1.Sheets(0).ColumnCount = 8
      FpSpread1.Sheets(0).RowCount = 100
      

      This code sets up the component to be 300 pixels high and 763 pixels wide, and the sheet to have 8 columns and 100 rows.

    3. Now we need to set up the columns to have custom headings. Add the following code below the code you added in Step 2:
      C#
      Copy Code
      // Add text to column heading.
      FpSpread1.ColumnHeader.Cells[0, 0].Text = "Check #";
      FpSpread1.ColumnHeader.Cells[0, 1].Text = "Date";
      FpSpread1.ColumnHeader.Cells[0, 2].Text = "Description";
      FpSpread1.ColumnHeader.Cells[0, 3].Text = "Tax?";
      FpSpread1.ColumnHeader.Cells[0, 4].Text = "Cleared?";
      FpSpread1.ColumnHeader.Cells[0, 5].Text = "Debit";
      FpSpread1.ColumnHeader.Cells[0, 6].Text = "Credit";
      FpSpread1.ColumnHeader.Cells[0, 7].Text = "Balance";
      
      VB
      Copy Code
      ' Add text to column heading.
      FpSpread1.ColumnHeader.Cells(0, 0).Text = "Check #"
      FpSpread1.ColumnHeader.Cells(0, 1).Text = "Date"
      FpSpread1.ColumnHeader.Cells(0, 2).Text = "Description"
      FpSpread1.ColumnHeader.Cells(0, 3).Text = "Tax?"
      FpSpread1.ColumnHeader.Cells(0, 4).Text = "Cleared?"
      FpSpread1.ColumnHeader.Cells(0, 5).Text = "Debit"
      FpSpread1.ColumnHeader.Cells(0, 6).Text = "Credit"
      FpSpread1.ColumnHeader.Cells(0, 7).Text = "Balance"
      
    4. Now set up the column widths to properly display our headings and the data you will add. Add the following code below the code you added in Step 3:
      C#
      Copy Code
      // Set column widths.
      FpSpread1.Sheets[0].Columns[0].Width = 50;
      FpSpread1.Sheets[0].Columns[1].Width = 50;
      FpSpread1.Sheets[0].Columns[2].Width = 200;
      FpSpread1.Sheets[0].Columns[3].Width = 40;
      FpSpread1.Sheets[0].Columns[4].Width = 65;
      FpSpread1.Sheets[0].Columns[5].Width = 100;
      FpSpread1.Sheets[0].Columns[6].Width = 100;
      FpSpread1.Sheets[0].Columns[7].Width = 125;
      
      VB
      Copy Code
      ' Set column widths.
      FpSpread1.Sheets(0).Columns(0).Width = 50
      FpSpread1.Sheets(0).Columns(1).Width = 50
      FpSpread1.Sheets(0).Columns(2).Width = 200
      FpSpread1.Sheets(0).Columns(3).Width = 40
      FpSpread1.Sheets(0).Columns(4).Width = 65
      FpSpread1.Sheets(0).Columns(5).Width = 100
      FpSpread1.Sheets(0).Columns(6).Width = 100
      FpSpread1.Sheets(0).Columns(7).Width = 125
      
    5. Save your project, then from the Debug menu choose Start to run your project.

    Your ASP.NET page should look similar to the following picture.

    Custom Checkbook Register