未捕获的TypeError:无法调用null的方法'submit'

时间:2013-12-16 12:41:24

标签: javascript jquery asp.net-mvc twitter-bootstrap

Here is a picture of the error.我对项目进行了一些更改后出现此错误。当您按下按钮时,它应该转到控制器以记录网站的用户。我将我的布局重新制作为bootstrap并更改/删除了很多属于该网站的CSS。这可能是相关的,但不确定如何。这是按钮的代码:

@if (Request.IsAuthenticated) {
    <text>
        Hello, @Html.ActionLink(User.Identity.Name, "Manage", "Account", routeValues: null, htmlAttributes: new { @class = "username", title = "Manage" })!
        @using (Html.BeginForm("LogOff", "Account", FormMethod.Post, new { id = "logoutForm" })) {
            @Html.AntiForgeryToken()
            <a href="javascript:document.getElementById('logoutForm').submit()">Log off</a>
        }
    </text>
} else {
    <ul>
        <li>@Html.ActionLink("Register", "Register", "Account", routeValues: null, htmlAttributes: new { id = "registerLink" })</li>
        <li>@Html.ActionLink("Log in", "Login", "Account", routeValues: null, htmlAttributes: new { id = "loginLink" })</li>
    </ul>
}

有谁知道为什么会这样?

1 个答案:

答案 0 :(得分:1)

我认为你的问题就在这条线上。

@using (Html.BeginForm("LogOff", "Account", FormMethod.Post, new { id = "logoutForm" })) {

检查您的网页来源,我认为您的操作在您的表单上看起来像这样。

action="Account/LogOff?id=logoutForm"

解决方案:

@using (Html.BeginForm("LogOff", "Account", null, FormMethod.Post, new { id = "logoutForm" })) {

那应该为你解决:)

更新

您可以切换代码以使其以不同方式工作,但仍可正常工作。

选项1:

将其粘贴到布局文件的末尾。

<script>$(function() {
    $('#logoutForm a').on('click', function () {
          $('#logoutForm').submit();
     });
</script>

选项2:

将标签更改为

<button type="submit">Log Off</button> <!-- no JavaScript -->

选项3:

<!-- I think this will work -->
<a onclick="document.getElementById('logoutForm').submit()">Log Off</a>

我个人喜欢选项2,因为你只是使用像你应该的提交按钮而不是JavaScript。

更新#2:

@using(Html.BeginForm("LogOff", "Account", null, FormMethod.Post, new { id = "logoutForm" }) {
    @Html.AntiForgeryToken()
    <button type="submit">Log Out</button>
}

应该产生:

<form action="/Account/LogOff" method="POST" id="logoutForm">
   <input type="hidden" name="__RequestVerification" value="***" />
   <button type="submit">Log Out </button>
</form>

记下操作方法属性。另外,请确保从代码中删除 text 标记,因为它们旨在强制Razor语法接受它们之间的任何内容作为文本而不是Razor语法。