We Keep Coding

ASP.Net Button OnClick not firing up without setting UseSubmitBehavior="false"

Good evening guys, I would like to get some help with my code, the onclick event in my register button won't fire up if I have a modal in my masterpage, but If I remove it, it works. Any suggestion on what should I do? Here is my code
<div class="container mt-5 mb-5">
<div class="row justify-content-center">
<div class="col-lg-8">
<div class="card">
<header class="card-header">
Log in
<h4 class="card-title mt-2">Sign up</h4>
</header>
<article class="card-body">
<div class="form-row mt-3">
<div class="col form-group">
<asp:Label ID="lblLastname" CssClass="col-form-label" runat="server" Text="Lastname:"></asp:Label>
<asp:TextBox ID="txtLastname" CssClass="form-control" runat="server" MaxLength="30" required="required"></asp:TextBox>
</div>
<div class="col form-group">
<asp:Label ID="lblFirstname" CssClass="col-form-label" runat="server" Text="Firstname:"></asp:Label>
<asp:TextBox ID="txtFirstname" CssClass="form-control" runat="server" MaxLength="30" required="required"></asp:TextBox>
</div>
</div>
<div class="form-row mt-3">
<div class="col form-group">
<asp:Label ID="lblUsername" CssClass="col-form-label" runat="server" Text="Username:"></asp:Label>
<asp:TextBox ID="txtUsername" CssClass="form-control" runat="server" MaxLength="40" required="required"></asp:TextBox>
</div>
<div class="col form-group">
<asp:Label ID="lblPassword" CssClass="col-form-label" runat="server" Text="Password:"></asp:Label>
<asp:TextBox ID="txtPassword" CssClass="form-control" runat="server" TextMode="Password" required="required"></asp:TextBox>
</div>
</div>
<div class="form-row mt-3">
<div class="col form-group">
<asp:Label ID="lblEmail" CssClass="col-form-label" runat="server" Text="Email:"></asp:Label>
<asp:TextBox ID="txtEmail" type="email" CssClass="form-control" runat="server" MaxLength="50" required="required"></asp:TextBox>
</div>
<div class="col form-group">
<asp:Label ID="lblPhoneNumber" CssClass="col-form-label" runat="server" Text="Phone Number:"></asp:Label>
<asp:TextBox ID="txtPhoneNumber" CssClass="form-control" runat="server" MaxLength="11" required="required"></asp:TextBox>
</div>
</div>
<div class="form-row mt-3">
<div class="col form-group">
<asp:Label ID="lblGender" CssClass="col-form-label" runat="server" Text="Gender:"></asp:Label>
<asp:DropDownList ID="ddlGender" CssClass="form-control" runat="server">
<asp:ListItem Value="0">Please select your gender</asp:ListItem>
<asp:ListItem>Male</asp:ListItem>
<asp:ListItem>Female</asp:ListItem>
</asp:DropDownList>
</div>
<div class="col form-group">
<asp:Label ID="lblBirthdate" CssClass="col-form-label" runat="server" Text="Birth Date:"></asp:Label>
<asp:TextBox ID="txtBirthdate" type="date" CssClass="form-control" runat="server" required="required"></asp:TextBox>
</div>
</div>
<div class="form-row mt-4">
<div class="col form-group">
<asp:Button ID="btnClear" CssClass="btn btn-danger btn-block" runat="server" CausesValidation="False" OnClick="btnClear_Click" Text="Reset" UseSubmitBehavior="False" />
</div>
<div class="col form-group">
<asp:Button ID="btnRegister" CssClass="btn btn-success btn-block" runat="server" OnClick="btnRegister_Click" Text="Register" />
</div>
</div>
</article>
<div class="border-top card-body text-center">Have an account? Log In</div>
</div>
</div>
</div>
</div>
And this is my code behind:
protected void btnClear_Click(object sender, EventArgs e) {
txtFirstname.Text = "";
txtLastname.Text = "";
txtUsername.Text = "";
txtPassword.Text = "";
txtEmail.Text = "";
txtPhoneNumber.Text = "";
txtBirthdate.Text = "";
ddlGender.SelectedValue = "0";
Response.Write("<script>alert('Successfully Cleared!')</script>");
}
protected void btnRegister_Click(object sender, EventArgs e) {
SqlConnection conn = new SqlConnection(#"Data Source=(LocalDB)\MSSQLLocalDB;AttachDbFilename=|DataDirectory|eMerch.mdf;Integrated Security=True");
conn.Open();
SqlCommand cmd = new SqlCommand("uspAddUser", conn);
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.AddWithValue("#uName", SqlDbType.NVarChar).Value = txtUsername.Text.Trim();
cmd.Parameters.AddWithValue("#uPassword", SqlDbType.NVarChar).Value = txtPassword.Text.Trim();
cmd.Parameters.AddWithValue("#responseMessage", SqlDbType.NVarChar);
cmd.ExecuteNonQuery();
Response.Write("<script>alert('User Registration Success!')</script>");
conn.Close();
}
and this is my code for the modal in master page:
<div class="modal fade" runat="server" id="LoginModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-center modal-login">
<asp:UpdatePanel ID="upLogin" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
<ContentTemplate>
<div class="modal-content">
<div class="modal-header">
<div class="avatar">
<img src="../Images/web/Avatar_Login.png" alt="Avatar">
</div>
<h4 class="modal-title">Member Login</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<div class="alert alert-danger collapse text-center" id="errorCredentials">
Invalid Credentials
</div>
<div class="form-group">
<label class="col-form-label">Username:</label>
<asp:TextBox ID="txtUsername" runat="server" CssClass="form-control" required="required"></asp:TextBox>
</div>
<div class="form-group">
<label class="col-form-label">Password:</label>
<asp:TextBox ID="txtPassword" runat="server" CssClass="form-control" TextMode="Password" required="required"></asp:TextBox>
</div>
<div class="form-group">
<asp:Button ID="btnLogin" runat="server" CausesValidation="False" Text="Login" CssClass="btn btn-primary btn-lg btn-block login-btn" OnClick="btnLogin_Click"/>
</div>
</div>
<div class="modal-footer">
Forgot Password?
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>

Okay i think its because you are using required="required" attribute in your code to make certain fields mandatory. When you click the register button it is causing this check validation on all fields so the ones in your modal div as well as the ones in card div. This is why its not getting to your register_onclick event. (the fields username and password or not validated as they are not entered)
You should be able to prove this by removing the required="required" from the password and username textboxes in the modal.
To add validation you could use the asp:RequiredFieldValidator instead of the required attribute for the textboxes etc you want to to make mandatory. see below
https://learn.microsoft.com/en-us/dotnet/api/system.web.ui.webcontrols.requiredfieldvalidator?view=netframework-4.8
You can also add validation groups using so each button only validates certain controls. see below
https://learn.microsoft.com/en-us/previous-versions/aspnet/ms227424(v=vs.100)
Hope this helps. Please let me know if its worked.

It looks okay from the code but its difficult to tell whats happening without the rest of you code. what does your code for the button click events look like. e.g. below.
protected void btnRegister_Click(object sender, EventArgs e)
{
}
protected void btnClear_Click(object sender, EventArgs e)
{
}
Edit: i have just tried your code in a blank webforms project and it worked for me including the validation checks. so the error must be some where else on your page / in your project. The picture below shows it running and i set a break point on the btnRegister_Click event which its hitting when i press the button after filling in all the required fields.
My Example of your code running

You're doing nothing wrong with UseSubmitBehavior = false
Microsoft says:
Use the UseSubmitBehavior property to specify whether a Button control uses the client browser's submit mechanism or the ASP.NET postback mechanism. By default the value of this property is true, causing the Button control to use the browser's submit mechanism. If you specify false, the ASP.NET page framework adds client-side script to the page to post the form to the server.
https://learn.microsoft.com/en-us/dotnet/api/system.web.ui.webcontrols.button.usesubmitbehavior?view=netframework-4.8
The browser uses form tag and grouping, like in MVC-5 flavour by default =true, because most programmers use MVC with ASP.NET.
You are using ASP.NET button events, not a form event. Consequently, UseSubmitBehavior=false is the correct setting.

Align 2nd column textbox to 1st column textbox with label in Bootstrap

How do I align my 2nd column textbox to the first one with label in Bootstrap? Here's my current code:
<div class="form-group">
<div class="col-md-6">
<asp:Label ID="lblFullName" runat="server" Text="Full Name" AssociatedControlID="txtFirstName" CssClass="control-label"></asp:Label>
<asp:TextBox ID="txtFirstName" runat="server" CssClass="form-control" placeholder="First Name"></asp:TextBox>
</div>
<div class="col-md-6">
<asp:TextBox ID="txtLastName" runat="server" CssClass="form-control" placeholder="Last Name"></asp:TextBox>
</div>
</div>

You create two rows:
<div class="form-group container">
<div class="row">
<div class="col-md-6">
<asp:Label ID="lblFullName" runat="server" Text="Full Name" AssociatedControlID="txtFirstName" CssClass="control-label"></asp:Label>
</div>
<div class="col-md-6"/>
</div>
<div class="row">
<div class="col-md-6">
<asp:TextBox ID="txtFirstName" runat="server" CssClass="form-control" placeholder="First Name"></asp:TextBox>
</div>
<div class="col-md-6">
<asp:TextBox ID="txtLastName" runat="server" CssClass="form-control" placeholder="Last Name"></asp:TextBox>
</div>
</div>
</div>

Show modal by item ID in ASP.NET WebForms

I'm using repeaters to display a list of items retrieved from the database. I would like to support basic CRUD operations on such items via a simple modal dialog box.
I have tried using onitemcommand to manipulate each item, I tried using labels to get id, I have also tried using OnClick on the buttons, with no luck.
Here it is the code for my repeater:
<div class="container-fluid">
<div class="row justify-content-left card-group">
<asp:Repeater ID="DataList1" runat="server" onitemcommand="DataList1_ItemCommand">
<ItemTemplate>
<div class="col-md-4 " style="margin-bottom: 1em;">
<%--A loop through the records in database--%>
<div class="card border-light mb-4 ">
<div class="card-content " >
<div class="card-header ">
<h4 class="my-0 font-weight-normal">
<asp:label ID="nameTage" style="font-size:16px;color:steelblue;" Text= '<%# Eval("ProjectName") %>' runat="server"/>
<asp:label ID="pID" Text='<%# DataBinder.Eval(Container.DataItem,"ProjectID") %>' runat="server" Visible="false"/>
</h4>
</div>
<div class="card-body ">
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<h6 class="card-text" style="font-size:10px; color:#a51313">
<span class="Text" > <%--The project description goes here--%>
<%-- <%= myItem["ProjDescription"].ToString() %>--%>
<%# Eval("ProjDescription") %>
</span>
</h6>
</div>
</div>
</div>
<div class="card-footer ">
<%--These are not for the submit buttons, they are for the models--%>
<%--Get the ID of the Project--%>
<%--<div class="btn-toolbar pull-right" id="buttonID" role="group" aria-label="Basic example" style="font-size:9px; color:white; align-content:center" runat="server">--%>
<asp:LinkButton type="button" ID="btn_details" class="btn btn-success btn-sm m-1" aria-pressed="true" data-toggle="modal" data-target="#detailsModal" runat="server" OnClick="IDButton1_Click" CausesValidation="false" CommandArgument='<%# DataBinder.Eval(Container.DataItem,"ProjectID") %>' CommandName="Details" Text="Details"></asp:LinkButton>
<asp:LinkButton type="button" ID="btn_edit" class="btn btn-success btn-sm m-1" aria-pressed="true" data-toggle="modal" data-target="#editModal" runat="server" CausesValidation="false" CommandArgument='<%# Eval("ProjectID") %>' CommandName="Edit" Text="Edit"></asp:LinkButton>
<asp:LinkButton type="button" ID="btn_delete" class="btn btn-success btn-sm m-1" aria-pressed="true" data-toggle="modal" data-target="#deleteModal" runat="server" CausesValidation="false" CommandArgument='<%# Eval("ProjectID") %>' CommandName="Delete" Text="Delete"></asp:LinkButton>
<%--</div>--%>
</div>
</div>
</div>
</div>
</ItemTemplate>
</asp:Repeater>
<%-- <% } %>--%>
</div>
</div>
'''
<!-- Modal for Details -->
<%--Get the ID of the Project--%>
<div class="modal fade" id="detailsModal" tabindex="-1" role="dialog" aria-labelledby="detailsModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="detailsModalLabel">Mission Project</h5>
<%--project.Name--%>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="form-horizontal col-8">
<div class="form-group row">
<asp:label Text="Project Title:" class="control-label" runat="server"/>
<asp:TextBox ID="TB1" Text="" runat="server" class="form-control" ReadOnly="true"></asp:TextBox>
</div>
<div class="form-group row">
<asp:label Text="Project Description:" class="control-label" runat="server"/>
<asp:TextBox ID="TB2" runat="server" class="form-control" rows="4" TextMode="multiline" ReadOnly="true"></asp:TextBox>
</div>
<div class="form-group row">
<asp:label Text="Department:" class="control-label" runat="server"/>
<asp:TextBox ID="TB3" runat="server" class="form-control" ReadOnly="true"></asp:TextBox>
</div>
<div class="form-group row">
<asp:label ID="HEreThere" Text="Contact Name:" class="control-label" runat="server"/>
<asp:TextBox ID="TB4" runat="server" class="form-control" ReadOnly="true"></asp:TextBox>
</div>
<div class="form-group row">
<asp:label Text="Launch Date:" class="control-label" runat="server"/>
<asp:TextBox ID="TB5" runat="server" class="form-control" ReadOnly="true"></asp:TextBox>
</div>
<div class="form-group row">
<asp:label Text="Note:" class="control-label" runat="server"/>
<asp:TextBox ID="TB6" runat="server" class="form-control" rows="7" TextMode="multiline" ReadOnly="true"></asp:TextBox>
</div>
<div class="form-group row">
<asp:label Text="Project Status:" class="control-label" runat="server"/>
<asp:TextBox ID="TB7" runat="server" class="form-control" ReadOnly="true"></asp:TextBox>
</div>
</div>
</div>
<div class="modal-footer">
<asp:Button type="button" class="btn btn-secondary" data-dismiss="modal" runat="server" Text="Close" />
</div>
</div>
</div>
</div>
protected void Page_Load(object sender, EventArgs e)
{
lblMessage.Text = "";
//data = "";
if (!IsPostBack)
{
}
DataList1.DataSource = GetProjects();
DataList1.DataBind();
}
protected void DataList1_ItemCommand(object source, RepeaterCommandEventArgs e)
{
if (e.CommandArgument != null)
{
if (e.CommandName.Equals("Details"))
{
//int MissID = Convert.ToInt32(e.CommandArgument.ToString());
//lblMessage.Text = MissID.ToString
((Label)e.Item.FindControl("pID")).Visible = true;
}
else if (e.CommandName.Equals("Edit"))
{
((Label)e.Item.FindControl("pID")).Visible = true;
}
else if (e.CommandName.Equals("Delete"))
{
((Label)e.Item.FindControl("pID")).Visible = true;
}
}
// Label label = e.Item.FindControl("pID") as Label;
}
protected void IDButton1_Click(object sender, EventArgs e)
{
RepeaterItem item = (sender as LinkButton).Parent as RepeaterItem;
int MissID = Convert.ToInt32((item.FindControl("pID") as Label).Text);
(item.FindControl("pID") as Label).Visible = true;
// get command argument here
// int MissID = Convert.ToInt32(((sender as Button).NamingContainer.FindControl("pID") as Label).Text);
// lblMessage.Text = MissID.ToString();
DataSet dsID = GetProjectByID(MissID);
this.TB1.Text = dsID.Tables[0].Rows[0]["ProjectName"].ToString();
this.TB2.Text = dsID.Tables[0].Rows[0]["ProjDescription"].ToString();
this.TB3.Text = dsID.Tables[0].Rows[0]["Department"].ToString();
this.TB4.Text = dsID.Tables[0].Rows[0]["ContactName"].ToString();
this.TB5.Text = dsID.Tables[0].Rows[0]["DueDate"].ToString();
this.TB6.Text = dsID.Tables[0].Rows[0]["Notes"].ToString();
this.TB7.Text = GetStatusText(dsID.Tables[0].Rows[0]["StatusID"].ToString());
}

Because you don't have your Repeater binding wrapped in the check for PostBack, it is rebinding anytime a button event occurs. This essentially undos the changes you make in the click event. Wrapping it in the postback check should resolve the issue.
if (!IsPostBack)
{
DataList1.DataSource = GetProjects();
DataList1.DataBind();
}

Asp C# get control in repeat

I have this html/marckup code
<div class="col-md-12 pre-scrollable">
<asp:repeater runat="server" ID="rptDataInputs">
<itemtemplate>
<div class="row">
<div class="form-group">
<label class="col-md-2 control-label" for="textinput"><asp:Literal ID="Literal22" Text='<%#DataBinder.Eval(Container.DataItem, "ID") %>' runat="server" /></label>
<div class="col-md-6">
<asp:textbox ID="tb_value" MaxLength="10" runat="server" class="form-control" style="margin-bottom:10px;" Text='<%#DataBinder.Eval(Container.DataItem, "Value") %>'/>
</div>
<div class="col-md-2">
<asp:CheckBox Text="" runat="server" Checked='<%#DataBinder.Eval(Container.DataItem, "Insert").Equals("1") %>'/>
</div>
<div class="col-md-2">
<label runat="server" id="lbl_break"><input runat="server" id="break" type="radio" name="optradio"></label>
</div>
</div>
</div>
</itemtemplate>
</asp:repeater>
</div>
i need to get the value in the radio for each line.
How could i do this?

How to hide a panel by clicking on dropdown menu?

I have a dropdown menu and it has a set of items.I want to hide a particular panel when i am clicking on a dropdown menu.
Below is my c# code and my panel is designed in asp.net.
I want to disable panel XII when i was clicking on dropdown list item Not Applicable in panel X
protected void ddsscboard_SelectedIndexChanged(object sender, EventArgs e)
{
try {
string sscpanel = ddsscboard.SelectedItem.Text;
panelshow(sscpanel);
}
catch(Exception ex)
{
}
}
public void panelshow(string sscpanel)
{
if (sscpanel == "Not Applicable")
XII.Visible = false;
else
lblmsg.Text = sscpanel;
}
}
panel:-
Class X
<div class="form-group">
<label>Select Board</label>
<asp:DropDownList ID="ddsscboard" CssClass="form-control" OnSelectedIndexChanged="ddsscboard_SelectedIndexChanged" runat="server">
<asp:ListItem>Not Applicable</asp:ListItem>
<asp:ListItem>SSC</asp:ListItem>
<asp:ListItem>CBSC</asp:ListItem>
<asp:ListItem>ICSC</asp:ListItem>
<asp:ListItem>Other</asp:ListItem>
</asp:DropDownList>
</div>
<div class="form-group">
<label>Complition Month</label>
<asp:TextBox ID="txtssccomplitionmonth" CssClass="form-control" runat="server"></asp:TextBox>
</div>
<div class="form-group">
<label>Complition Year</label>
<asp:TextBox ID="txtssccomplitionyear" CssClass="form-control" runat="server"></asp:TextBox>
</div>
<div class="form-group">
<label>Marks Obtained</label>
<asp:TextBox ID="txtsscmarksobtained" CssClass="form-control" runat="server"></asp:TextBox>
</div>
<div class="form-group">
<label>Total Marks</label>
<asp:TextBox ID="txtssctotalmarks" CssClass="form-control" runat="server"></asp:TextBox>
</div>
<div class="form-group">
<label>Upload File</label>
<asp:FileUpload ID="sscfile" runat="server" />
</div>
</div>
<!-- /.col-lg-6 (nested) -->
</div>
<!-- /.row (nested) -->
</div>
</asp:Panel>
<!-- /.panel-body -->
</div>
<!-- /.panel -->
</div>
<div class="col-lg-12">
<asp:Panel ID="XII" runat="server" CssClass="panel panel-default">
<div class="panel-heading">
Class XII
</div>
<div class="panel-body">
<div class="row">
<div class="col-lg-6">
<div class="form-group">
<label>Select Board</label>
<asp:DropDownList ID="ddhscboard" CssClass="form-control" runat="server">
<asp:ListItem>Not Applicable</asp:ListItem>
<asp:ListItem>HSC</asp:ListItem>
<asp:ListItem>CBSC</asp:ListItem>
<asp:ListItem>ICSC</asp:ListItem>
<asp:ListItem>Other</asp:ListItem>
</asp:DropDownList>
</div>
<div class="form-group">
<label>Complition Month</label>
<asp:TextBox ID="txthsccomplitionmonth" CssClass="form-control" runat="server"></asp:TextBox>
</div>
<div class="form-group">
<label>Complition Year</label>
<asp:TextBox ID="txthsccomplitionyear" CssClass="form-control" runat="server"></asp:TextBox>
</div>
<div class="form-group">
<label>Marks Obtained</label>
<asp:TextBox ID="txthscmarksobtained" CssClass="form-control" runat="server"></asp:TextBox>
</div>
<div class="form-group">
<label>Total Marks</label>
<asp:TextBox ID="txthsctotalmarks" CssClass="form-control" runat="server"></asp:TextBox>
</div>
<div class="form-group">
<label>Upload File</label>
<asp:FileUpload ID="hscfile" runat="server" />
</div>
</div>
<!-- /.col-lg-6 (nested) -->
</div>
<!-- /.row (nested) -->
</div>
</asp:Panel>
<!-- /.panel-body -->
</div>

You need to set the AutoPostBack attribute in your DropDownList to true. Note you may also want to establish a blank ListItem so "Not Applicable" is not Selected by default:
<asp:DropDownList AutoPostBack="true" ID="ddsscboard" CssClass="form-control" OnSelectedIndexChanged="ddsscboard_SelectedIndexChanged" runat="server">
<asp:ListItem></asp:ListItem>
<asp:ListItem>Not Applicable</asp:ListItem>
<asp:ListItem>SSC</asp:ListItem>
<asp:ListItem>CBSC</asp:ListItem>
<asp:ListItem>ICSC</asp:ListItem>
<asp:ListItem>Other</asp:ListItem>
</asp:DropDownList>