button inside modal loads the page even if validations fire - asp.net

Question

I have a form inside which I have a button1 which triggers the modal.
Inside modal window I have textboxes(to take some credentials) with validations and another button (button2) (type=button) containing onClick definition which is working fine if I provide good data, but when I provide no data in one of the text boxes and click on the button2 the complete page reloads and I get to my main page where I click on button1 and I see the validation messages.
The validation should appear just as the user clicks button2
I have looked around and tried couple of thing but cant figure out why is it happening,
I am using page routing in page_load is that the reason?
here is the code inside the modal in my html.aspx:
<form=from1 runat=server>
<div class="modal fade" id="logger_modal" tabindex="-1" role="dialog" aria-labelledby="logger_model1" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body align-content-center">
<asp:TextBox ID="textbox1" runat="server" Class="form-control" placeholder="sometext" onkeydown = "return (event.keyCode!=13);"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="message1" ControlToValidate="textbox1" EnableClientScript="false" Display="Dynamic" ></asp:RequiredFieldValidator>
<asp:TextBox ID="textbox2" runat="server" Class="form-control" placeholder="sometext" onkeydown = "return (event.keyCode!=13);"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="message2" ControlToValidate="textbox2" EnableClientScript="false" Display="Dynamic"></asp:RequiredFieldValidator>
</div>
<div class="modal-footer">
<asp:Button ID="close" runat="server" Text="Cancel" type="button" class="btn btn-secondary" data-dismiss="modal"/>
<asp:Button ID="button2" runat="server" Text="button2_text" type="button" class="btn btn-primary" CausesValidation="true" OnClick="OnClick_method" />
<asp:Label ID="Label1" runat="server"></asp:Label>
</div>
</div>
</div>
</div>
Code inside ONClick_method in html.aspx.cs
if (Page.IsValid)
{
some code which works if i provide right values in textboxes
}
else
{
Label1.Text = "Please provide the details.";
}

Answer 1

This happens because your page does a postback and the page does a complete reload which results in closing the modal which causes probably the lose of values.
To prevent the page from completely reloading you can use a UpdatePanel for partial update of your page.
Example:
<div class="modal-body align-content-center">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:TextBox ID="textbox1" runat="server" Class="form-control" placeholder="sometext" onkeydown="return (event.keyCode!=13);"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="message1" ControlToValidate="textbox1" EnableClientScript="false" Display="Dynamic"></asp:RequiredFieldValidator>
<asp:TextBox ID="textbox2" runat="server" Class="form-control" placeholder="sometext" onkeydown="return (event.keyCode!=13);"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="message2" ControlToValidate="textbox2" EnableClientScript="false" Display="Dynamic"></asp:RequiredFieldValidator>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="button2" />
</Triggers>
</asp:UpdatePanel>
</div>
You only surround the part that needs to be partially updated so the modal won't close and set the control for the async postback to button2.