Introduction

We are learning how to use the C# programming language. We are also learning to create ASP.NET Web applications. In this introductory lesson, we will create a semi-simple project with one useful webpage. The webpage will be equipped with Web controls as a time sheet. We will request some values from the user. We will then perform some operations to calculate toe regular time, the overtime, the regular pay, the overtime pay, and the net pay. We will then display a pay summary.

ApplicationPractical Learning: Creating the Application

  1. Start Microsoft Visual Studio
  2. In the Visual Studio 2026 dialog box, click Create a New Project
  3. In the Create a New Project dialog box, in the Languages combo box, select C#
  4. In the list of projects templates, click ASP.NET Web Application (.NET Framework)
  5. Click Next
  6. Specify the Project Name as PayrollEvaluation2
  7. In Framework combo box, select the highest version (.NET Framework 4.8).
    Click Create
  8. In the Create A New ASP.NET Web Application, click Web Forms
  9. Click Create
  10. In the Solution Explorer, expand Content
  11. Double-click Site.css
  12. In the document, add the following styles: 
    html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

.encloser    { margin:      auto;
               width:       450px; }
.common-font { font-family: Garamond, Georgia, Cambria, 'Times New Roman', Times, serif }
  13. In the Solution Explorer, double-click Default.aspx
  14. Change the document as follows: 
    <%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="PayrollEvaluation2._Default" %>

<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">

    <h1 class="display-5 text-center fw-bold common-font">Payroll Evaluation</h1>

    <h1 class="display-5 text-center fw-bold common-font">Payroll Evaluation</h1>

    <hr />

    <div class="row mb-2">
        <label for="txtFirstName" class="col-form-label col-sm-4 fw-bold">First Name:</label>
        <div class="col-sm-4">
            <asp:TextBox id="txtFirstName" name="txtFirstName" class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

    <div class="row mb-2">
        <label for="txtLastName" class="fw-bold col-sm-4 col-form-label">Last Name:</label>
        <div class="col-sm-4">
            <asp:TextBox id="txtLastName" name="txtLastName" class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

    <div class="row mb-2">
        <label for="txtHourlySalary" class="fw-bold col-sm-4 col-form-label">Hourly Salary:</label>
        <div class="col-sm-4">
            <asp:TextBox id="txtHourlySalary" name="txtHourlySalary"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

    <hr />

    <div class="fw-bold row mb-2">
        <div class="col-sm-5">
            <label class="col-form-label">Time Worked</label>
        </div>
        <div class="col-sm-4">
            <label>Week 1</label>
        </div>
        <div class="col-sm-3">
            <label>Week 2</label>
        </div>
    </div>

    <div class="row mb-2">
        <div class="col-sm-4">
            <label for="txtWeek1Monday" class="fw-bold col-sm-5 col-form-label">Monday:</label>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek1Monday" name="txtWeek1Monday"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek2Monday" name="txtWeek2Monday"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

    <div class="row mb-2">
        <div class="col-sm-4">
            <label for="txtWeek1Tuesday" class="fw-bold col-sm-5 col-form-label">Tuesday:</label>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek1Tuesday" name="txtWeek1Tuesday"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek2Tuesday" name="txtWeek2Tuesday"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

    <div class="row mb-2">
        <div class="col-sm-4">
            <label for="txtWeek1Wednesday" class="fw-bold col-sm-5 col-form-label">Wednesday:</label>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek1Wednesday" name="txtWeek1Wednesday"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek2Wednesday" name="txtWeek2Wednesday"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

    <div class="row mb-2">
        <div class="col-sm-4">
            <label for="txtWeek1Thursday" class="fw-bold col-sm-5 col-form-label">Thursday:</label>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek1Thursday" name="txtWeek1Thursday"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek2Thursday" name="txtWeek2Thursday"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

    <div class="row mb-2">
        <div class="col-sm-4">
            <label for="txtWeek1Friday" class="fw-bold col-sm-5 col-form-label">Friday:</label>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek1Friday" name="txtWeek1Friday"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek2Friday" name="txtWeek2Friday"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

    <div class="row mb-2">
        <label class="fw-bold col-sm-6 col-form-label"></label>
        <div class="col-sm-6">
            <asp:Button Text="Calculate Payroll" id="btnCalculate"
                 class="btn btn-danger" runat="server" OnClick="btnCalculate_Click" />
        </div>
    </div>

    <hr />

    <div class="row mb-2">
        <label for="txtEmployeeName" class="fw-bold col-sm-4 col-form-label">Employee Name:</label>
        <div class="col-sm-8">
            <asp:TextBox id="txtEmployeeName" name="txtEmployeeName"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

    <div class="fw-bold row mb-2">
        <div class="col-sm-5">
            <label class="col-form-label">Pay Summary</label>
        </div>
        <div class="col-sm-4">
            <label>Week 1</label>
        </div>
        <div class="col-sm-3">
            <label>Week 2</label>
        </div>
    </div>

    <div class="row mb-2">
        <div class="col-sm-4">
            <label for="txtWeek1RegularTime" class="fw-bold col-form-label">Regular Time:</label>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek1RegularTime" class="form-control" runat="server"></asp:TextBox>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek2RegularTime" name="txtWeek2RegularTime"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

    <div class="row mb-2">
        <div class="col-sm-4">
            <label for="txtWeek1OverTime" class="fw-bold col-form-label">Over Time:</label>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek1OverTime" class="form-control" runat="server"></asp:TextBox>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek2OverTime" name="txtWeek2OverTime"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>
    
    <div class="row mb-2">
        <div class="col-sm-4">
            <label for="txtWeek1RegularPay" class="fw-bold col-form-label">Regular Pay:</label>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek1RegularPay" class="form-control" runat="server"></asp:TextBox>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek2RegularPay" name="txtWeek2RegularPay"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

    <div class="row mb-2">
        <div class="col-sm-4">
            <label for="txtWeek1OvertimePay" class="fw-bold col-form-label">Overtime Pay:</label>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek1OvertimePay" name="txtWeek1OvertimePay" class="form-control" runat="server"></asp:TextBox>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtWeek2OvertimePay" name="txtWeek2OvertimePay"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

    <hr />

    <div class="row mb-2">
        <div class="col-sm-4">
            <label for="txtWeek1OvertimePay" class="fw-bold col-form-label">Net Pay:</label>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="TxtWeek1NetPay" class="form-control" runat="server"></asp:TextBox>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="TxtWeek2NetPay" name="TxtWeek2NetPay"
                   class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

    <div class="row mb-2">
        <div class="col-sm-4">
            <label></label>
        </div>
        <div class="col-sm-4 text-center">
            <label for="txtTotalPay" class="fw-bold col-form-label">Total Pay:</label>
        </div>
        <div class="col-sm-4">
            <asp:TextBox id="txtTotalPay" class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

