Question

我正在将现有网站转换为使用MVC和实体框架。

布局/样式应该保持不变，为了遵循该指南，我需要使用<a>标签提交我的登录表单，因为它有按钮的自定义图像。

这是我的表格：

@using (Html.BeginForm("Login", "Login", FormMethod.Post, new { id = "login", action = "Login" }))
{
    <label>
        <span>Username
        </span>
        <input type="text" name="UserName" id="UserName" class="input-text required" />
    </label>
    <label>
        <span>Password
        </span>
        <input type="password" name="Password" id="Password" class="input-text required" />
    </label>
    <label>
        <input type="checkbox" name="RememberMe" id="RememberMe" class="check-box" />
        <span class="checkboxlabel">Remember Me</span>
    </label>
    <div class="spacer">
        <a href="javascript:void(0)" onclick="login();" class="login-button"></a>
    </div>
}

如您所见，<a>标记以前使用javascript提交了登录信息。这不是我想要实现的目标。

如何更改该标记以将表单提交给我的控制器操作？

Answer 1

我做了一些小改动

HTML

<form action="test.aspx" type="POST">
    <label>
        <span>Username</span>
        <input type="text" name="UserName" id="UserName" class="input-text required" />
    </label>
    <label>
        <span>Password</span>
        <input type="password" name="Password" id="Password" class="input-text required" />
    </label>
    <label>
        <input type="checkbox" name="RememberMe" id="RememberMe" class="check-box" />
        <span class="checkboxlabel">Remember Me</span>
    </label>
    <div class="spacer">
        <a href="javascript:void(0)" class="login-button">Login</a>
    </div>
</form>

jquery的

$(document).ready(function(){
   $(document).on("click",".login-button",function(){
     var form = $(this).closest("form");
     //console.log(form);
     form.submit();
   });
});

JSFiddle

Answer 2

通常你不想在html标签中加入大量的javascript，但是如果这只在你的解决方案中出现一次就没关系了。但是，如果有需要使用Gokan解决方案发布的锚标签，则可以更好地使用标记类和一些常见的javascript。

将您的锚标记更改为更像这样：

<a href="javascript:$('form').submit();" class="login-button"></a>

Answer 3

只需要更改单行，对于 @using (Html.BeginForm("Login", "Login", FormMethod.Post, new { id = "login", action = "Login" })) { // your HTML code <div class="spacer"> <a href="" onclick='$("#login").submit()' class="login-button"></a> </div> } 我认为这是最佳方式。

{{1}}

锚标记作为提交按钮？

3 个答案: