кнопка внутри модального загружает страницу, даже если проверки запускаются

Question

У меня есть форма, внутри которой у меня есть button1, которая запускает модал. Внутри модального окна у меня есть текстовые поля (чтобы взять некоторые учетные данные) с проверками и еще одна кнопка (button2) (type = button), содержащая определение onClick, которая работает нормально, если я предоставляю хорошие данные, но когда я не предоставляю данные в одном из текстовых полей и нажимаю на кнопку2, полная страница перезагружается, и я попадаю на главную страницу, где я нажимаю на кнопку1 и вижу сообщения проверки. Проверка должна появиться так же, как пользователь нажимает кнопку2

Я посмотрел вокруг и попробовал пару вещей, но не могу понять, почему это происходит, Я использую страницу маршрутизации в page_load, это причина?

вот код внутри модального в моем 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">&times;</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>

Код внутри ONClick_method в 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

Это происходит потому, что ваша страница выполняет постбэк, а страница полностью перезагружается, что приводит к закрытию модального режима, что может привести к потере значений.

Чтобы предотвратить полную перезагрузку страницы, вы можете использовать UpdatePanel для частичного обновления вашей страницы.

Пример:

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

Вы окружаете только ту часть, которую необходимо частично обновить, чтобы модальное окно не закрывалось, и установите для элемента управления асинхронной обратной передачи значение button2.