</asp:Content>

</asp:Content>
  15. In the Solution Explorer, expand Default.aspx
  16. Below it, double-click Default.aspx.cs
  17. Change the document as follows: 
    using System;
using System.Web.UI;

namespace PayrollEvaluation2
{
    public partial class _Default : Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void btnCalculate_Click(object sender, EventArgs e)
        {
            double hourlySalary = 0.00d;
            double wk1Monday = 0.00d;
            double wk1Tuesday = 0.00d;
            double wk1Wednesday = 0.00d;
            double wk1Thursday = 0.00d;
            double wk1Friday = 0.00d;

            double wk2Monday = 0.00d;
            double wk2Tuesday = 0.00d;
            double wk2Wednesday = 0.00d;
            double wk2Thursday = 0.00d;
            double wk2Friday = 0.00d;

            if (!string.IsNullOrWhiteSpace(txtHourlySalary.Text))
                hourlySalary = double.Parse(txtHourlySalary.Text);

            if (!string.IsNullOrWhiteSpace(txtWeek1Monday.Text))
                wk1Monday = double.Parse(txtWeek1Monday.Text);
            if (!string.IsNullOrWhiteSpace(txtWeek1Tuesday.Text))
                wk1Tuesday = double.Parse(txtWeek1Tuesday.Text);
            if (!string.IsNullOrWhiteSpace(txtWeek1Wednesday.Text))
                wk1Wednesday = double.Parse(txtWeek1Wednesday.Text);
            if (!string.IsNullOrWhiteSpace(txtWeek1Thursday.Text))
                wk1Thursday = double.Parse(txtWeek1Thursday.Text);
            if (!string.IsNullOrWhiteSpace(txtWeek1Friday.Text))
                wk1Friday = double.Parse(txtWeek1Friday.Text);

            if (!string.IsNullOrWhiteSpace(txtWeek2Monday.Text))
                wk2Monday = double.Parse(txtWeek2Monday.Text);
            if (!string.IsNullOrWhiteSpace(txtWeek2Tuesday.Text))
                wk2Tuesday = double.Parse(txtWeek2Tuesday.Text);
            if (!string.IsNullOrWhiteSpace(txtWeek2Wednesday.Text))
                wk2Wednesday = double.Parse(txtWeek2Wednesday.Text);
            if (!string.IsNullOrWhiteSpace(txtWeek2Thursday.Text))
                wk2Thursday = double.Parse(txtWeek2Thursday.Text);
            if (!string.IsNullOrWhiteSpace(txtWeek2Friday.Text))
                wk2Friday = double.Parse(txtWeek2Friday.Text);

            double wk1TimeWorked = wk1Monday + wk1Tuesday + wk1Wednesday + wk1Thursday + wk1Friday;
            double wk2TimeWorked = wk2Monday + wk2Tuesday + wk2Wednesday + wk2Thursday + wk2Friday;
            
            double wk1RegularTime = 0.00;
            double wk1OverTime = 0.00;
            double wk1RegularPay = 0.00;
            double wk1OvertimePay = 0.00;
            
            double wk2RegularTime = 0.00;
            double wk2OverTime = 0.00;
            double wk2RegularPay = 0.00;
            double wk2OvertimePay = 0.00;

