Even and Odd numbers from 1 to 100

Sandhiya Priya
Oct 31
371
0
0

Article

Step 1: Design Page – EvenOddNumbers.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="EvenOddNumbers.aspx.cs" Inherits="EvenOddNumbers" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Even and Odd Numbers (1 to 100) - Real Time Example</title>
    <style>
        body {
            font-family: Arial;
            background-color: #f0f2f5;
            margin: 50px;
        }
        .container {
            width: 500px;
            margin: auto;
            background: white;
            border-radius: 8px;
            box-shadow: 0px 0px 10px #ccc;
            padding: 20px;
        }
        h2 {
            color: #1A2A80;
            text-align: center;
        }
        .btn {
            background-color: #7A85C1;
            color: white;
            border: none;
            padding: 10px 20px;
            margin: 10px 0;
            border-radius: 5px;
            cursor: pointer;
            width: 100%;
        }
        .result-box {
            margin-top: 15px;
            background-color: #f7f7f7;
            padding: 10px;
            border-radius: 5px;
            font-family: Consolas;
            white-space: pre-line;
        }
        .label-title {
            font-weight: bold;
            color: #1A2A80;
            margin-top: 10px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <div class="container">
            <h2>Even and Odd Numbers (1 - 100)</h2>

            <asp:Button ID="btnShow" runat="server" Text="Show Even and Odd Numbers" CssClass="btn" OnClick="btnShow_Click" />

            <div class="label-title">Even Numbers:</div>
            <asp:Label ID="lblEven" runat="server" CssClass="result-box"></asp:Label>

            <div class="label-title">Odd Numbers:</div>
            <asp:Label ID="lblOdd" runat="server" CssClass="result-box"></asp:Label>
        </div>
    </form>
</body>
</html>

Step 2: Backend Logic – EvenOddNumbers.aspx.cs

using System;

public partial class EvenOddNumbers : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
    }

    protected void btnShow_Click(object sender, EventArgs e)
    {
        string evenNumbers = "";
        string oddNumbers = "";

        // Loop from 1 to 100
        for (int i = 1; i <= 100; i++)
        {
            if (i % 2 == 0)
                evenNumbers += i + "  ";
            else
                oddNumbers += i + "  ";
        }

        // Display results
        lblEven.Text = evenNumbers.Trim();
        lblOdd.Text = oddNumbers.Trim();
    }
}

Real-Time Example Flow

Open EvenOddNumbers.aspx in your browser.
Click “Show Even and Odd Numbers” button.
Output displays two sections:
- Even Numbers: 2, 4, 6, 8, …, 100
- Odd Numbers: 1, 3, 5, 7, …, 99

Explanation

Step	Description
1	Loop runs from 1 to 100.
2	If number divisible by 2 → Even.
3	Otherwise → Odd.
4	Display both lists in separate labels.

Sample Output

Even Numbers:
2 4 6 8 10 12 14 16 18 20 ... 100

Odd Numbers:
1 3 5 7 9 11 13 15 17 19 ... 99