Payroll Evaluation 1

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.

Practical Learning: Creating the Application

Start Microsoft Visual Studio
In the Visual Studio 2026 dialog box, click Create a New Project
In the Create a New Project dialog box, in the Languages combo box, select C#
In the list of projects templates, click ASP.NET Web Application (.NET Framework)
Click Next
Specify the Project Name as PayrollEvaluation1
In Framework combo box, select the highest version (.NET Framework 4.8).
Click Create
In the Create A New ASP.NET Web Application, click Web Forms
Click Create
In the Solution Explorer, expand Content
Double-click Site.css

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 }

In the Solution Explorer, double-click Default.aspx

Change the document as follows:

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="PayrollEvaluation1._Default" %>

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

<h3 class="display-4 text-center fw-bold">Payroll Evaluation</h3>

<hr />

<div class="encloser">
    <div class="row mb-2">
        <label for="txtFirstName" class="col-form-label col-sm-5 fw-bold">First Name:</label>
        <div class="col-sm-7">
            <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-5 col-form-label">Last Name:</label>
        <div class="col-sm-7">
            <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-5 col-form-label">Hourly Salary:</label>
        <div class="col-sm-7">
            <asp:TextBox ID="txtHourlySalary" name="txtHourlySalary" class="form-control" runat="server"></asp:TextBox>
        </div>
    </div>

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

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

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

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

    <div class="row mb-2">
        <label for="txtFriday" class="fw-bold col-sm-5 col-form-label">Friday:</label>
        <div class="col-sm-7">
            <asp:TextBox id="txtFriday" name="txtFriday" 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" 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-5 col-form-label">Employee Name:</label>
        <div class="col-sm-7">
            <asp:TextBox class="form-control" id="txtEmployeeName" runat="server"></asp:TextBox>
        </div>
    </div>

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

    <div class="row mb-2">
        <label for="txtOverTime" class="fw-bold col-sm-5 col-form-label">Over Time:</label>
        <div class="col-sm-7">
            <asp:TextBox id="txtOverTime" class="form-control" name="txtOverTime" runat="server"></asp:TextBox>
        </div>
    </div>

    <div class="row mb-2">
        <label for="txtRegularPay" class="fw-bold col-sm-5 col-form-label">Regular Pay:</label>
        <div class="col-sm-7">
            <asp:TextBox id="txtRegularPay" class="form-control" name="txtRegularPay" runat="server"></asp:TextBox>
        </div>
    </div>

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

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

</asp:Content>

In the Solution Explorer, expand Default.aspx
Below it, double-click Default.aspx.cs

Change the document as follows:

using System;
using System.Web.UI;

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

        }

        protected void btnCalculate_Click(object sender, EventArgs e)
        {
            string employeeName = string.Empty;

            string strRegularTime = string.Empty;
            string strOverTime = string.Empty;
            string strRegularPay = string.Empty;
            string strOvertimePay = string.Empty;

            string strNetPay = string.Empty;

            double hourlySalary = 0.00;

            double monday = 0d;
            double tuesday = 0d;
            double wednesday = 0d;
            double thursday = 0d;
            double friday = 0d;

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

            if (!string.IsNullOrWhiteSpace(txtMonday.Text))
                monday = double.Parse(txtMonday.Text);
            if (!string.IsNullOrWhiteSpace(txtTuesday.Text))
                tuesday = double.Parse(txtTuesday.Text);
            if (!string.IsNullOrWhiteSpace(txtWednesday.Text))
                wednesday = double.Parse(txtWednesday.Text);
            if (!string.IsNullOrWhiteSpace(txtThursday.Text))
                thursday = double.Parse(txtThursday.Text);
            if (!string.IsNullOrWhiteSpace(txtFriday.Text))
                friday = double.Parse(txtFriday.Text);

            double totalTime = monday + tuesday + wednesday + thursday + friday;
            double ovtSalary = hourlySalary * 1.5;

            double regularTime = 0.00;
            double overTime = 0.00;
            double regularPay = 0.00;
            double overtimePay = 0.00;

            if (totalTime < 40)
            {
                regularTime = totalTime;
                regularPay = hourlySalary * totalTime;
                overTime = 0.00;
                overtimePay = 0.00;
            }
            else // if (totalTime >= 40)
            {
                regularTime = 40;
                overTime = totalTime - 40;
                regularPay = hourlySalary * 40;
                overtimePay = overTime * ovtSalary;
            }

            var netPay = regularPay + overtimePay;

            txtEmployeeName.Text = txtFirstName.Text + " " + txtLastName.Text;

            txtHourlySalary.Text = $"{hourlySalary:F}";

            txtMonday.Text = string.Format("{0:F}", monday);
            txtTuesday.Text = string.Format("{0:F}", tuesday);
            txtWednesday.Text = string.Format("{0:F}", wednesday);
            txtThursday.Text = string.Format("{0:F}", thursday);
            txtFriday.Text = string.Format("{0:F}", friday);

            txtRegularTime.Text = string.Format("{0:F}", regularTime);
            txtOverTime.Text = string.Format("{0:F}", overTime);
            txtRegularPay.Text = string.Format("{0:F}", regularPay);
            txtOvertimePay.Text = string.Format("{0:F}", overtimePay);
            txtNetPay.Text = string.Format("{0:F}", netPay);
        }
    }
}

