ASP.Net Кнопка OnClick не запускается без установки UseSubmitBehavior=»false»

#c# #html #asp.net #button

#c# #HTML #asp.net #кнопка

Вопрос:

Добрый вечер, ребята, я хотел бы получить некоторую помощь с моим кодом, событие onclick в моей кнопке регистрации не будет запускаться, если у меня есть модальное значение на моей главной странице, но если я его удалю, оно сработает. Есть предложения о том, что мне делать? Вот мой код

 <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">
                    <a href="#" class="float-right btn btn-outline-primary mt-1">Log in</a>
                    <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? <a href="#">Log In</a></div>
            </div>
        </div>
    </div>
</div>
 

И это мой код, лежащий в основе:

 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();
    }
 

и это мой код для модальной главной страницы:

 <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">amp;times;</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">
                            <a href="#">Forgot Password?</a>
                        </div>
                    </div>
                </ContentTemplate>
            </asp:UpdatePanel>  
        </div>
    </div>
 

Ответ №1:

Хорошо, я думаю, это потому, что вы используете атрибут required=»required» в своем коде, чтобы сделать определенные поля обязательными. Когда вы нажимаете кнопку регистрации, это вызывает проверку проверки во всех полях, как в вашем модальном div, так и в карточном div. Вот почему он не попадает в ваше событие register_onclick. (поля имя пользователя и пароль или не проверены, поскольку они не введены)

Вы должны быть в состоянии доказать это, удалив required=»требуется» из текстовых полей password и username в модальном.

Чтобы добавить проверку, вы можете использовать asp:RequiredFieldValidator вместо требуемого атрибута для текстовых полей и т. Д., Которые вы хотите сделать обязательными. смотрите ниже

https://docs.microsoft.com/en-us/dotnet/api/system.web.ui.webcontrols.requiredfieldvalidator?view=netframework-4.8

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

https://docs.microsoft.com/en-us/previous-versions/aspnet/ms227424 (v=против 100)

Надеюсь, это поможет. Пожалуйста, дайте мне знать, сработало ли это.

Комментарии:

1. Боже, ты нашел это, это сработало, я удалил его, тогда все заработало, большое тебе спасибо! но кто-то сказал, что использование asp:validators намного лучше по сравнению со встроенными валидаторами браузера, поэтому я предполагаю, что я реализую валидаторы asp

2. Прохладный. Рад, что это помогло. да, вы должны использовать валидаторы asp в веб-формах, поэтому включили ссылки на группы управления и проверки проверки обязательных полей. удачи!

Ответ №2:

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

   protected void btnRegister_Click(object sender, EventArgs e)
        {

        }

        protected void btnClear_Click(object sender, EventArgs e)
        {

        }
 

Редактировать: я только что попробовал ваш код в пустом проекте webforms, и он сработал для меня, включая проверки проверки. таким образом, ошибка должна быть где-то еще на вашей странице / в вашем проекте. На рисунке ниже показано, что она запущена, и я устанавливаю точку останова для события btnRegister_Click, которое срабатывает, когда я нажимаю кнопку после заполнения всех обязательных полей.

Мой пример выполнения вашего кода

Комментарии:

1. Приветствую, я обновил свой пост и добавил код, лежащий в основе

2. Я только что обновил свой ответ выше. Код, которым вы поделились, работает для меня.

3. Я только что кое-что узнал, когда я удаляю свой модальный файл с главной страницы, кнопка срабатывает, но когда она находится на моей главной странице, кнопка не работает

4. Я обновил вопрос выше и добавил свой модальный код

5. Есть ли у вас scriptmanager на странице для панели обновлений?

Ответ №3:

Вы не делаете ничего плохого с UseSubmitBehavior = false

Microsoft заявляет:

Используйте свойство UseSubmitBehavior, чтобы указать, использует ли элемент управления Button механизм отправки клиентского браузера или ASP.NET механизм обратной передачи. По умолчанию значение этого свойства равно true, в результате чего элемент управления кнопкой использует механизм отправки браузера. Если вы укажете false, ASP.NET page framework добавляет на страницу клиентский скрипт для отправки формы на сервер.

https://docs.microsoft.com/en-us/dotnet/api/system.web.ui.webcontrols.button.usesubmitbehavior?view=netframework-4.8

Браузер использует тег формы и группировку, как в MVC-5 по умолчанию = true, потому что большинство программистов используют MVC с ASP.NET .

Вы используете ASP.NET события кнопок, а не событие формы. Следовательно, UseSubmitBehavior=false является правильной настройкой.

Комментарии:

1. Но если я установлю для нее значение false, проверка required=»required» для элементов управления не будет распознана, а также установка типа текстового поля на email, чтобы проверить, что @…com тоже не будет распознан

2. Я не привык к библиотечному вкусу ASP.NET вы спрашиваете об этом, потому что я использую MVC-5 с формами. My required= работает как атрибут в свойстве ViewModel, а ViewModel представляет полную форму. Думаю, вам лучше переключиться на использование MVC, класса Viewmodel и формы, если вы хотите использовать атрибут =required, предназначенный для Viewmodels ? Я не уверен.. но я вполне уверен в своем ответе.

3. В веб-формах обычно используются asp:required средства проверки вместо встроенной проверки браузера. Одна из причин заключается в том, что веб-формы предшествуют текущей доступности встроенной проверки браузера. Это также обеспечивает преимущество встроенной проверки на стороне сервера в качестве резервной копии,