            // If the employee worked below 40 hours, there is no overtime
            if (wk1TimeWorked < 40)
            {
                wk1RegularTime = wk1TimeWorked;
                wk1OverTime = 0.00;
                wk1RegularPay = hourlySalary * wk1TimeWorked;
                wk1OvertimePay = 0.00;
            } // If the employee worked over 40 hours, calculate the overtime
            else // if (wk1TimeWorked >= 40)
            {
                wk1RegularTime = 40;
                wk1OverTime = wk1TimeWorked - 40;
                wk1RegularPay = hourlySalary * 40;
                wk1OvertimePay = wk1OverTime * hourlySalary * 1.50;
            }

            if (wk2TimeWorked < 40)
            {
                wk2RegularTime = wk2TimeWorked;
                wk2OverTime = 0.00;
                wk2RegularPay = hourlySalary * wk2TimeWorked;
                wk2OvertimePay = 0.00;
            }
            else // if (wk2TimeWorked >= 40)
            {
                wk2RegularTime = 40;
                wk2OverTime = wk2TimeWorked - 40;
                wk2RegularPay = hourlySalary * 40;
                wk2OvertimePay = hourlySalary * 1.50 * wk2OverTime;
            }

            txtEmployeeName.Text = txtFirstName.Text + " " + txtLastName.Text;
            txtHourlySalary.Text = string.Format("{0:F}", hourlySalary);
            txtWeek1Monday.Text = string.Format("{0:F}", wk1Monday);
            txtWeek1Tuesday.Text = string.Format("{0:F}", wk1Tuesday);
            txtWeek1Wednesday.Text = string.Format("{0:F}", wk1Wednesday);
            txtWeek1Thursday.Text = string.Format("{0:F}", wk1Thursday);
            txtWeek1Friday.Text = string.Format("{0:F}", wk1Friday);

            txtWeek2Monday.Text = string.Format("{0:F}", wk2Monday);
            txtWeek2Tuesday.Text = string.Format("{0:F}", wk2Tuesday);
            txtWeek2Wednesday.Text = string.Format("{0:F}", wk2Wednesday);
            txtWeek2Thursday.Text = string.Format("{0:F}", wk2Thursday);
            txtWeek2Friday.Text = string.Format("{0:F}", wk2Friday);

            txtWeek1RegularTime.Text = string.Format("{0:F}", wk1RegularTime);
            txtWeek1OverTime.Text = string.Format("{0:F}", wk1OverTime);
            txtWeek1RegularPay.Text = string.Format("{0:F}", wk1RegularPay);
            txtWeek1OvertimePay.Text = string.Format("{0:F}", wk1OvertimePay);

            txtWeek2RegularTime.Text = string.Format("{0:F}", wk2RegularTime);
            txtWeek2OverTime.Text = string.Format("{0:F}", wk2OverTime);
            txtWeek2RegularPay.Text = string.Format("{0:F}", wk2RegularPay);
            txtWeek2OvertimePay.Text = string.Format("{0:F}", wk2OvertimePay);

            var wk1NetPay = wk1RegularPay + wk1OvertimePay;
            var wk2NetPay = wk2RegularPay + wk2OvertimePay;

            TxtWeek1NetPay.Text = string.Format("{0:F}", wk1NetPay);
            TxtWeek2NetPay.Text = string.Format("{0:F}", wk2NetPay);
            txtTotalPay.Text = string.Format("{0:F}", wk1NetPay + wk2NetPay);
        }
    }
}
  18. In the Solution Explorer, double-click Site.Master
  19. Change the document as follows: 
    <%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="PayrollEvaluation1.SiteMaster" %>

<!DOCTYPE html>

<html lang="en">
<head runat="server">
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title><%: Page.Title %> - Payroll Evaluation
                <p class="text-center fw-bold">&copy; <%: DateTime.Now.Year %> - Payroll Evaluation</p>
            </footer>
        </div>
    </form>
    <asp:PlaceHolder runat="server">
        <%: Scripts.Render("~/Scripts/bootstrap.js") %>
    </asp:PlaceHolder>
</body>
</html>
  20. To execute the application, press Ctrl + F5:

    Payroll Evaluation

  21. In the text boxes, enter the following values: 
    First Name:    Michael
Last Name:     Carlock
Hourly Salary: 28.46
            Week 1  Week 2
Monday:        7      9.5
Tuesday:       6      8.5
Wednesday:     6.5   10.5
Thursday:      7.5    9
Friday:        6.5    8

    Payroll Evaluation

  22. Click the Calculate button:

    Payroll Evaluation

  23. Change the values in the text boxes with the following: 
    First Name:    Catherine
Last Name:     Busbey
Hourly Salary: 24.37
            Week 1      Week 2
Monday:        9.5      8
Tuesday:       8        7.5
Wednesday:     10.5     8
Thursday:      9        6.5
Friday:        8.5      7.5
  24. Click the Calculate button:

    Payroll Evaluation

  25. Close the browser and return to your programming environment
  26. Close your programming environment
Home Copyright © 2021-2026, FunctionX Thursday 26 March 2026, 21:56 Home