In the Solution Explorer, double-click Site.Master

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</title>

    <asp:PlaceHolder runat="server">
        <%: Scripts.Render("~/bundles/modernizr") %>
    </asp:PlaceHolder>

    <webopt:bundlereference runat="server" path="~/Content/css" />
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />

</head>
<body>
    <form runat="server" class="common-font">
        <asp:ScriptManager runat="server">
            <Scripts>
                <%--To learn more about bundling scripts in ScriptManager see https://go.microsoft.com/fwlink/?LinkID=301884 --%>
                <%--Framework Scripts--%>
                <asp:ScriptReference Name="MsAjaxBundle" />
                <asp:ScriptReference Name="jquery" />
                <asp:ScriptReference Name="WebForms.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebForms.js" />
                <asp:ScriptReference Name="WebUIValidation.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebUIValidation.js" />
                <asp:ScriptReference Name="MenuStandards.js" Assembly="System.Web" Path="~/Scripts/WebForms/MenuStandards.js" />
                <asp:ScriptReference Name="GridView.js" Assembly="System.Web" Path="~/Scripts/WebForms/GridView.js" />
                <asp:ScriptReference Name="DetailsView.js" Assembly="System.Web" Path="~/Scripts/WebForms/DetailsView.js" />
                <asp:ScriptReference Name="TreeView.js" Assembly="System.Web" Path="~/Scripts/WebForms/TreeView.js" />
                <asp:ScriptReference Name="WebParts.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebParts.js" />
                <asp:ScriptReference Name="Focus.js" Assembly="System.Web" Path="~/Scripts/WebForms/Focus.js" />
                <asp:ScriptReference Name="WebFormsBundle" />
                <%--Site Scripts--%>
            </Scripts>
        </asp:ScriptManager>

        <nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-dark bg-dark mb-3">
            <div class="container">
                <a class="navbar-brand" runat="server" href="~/">Payroll Evaluation</a>
                <button type="button" class="navbar-toggler" data-bs-toggle="collapse" data-bs-target=".navbar-collapse" title="Toggle navigation" aria-controls="navbarSupportedContent"
                    aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse d-sm-inline-flex justify-content-between">
                    <ul class="navbar-nav flex-grow-1">
                        <li class="nav-item"><a class="nav-link" runat="server" href="~/">Home</a></li>
                        <li class="nav-item"><a class="nav-link" runat="server" href="~/About">About</a></li>
                        <li class="nav-item"><a class="nav-link" runat="server" href="~/Contact">Contact</a></li>
                    </ul>
                </div>
            </div>
        </nav>
        <div class="container body-content">
            <asp:ContentPlaceHolder ID="MainContent" runat="server">
            </asp:ContentPlaceHolder>
            <hr />
            <footer>
                <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>

To execute the application, press Ctrl + F5:

In the text boxes, enter the following values:

First Name:    Michael
Last Name:     Carlock
Hourly Salary: 28.46
Monday:        7
Tuesday:       6
Wednesday:     6.5
Thursday:      7.5
Friday:        6.5

Click the Calculate button:
Close your programming environment


Home	Copyright © 2021-2026, FunctionX	Thursday 26 March 2026, 21:56	Home