CheckBox Control in Asp.net C# Web Form

Introduction to CheckBox Control

CheckBox Control: CheckBox Control is used when you want the user to select more than one option from available choices.

1. Create a new web form.

2. Drag a check box button from toolbox.

Properties:

a. Set its ID.

b. Set its Text that you want to display to the user as an option.

c. Checked is a boolean property you can set it true if you want the check box button to checked by default.

d. You can set TextAlign property left or right based upon on which side of the control you want to display the text.
e. Set its AutoPostBack property to true if you want to call a backend function whenever it is clicked or checked.
f. You can its style properties like CssClass, ForeColor, BackColor, BorderStyle, BorderColor, Height, Width, Font-Bold, Font-Size etc.

    <form id="form1" runat="server">
        <div style="align-content: center; text-align: center; font-size: large">
            <br />
            <br />
            Select your subjects:<br />
            <asp:CheckBox ID="cBoxMath" runat="server" Text="Mathematics" TextAlign="Left" AutoPostBack="true" OnCheckedChanged="cBoxMath_CheckedChanged" Height="100" ForeColor="Black" /><br />
            <asp:CheckBox ID="cboxPhy" runat="server" Text="Physics" TextAlign="Left" AutoPostBack="true" OnCheckedChanged="cboxPhy_CheckedChanged" Height="100" ForeColor="Black" /><br />
            <asp:CheckBox ID="cBoxBio" runat="server" Text="Biology" TextAlign="Left" AutoPostBack="true" OnCheckedChanged="cBoxBio_CheckedChanged" Height="100" ForeColor="Black" /><br />
            <asp:CheckBox ID="cBoxChe" runat="server" Text="Chemistry" TextAlign="Left" AutoPostBack="true" OnCheckedChanged="cBoxChe_CheckedChanged" Height="100" ForeColor="Black" /><br />
            <br />
            <asp:Label ID="lblMsg" runat="server" ForeColor="Green"></asp:Label>
        </div>
    </form>

Functions:

Most common function of check box Control is OnCheckedChanged, generate an OnCheckedChanged function by double clicking the button in design view.

Now in the function generated in .aspx.cs file you can program your logic.
We can also checked that if check box is checked or not and change its properties accordingly, and we can display a message with the checkboxes selected in the label.

        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void cBoxMath_CheckedChanged(object sender, EventArgs e)
        {
            if (cBoxMath.Checked == true)
            {
                cBoxMath.ForeColor = System.Drawing.Color.DeepPink;
            }
            else
            {
                cBoxMath.ForeColor = System.Drawing.Color.DeepSkyBlue;
            }
            displayMessage();
        }

        protected void cboxPhy_CheckedChanged(object sender, EventArgs e)
        {
            if (cboxPhy.Checked == true)
            {
                cboxPhy.ForeColor = System.Drawing.Color.DeepPink;
            }
            else
            {
                cboxPhy.ForeColor = System.Drawing.Color.DeepSkyBlue;
            }
            displayMessage();
        }

        protected void cBoxBio_CheckedChanged(object sender, EventArgs e)
        {
            if (cBoxBio.Checked == true)
            {
                cBoxBio.ForeColor = System.Drawing.Color.DeepPink;
            }
            else
            {
                cBoxBio.ForeColor = System.Drawing.Color.DeepSkyBlue;
            }
            displayMessage();
        }

        protected void cBoxChe_CheckedChanged(object sender, EventArgs e)
        {
            if (cBoxChe.Checked == true)
            {
                cBoxChe.ForeColor = System.Drawing.Color.DeepPink;
            }
            else
            {
                cBoxChe.ForeColor = System.Drawing.Color.DeepSkyBlue;
            }
            displayMessage();
        }
        private void displayMessage()
        {
            string message = "You select ";
            if (cBoxMath.Checked == true)
            {
                message += cBoxMath.Text + " - ";
            }
            if (cboxPhy.Checked == true)
            {
                message += cboxPhy.Text + " - ";
            } if (cBoxBio.Checked == true)
            {
                message += cBoxBio.Text + " - ";
            }
            if (cBoxChe.Checked == true)
            {
                message += cBoxChe.Text + " - ";
            }
            lblMsg.Text = message;
        }

Done!
Run the program.
Click the check box buttons and see the call of backend functions.





Let me know in the comment section if you have any question.


Previous Post:

Next Post: