Question

我在html中有以下数据。

@Html.BeginForm("LoginDetails", "Home", FormMethod.Post){

<body onload="makeCalls()" style="background-image: url('../../ImageIcons/FaceLoginBG.jpg'); background-size: cover; visibility:hidden">


    <div class="captureAndCompareWindowForLogin" style="display: block; margin-left: auto;margin-right: auto;float: none;">
        <div class="centerTitle">
            <h3 style="color:white">Welcome</h3>
        </div>


        <div class="errText" id="errText" value="errText" visibility:hidden">Invalid Username and Password</div>
        <form name="loginForm" id="loginForm">
            @Html.Label("Username") <input type="text" id="userid" name="userid"/><br /><br />
            @Html.Label("Password") <input type="password" id="pswrd" name="pswrd"/><br /><br />
            <input type="button" id="btnLogin" onclick="check()" value="Login" class="btn-block">
        </form>
    </div>

    <script type="text/javascript">
        function check() {
            /* the following code checkes if user is given access */
            var userNameFromForm = document.getElementById("userid").value;
            var passwordFromForm = document.getElementById("pswrd").value;
            var lower = userNameFromForm.toLowerCase();

            if (userNameFromForm === "") {
                alert("please enter your username");
            }
            if (passwordFromForm === "") {
                alert("please enter your password");
            }
                //Display error message, reset the form and select the userid textbox
            else {
                console.log(document.getElementById("loginForm"));
                document.getElementById("loginForm").submit();

            }
        }
    </script>


</body>
}

当我点击按钮，没有空白username和password时，它会给我相应的提示消息，但是，填写的用户名和密码以及点击提交都会给我以下错误。

LoginHome:142 Uncaught TypeError: Cannot read property 'submit' of null.

请让我知道我哪里出错了，我该怎么办呢。

由于

Answer 1

在您的情况下，问题是您将表单包装在另一个表单中。请使用它：

<body onload="makeCalls()" style="background-image: url('../../ImageIcons/FaceLoginBG.jpg'); background-size: cover; visibility:hidden">


    <div class="captureAndCompareWindowForLogin" style="display: block; margin-left: auto;margin-right: auto;float: none;">
        <div class="centerTitle">
            <h3 style="color:white">Welcome</h3>
        </div>


        <div class="errText" id="errText" value="errText" visibility:hidden">Invalid Username and Password</div>
        @using (Html.BeginForm("LoginDetails", "Home", FormMethod.Post, new { id = "loginForm" }))
        {
        @Html.Label("Username") <input type="text" id="userid" name="userid" /><br /><br />
        @Html.Label("Password") <input type="password" id="pswrd" name="pswrd" /><br /><br />
        <input type="button" id="btnLogin" onclick="check()" value="Login" class="btn-block">
        }


    </div>

    <script type="text/javascript">
        function check() {
            /* the following code checkes if user is given access */
            var userNameFromForm = document.getElementById("userid").value;
            var passwordFromForm = document.getElementById("pswrd").value;
            var lower = userNameFromForm.toLowerCase();

            if (userNameFromForm === "") {
                alert("please enter your username");
            }
            if (passwordFromForm === "") {
                alert("please enter your password");
            }
                //Display error message, reset the form and select the userid textbox
            else {
                console.log(document.getElementById("loginForm"));
                document.getElementById("loginForm").submit();

            }
        }
    </script>


</body>

您的代码会将表单提交给Home/LoginDetails网址。 HomeController中的方法应该是这样的：

public ActionResult LoginDetails(string userid, string pswrd) 
{
     //do something
}

Answer 2

摆脱以下几点：

@Html.BeginForm("LoginDetails", "Home", FormMethod.Post)

或者在删除“LoginDetails”表单标记后，您可以使用以下代码。

document.getElementById("LoginDetails").submit();

困惑的Javascript帖子

2 个答案: