<a>使用Html.BeginFrom在ASP.Net MVC中</a>提交帶有錨點（ <a>）標記</a>的表單，該表單具有<a>一些值</a>

Question

我正在使用Html.BeginFrom ...創建一個來自Tag和Submit請求，以使用外部登錄提供程序。

帳戶控制器中的HttpPost操作

//
// POST: /Account/ExternalLogin

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

我需要將RetunUrl和Provider發送到上述操作方法。目前，我正在使用帶有Razor的Foreach創建多個表單

@foreach (ExternalLoginViewModel loginViewModel in Model)
{
    using (Html.BeginForm("ExternalLogin", "Account", new { Provider = loginViewModel.AuthenticationClientData.DisplayName, ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post))
    {
        @Html.AntiForgeryToken()
        <a class="@loginViewModel.AnchorCssClass" style="@loginViewModel.AnchorCssStyle" href="#">
            <div class="@loginViewModel.DivCssClass" style="@loginViewModel.DivCssStyle">
                <span aria-hidden="true" class="@loginViewModel.IconCssClass"></span>
            </div>
        </a>
    }
}  

但我認為可以使用單個from來完成，但是我不知道如何提供Provider值，該值隨anchorTag的不同而有所不同：

using (Html.BeginForm("ExternalLogin", "Account", new { Provider = "<SomeValue>", ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post))
{
        @Html.AntiForgeryToken()
        @foreach (ExternalLoginViewModel loginViewModel in Model)
        {
             <a class="@loginViewModel.AnchorCssClass" style="@loginViewModel.AnchorCssStyle" href="#">
                <div class="@loginViewModel.DivCssClass" style="@loginViewModel.DivCssStyle">
                    <span aria-hidden="true" class="@loginViewModel.IconCssClass"></span>
                 </div>
            </a>
        }

 }

在較早的情況下使用的Javascript是（正常工作）

<script type="text/javascript">
    $(document).ready(function() {
        $(document).on("click", ".CSSclassonAnchor", function (e) {
            e.preventDefault();
            var form = $(this).closest("form");
            form.submit();
        });
    });
</script> 

我認為使用錨定標記以某種方式發布數據是有可能的。在這方面的任何幫助都將非常有用。

Answer 1

一種方法是在表單中添加一個隱藏字段，然后用javascript填充它。 在您的視圖中，將BeginForm修改為no include Provider參數，並以以下形式添加<input type="hidden" /> ：

using (Html.BeginForm("ExternalLogin", "Account", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post))
{
    @Html.AntiForgeryToken()
    @Html.Hidden("Provider", "", new {id=hdnprovider})
    @foreach (ExternalLoginViewModel loginViewModel in Model)
    {
         <a class="@loginViewModel.AnchorCssClass" style="@loginViewModel.AnchorCssStyle" href="#" data-name="@loginViewModel.AuthenticationClientData.DisplayName">
            <div class="@loginViewModel.DivCssClass" style="@loginViewModel.DivCssStyle">
                <span aria-hidden="true" class="@loginViewModel.IconCssClass"></span>
             </div>
        </a>
    }
 }

然后在Javascript中，使用所單擊鏈接的data-name屬性，並將其分配給隱藏的：

$(document).ready(function() {
    $('a[data-name]').click(function (e) {
        e.preventDefault();
        var form = $(this).closest("form");
        $("#hdnprovider").val($(this).data("Name"));
        form.submit();
    });
});

由於隱藏的名稱為“ Provider”，它將自動綁定到控制器中的“ Provider”參數。