Передает ли кнопка «Отправить» свое значение методу действия при отправке формы? - PullRequest
1 голос
/ 04 апреля 2019

Обновление:

Каковы элементы управления / поля, значение которых будет отправлено при отправке формы назад?


В форме ASP.NET MVC, если пользователь дважды щелкаетна кнопке отправки форма будет отправлена ​​два раза.Чтобы решить эту проблему, я реализовал решение, объясненное здесь .

Это мое решение, где я отключаю кнопку отправки в форме отправки, чтобы на нее нельзя было нажать снова:

function preventFromBeingDoubleSubmitted() {
    $('form').each(function () {
        $(this).submit(function (e) {
            if ($("form").valid()) {
                // if form is valid, then disable the submit button so it cannot be double clicked (double submitted)
                $(this).find(':submit').attr('disabled', 'disabled');
            }
        });
    });
}

$(document).ready(function () {
    preventFromBeingDoubleSubmitted();
});

Это работает нормально, но с ASP я получаю очень странное поведение.NET Встроенный, идентификационный код.Моя страница входа позволяет пользователю войти в систему через Facebook или Google (каждая из этих кнопок является кнопкой отправки):

enter image description here

Это код, который генерируетПриведенная выше форма входа (это встроенный шаблон идентификации):

@{
    var loginProviders = Context.GetOwinContext().Authentication.GetExternalAuthenticationTypes();
    if (loginProviders.Count() > 0)
    {
        using (Html.BeginForm("ExternalLogin", "Account", new { ReturnUrl = Model.ReturnUrl }))
        {
            @Html.AntiForgeryToken()
            <div class="form-group">
                @foreach (AuthenticationDescription p in loginProviders.OrderBy(o => o.Caption))
                {
                    if (string.Equals(p.AuthenticationType, "google", StringComparison.InvariantCultureIgnoreCase))
                    {
                        <button type="submit" class="external-login-btn btn-google" id="@p.AuthenticationType" name="provider" value="@p.AuthenticationType" title="Log in using your @p.Caption account">Log in with @p.AuthenticationType</button>
                    }
                    if (string.Equals(p.AuthenticationType, "facebook", StringComparison.InvariantCultureIgnoreCase))
                    {
                        <button type="submit" class="external-login-btn btn-facebook" id="@p.AuthenticationType" name="provider" value="@p.AuthenticationType" title="Log in using your @p.Caption account">Log in with @p.AuthenticationType</button>
                    }
                }
            </div>
        }
    }
}

Приведенный выше код должен выполнить следующее действие контроллера (встроенный шаблон идентификации):

[HttpPost]
[AllowAnonymous]
[ValidateAntiForgeryToken]
public ActionResult ExternalLogin(string provider, string returnUrl)
{
    return new ChallengeResult(provider, Url.Action("ExternalLoginCallback", "Account", new { ReturnUrl = returnUrl }));
}

После добавления кода .js для предотвращения двойной отправки внешний вход в систему больше не работает.Проблема в том, что когда пользователь нажимает Войдите в систему с помощью кнопки Facebook , имя поставщика больше не передается в ExternalLogin Действие.

Если я удаляю функцию preventFromBeingDoubleSubmitted(), имя поставщикабудет передан в ExternalLogin Метод действия, и все работает нормально.

Что я не понимаю, так это как провайдер передается в метод действия с самого начала?И почему отключение кнопки не позволяет провайдеру войти в систему?

Ответы [ 2 ]

2 голосов
/ 06 апреля 2019

Я сначала отвечу на этот вопрос:

Что я не понимаю, так это как провайдер передается в метод действия с самого начала?

У вас есть кнопка с name="provider" value="@p.AuthenticationType", этот код передает имя провайдера вашему методу действия.

Далее:

А почему отключение кнопки не позволяет провайдеру войти в систему?

При отправке формы значение отключенных полей не передается на сервер. Это поведение по умолчанию.

Теперь, чтобы решить эту проблему, мы можем скрыть кнопку вместо ее отключения. Таким образом, в вашем preventFromBeingDoubleSubmitted() вы можете изменить $(this).find(':submit').attr('disabled', 'disabled'); на $(this).find(':submit').hide();

Надеюсь, это поможет.

Обновление

Для ответа на новый вопрос о том, какие поля включены в данные формы.

  1. <input>
  2. <button>
  3. <option>
1 голос
/ 07 апреля 2019

Форма HTML - это раздел документа, содержащий нормальное содержимое, разметку, специальные элементы, называемые элементами управления (флажки, переключатели, меню и т. Д.) И метки на этих элементах управления. Обычно пользователи «заполняют» форму, изменяя ее элементы управления (ввод текста, выбор пунктов меню и т. Д.), Прежде чем отправлять форму агенту для обработки (например, веб-серверу, почтовому серверу и т. Д.)

Пользователи взаимодействуют с формами через именованные элементы управления.

«Имя элемента управления» задается его атрибутом name. Область атрибута name для элемента управления в элементе FORM - это элемент FORM.

HTML определяет следующие типы элементов управления:

  • Кнопка
  • 1012 * флажки *
  • переключатели
  • меню: меню предлагают пользователям варианты, из которых можно выбирать. Элемент SELECT создает меню в сочетании с элементами OPTGROUP и OPTION.
  • элементы управления вводом (число, текст и т. Д.)
  • скрытые элементы управления
  • объектные элементы управления: авторы могут вставлять общие объекты в формы так, чтобы связанные значения передавались вместе с другими элементами управления. Авторы создают объектные элементы управления с помощью элемента OBJECT.

Поскольку кнопки являются элементами управления, значение кнопки будет опубликовано на сервере (если кнопки имеют имя и значение, как в вашем примере). Так что речь идет о спецификации HTML. НЕ asp.net mvc, не спецификация Microsoft

Вы можете ссылаться на эти ссылки для более подробной информации

...